|
@@ -8,46 +8,30 @@
|
|
|
:loading="loading"
|
|
|
highlight-current-row
|
|
|
:selectConfig="selectConfig"
|
|
|
- :table-events="{
|
|
|
- //element talbe事件都能传
|
|
|
- select: select,
|
|
|
- }"
|
|
|
:action-list="[]"
|
|
|
- @get-list="getList"
|
|
|
- >
|
|
|
+ @get-list="getList">
|
|
|
</byTable>
|
|
|
<div>
|
|
|
<div>已选择货品</div>
|
|
|
<div style="margin: 10px 0px">
|
|
|
- <el-tag
|
|
|
- style="margin-right: 10px"
|
|
|
- type="info"
|
|
|
- closable
|
|
|
- v-for="(good, index) in goodList"
|
|
|
- :key="good.id"
|
|
|
- @close="handleRemove(index)"
|
|
|
- >{{ good.name }}</el-tag
|
|
|
- >
|
|
|
+ <el-tag style="margin-right: 10px" type="info" closable v-for="(good, index) in goodList" :key="good.id" @close="handleRemove(index)">
|
|
|
+ {{ good.name }}
|
|
|
+ </el-tag>
|
|
|
</div>
|
|
|
<div style="text-align: center">
|
|
|
- <el-button @click="handleCancel" size="large">取消</el-button>
|
|
|
- <el-button type="primary" @click="handleSubmit" size="large">
|
|
|
- 确 定
|
|
|
- </el-button>
|
|
|
+ <el-button @click="handleCancel" size="large">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="handleSubmit" size="large">确 定</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
-
|
|
|
+
|
|
|
<script setup>
|
|
|
-/* eslint-disable vue/no-unused-components */
|
|
|
-import { ElMessage, ElMessageBox } from "element-plus";
|
|
|
+import { ElMessage } from "element-plus";
|
|
|
import byTable from "@/components/byTable/index";
|
|
|
-import byForm from "@/components/byForm/index";
|
|
|
-import treeList from "@/components/product/treeList";
|
|
|
-import { computed, defineComponent, ref, watch } from "vue";
|
|
|
+import { computed, ref } from "vue";
|
|
|
+
|
|
|
const loading = ref(false);
|
|
|
-const submitLoading = ref(false);
|
|
|
const sourceList = ref({
|
|
|
data: [],
|
|
|
pagination: {
|
|
@@ -60,24 +44,12 @@ const sourceList = ref({
|
|
|
definition: "1",
|
|
|
},
|
|
|
});
|
|
|
-let dialogVisible = ref(false);
|
|
|
-let openExcelDialog = ref(false);
|
|
|
-
|
|
|
-let modalType = ref("add");
|
|
|
-let rules = ref({
|
|
|
- productClassifyId: [
|
|
|
- { required: true, message: "请选择产品分类", trigger: "change" },
|
|
|
- ],
|
|
|
- type: [{ required: true, message: "请选择产品类型", trigger: "change" }],
|
|
|
- name: [{ required: true, message: "请输入产品名称", trigger: "blur" }],
|
|
|
- unit: [{ required: true, message: "请选择单位", trigger: "change" }],
|
|
|
-});
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
const selectConfig = reactive([
|
|
|
{
|
|
|
label: "物品类型",
|
|
|
prop: "definition",
|
|
|
- isShowAll: false, //不显示全部搜索
|
|
|
+ isShowAll: false,
|
|
|
data: [
|
|
|
{
|
|
|
label: "产品",
|
|
@@ -89,11 +61,6 @@ const selectConfig = reactive([
|
|
|
},
|
|
|
],
|
|
|
},
|
|
|
- {
|
|
|
- label: "所属分类",
|
|
|
- prop: "productClassifyId",
|
|
|
- data: [],
|
|
|
- },
|
|
|
]);
|
|
|
const config = computed(() => {
|
|
|
return [
|
|
@@ -147,7 +114,6 @@ const config = computed(() => {
|
|
|
align: "center",
|
|
|
fixed: "right",
|
|
|
},
|
|
|
- // 渲染 el-button,一般用在最后一列。
|
|
|
renderHTML(row) {
|
|
|
return [
|
|
|
{
|
|
@@ -166,145 +132,40 @@ const config = computed(() => {
|
|
|
},
|
|
|
];
|
|
|
});
|
|
|
-
|
|
|
-let formData = reactive({
|
|
|
- data: {},
|
|
|
-});
|
|
|
-const formOption = reactive({
|
|
|
- inline: true,
|
|
|
- labelWidth: 100,
|
|
|
- itemWidth: 100,
|
|
|
- rules: [],
|
|
|
-});
|
|
|
-const byform = ref(null);
|
|
|
-const treeListData = ref([]);
|
|
|
-const formConfig = computed(() => {
|
|
|
- return [
|
|
|
- {
|
|
|
- type: "treeSelect",
|
|
|
- prop: "productClassifyId",
|
|
|
- label: "产品分类",
|
|
|
- data: [],
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- prop: "type",
|
|
|
- label: "产品类型",
|
|
|
- required: true,
|
|
|
- data: [
|
|
|
- {
|
|
|
- label: "成品",
|
|
|
- id: "1",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "半成品",
|
|
|
- id: "2",
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "name",
|
|
|
- label: "产品名称",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "spec",
|
|
|
- label: "规格型号",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- prop: "unit",
|
|
|
- label: "单位",
|
|
|
- required: true,
|
|
|
- data: [
|
|
|
- {
|
|
|
- label: "个",
|
|
|
- id: "个",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "双",
|
|
|
- id: "双",
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- {
|
|
|
- type: "slot",
|
|
|
- slotName: "productPic",
|
|
|
- prop: "fileList",
|
|
|
- label: "产品图片",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "remark",
|
|
|
- label: "备注",
|
|
|
- itemType: "textarea",
|
|
|
- },
|
|
|
- ];
|
|
|
-});
|
|
|
-
|
|
|
-const lastDefinition = ref("");
|
|
|
+const table = ref(null);
|
|
|
+const productUnit = ref([]);
|
|
|
+const getDict = () => {
|
|
|
+ proxy.getDictOne(["unit"]).then((res) => {
|
|
|
+ productUnit.value = res["unit"].map((x) => ({
|
|
|
+ label: x.dictValue,
|
|
|
+ value: x.dictKey,
|
|
|
+ }));
|
|
|
+ });
|
|
|
+};
|
|
|
+getDict();
|
|
|
const getList = async (req = {}) => {
|
|
|
- for (const key in req) {
|
|
|
- sourceList.value.pagination[key] = req[key];
|
|
|
- if (key === "definition") {
|
|
|
- if (lastDefinition.value !== req[key]) {
|
|
|
- getTreeList();
|
|
|
- lastDefinition.value = req[key];
|
|
|
- // 如果选择的物品分类不一致,则分类默认选中全部
|
|
|
- return table.value.searchItemSelct("all", selectConfig[1]);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
sourceList.value.pagination = {
|
|
|
...sourceList.value.pagination,
|
|
|
...req,
|
|
|
};
|
|
|
loading.value = true;
|
|
|
- proxy
|
|
|
- .post("/productInfo/page", sourceList.value.pagination)
|
|
|
- .then((message) => {
|
|
|
- sourceList.value.data = message.rows.map((x) => ({ ...x, fileList: [] }));
|
|
|
- sourceList.value.pagination.total = message.total;
|
|
|
- setTimeout(() => {
|
|
|
- loading.value = false;
|
|
|
- }, 200);
|
|
|
-
|
|
|
- const productIdList = message.rows.map((x) => x.id);
|
|
|
- // 请求文件数据并回显
|
|
|
- if (productIdList.length > 0) {
|
|
|
- proxy
|
|
|
- .post("/fileInfo/getList", { businessIdList: productIdList })
|
|
|
- .then((fileObj) => {
|
|
|
- for (let i = 0; i < sourceList.value.data.length; i++) {
|
|
|
- const e = sourceList.value.data[i];
|
|
|
- for (const key in fileObj) {
|
|
|
- if (e.id === key) {
|
|
|
- e.fileList = fileObj[key];
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-const getTreeList = () => {
|
|
|
- proxy
|
|
|
- .post("/productClassify/tree", {
|
|
|
- parentId: "",
|
|
|
- name: "",
|
|
|
- definition: sourceList.value.pagination.definition,
|
|
|
- })
|
|
|
- .then((message) => {
|
|
|
- selectConfig[1].data = message.map((x) => ({
|
|
|
- label: x.label,
|
|
|
- value: x.id,
|
|
|
- }));
|
|
|
- });
|
|
|
+ proxy.post("/productInfo/page", sourceList.value.pagination).then((message) => {
|
|
|
+ sourceList.value.data = message.rows.map((x) => ({ ...x, fileList: [] }));
|
|
|
+ sourceList.value.pagination.total = message.total;
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false;
|
|
|
+ }, 200);
|
|
|
+ });
|
|
|
};
|
|
|
-
|
|
|
+getList();
|
|
|
+// 接收父组件的传值
|
|
|
+const props = defineProps({
|
|
|
+ selectList: Array,
|
|
|
+});
|
|
|
const goodList = ref([]);
|
|
|
+onMounted(() => {
|
|
|
+ goodList.value = proxy.deepClone(props.selectList);
|
|
|
+});
|
|
|
const handleSelect = (row) => {
|
|
|
const flag = goodList.value.some((x) => x.id === row.id);
|
|
|
if (flag)
|
|
@@ -321,7 +182,6 @@ const handleSelect = (row) => {
|
|
|
type: "success",
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
const handleRemove = (index) => {
|
|
|
goodList.value.splice(index, 1);
|
|
|
return ElMessage({
|
|
@@ -329,7 +189,6 @@ const handleRemove = (index) => {
|
|
|
type: "success",
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
const handleSubmit = () => {
|
|
|
if (!goodList.value.length > 0)
|
|
|
return ElMessage({
|
|
@@ -339,34 +198,12 @@ const handleSubmit = () => {
|
|
|
proxy.$emit("pushGoods", goodList.value);
|
|
|
goodList.value = [];
|
|
|
};
|
|
|
-
|
|
|
const handleCancel = () => {
|
|
|
goodList.value = [];
|
|
|
proxy.$emit("cancel");
|
|
|
};
|
|
|
-
|
|
|
-const table = ref(null);
|
|
|
-
|
|
|
-const searchItemSelct = () => {
|
|
|
- // 默认选中的方法
|
|
|
- table.value.searchItemSelct(selectConfig[0].data[0], selectConfig[0]);
|
|
|
-};
|
|
|
-const productUnit = ref([]);
|
|
|
-const getDict = () => {
|
|
|
- proxy.getDictOne(["unit"]).then((res) => {
|
|
|
- productUnit.value = res["unit"].map((x) => ({
|
|
|
- label: x.dictValue,
|
|
|
- value: x.dictKey,
|
|
|
- }));
|
|
|
- });
|
|
|
-};
|
|
|
-getDict();
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- searchItemSelct();
|
|
|
-});
|
|
|
</script>
|
|
|
-
|
|
|
+
|
|
|
<style lang="scss" scoped>
|
|
|
.user {
|
|
|
padding: 20px;
|
|
@@ -386,4 +223,4 @@ onMounted(() => {
|
|
|
cursor: pointer;
|
|
|
vertical-align: middle;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|