Ver Fonte

Merge branch '包材配置-包材关联配置'

lxf há 1 ano atrás
pai
commit
274bc4d8f8

+ 3 - 1
src/components/byForm/index.vue

@@ -104,7 +104,9 @@
             :disabled="i.disabled ? i.disabled : false"
             v-else-if="i.type == 'switch'"
             :readonly="i.readonly ? i.readonly : false"
-            v-model="formData[i.prop]" />
+            v-model="formData[i.prop]"
+            :active-value="i.active ? i.active : true"
+            :inactive-value="i.inactive || i.inactive === 0 ? i.inactive : false" />
           <el-checkbox-group
             v-else-if="i.type == 'checkbox'"
             v-model="formData[i.prop]"

+ 14 - 0
src/components/makeGroupProduct/index.vue

@@ -632,6 +632,20 @@ const selectBOM = (item) => {
     formData.data.skuSpecList[rowIndex.value].netWeight = item.netWeight;
     ElMessage({ message: "选择完成", type: "success" });
     openBOM.value = false;
+    proxy.post("/skuDefaultPackageSpec/getPackList", { skuId: formData.data.id, spec: item.length + "*" + item.width + "*" + item.height }).then((res) => {
+      if (res && res.length > 0) {
+        formData.data.skuSpecList[rowIndex.value].packagingMaterialList = res.map((val) => {
+          return {
+            bomSpecId: val.bomSpecId,
+            quantity: 1,
+            name: val.bomSpecName,
+          };
+        });
+      } else {
+        formData.data.skuSpecList[rowIndex.value].packagingMaterialList = [];
+      }
+      ElMessage({ message: "根据规格尺寸替换包材配件完成", type: "success" });
+    });
   }
 };
 const clickRemoveBOM = (index) => {

+ 14 - 0
src/components/makeProduct/index.vue

@@ -630,6 +630,20 @@ const selectBOM = (item) => {
     formData.data.skuSpecList[rowIndex.value].netWeight = item.netWeight;
     ElMessage({ message: "选择完成", type: "success" });
     openBOM.value = false;
+    proxy.post("/skuDefaultPackageSpec/getPackList", { skuId: formData.data.id, spec: item.length + "*" + item.width + "*" + item.height }).then((res) => {
+      if (res && res.length > 0) {
+        formData.data.skuSpecList[rowIndex.value].packagingMaterialList = res.map((val) => {
+          return {
+            bomSpecId: val.bomSpecId,
+            quantity: 1,
+            name: val.bomSpecName,
+          };
+        });
+      } else {
+        formData.data.skuSpecList[rowIndex.value].packagingMaterialList = [];
+      }
+      ElMessage({ message: "根据规格尺寸替换包材配件完成", type: "success" });
+    });
   }
 };
 const clickRemoveBOM = (index) => {

+ 6 - 1
src/views/group/BOM/management/index.vue

@@ -151,6 +151,7 @@ const props = defineProps({
   expressStatus: Boolean,
   priceSystemId: String,
   purchaseId: String,
+  bomClassifyId: String,
 });
 const filterTree = ref("");
 const treeCategory = ref(null);
@@ -417,7 +418,11 @@ const getList = async (req, status) => {
     sourceList.value.pagination.bomClassifyIdList = props.bomClassifyIdList;
   }
   if (props.expressStatus) {
-    sourceList.value.pagination.bomClassifyId = "1682221528948760578";
+    if (props.bomClassifyId) {
+      sourceList.value.pagination.bomClassifyId = props.bomClassifyId;
+    } else {
+      sourceList.value.pagination.bomClassifyId = "1682221528948760578";
+    }
   }
   loading.value = true;
   let path = "/bom/page";

+ 540 - 0
src/views/group/product/associated-configuration/index.vue

@@ -0,0 +1,540 @@
+<template>
+  <el-card class="box-card" v-loading="loadingCard">
+    <byTable
+      :hidePagination="true"
+      :source="sourceList.data"
+      :config="config"
+      :loading="loading"
+      highlight-current-row
+      :action-list="[
+        // {
+        //   text: '新增',
+        //   action: () => clickModal(),
+        // },
+        {
+          text: '应用包材配置',
+          action: () => clickUse(),
+        },
+      ]"
+      @get-list="getList">
+    </byTable>
+
+    <el-dialog :title="modalType == 'add' ? '新增包材配置' : '编辑包材配置'" v-if="openDialog" v-model="openDialog" width="500">
+      <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="submit">
+        <template #oppMembraneId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.oppMembraneId || formData.data.oppMembraneId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('oppMembrane', '1682221249268375554')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('oppMembrane')"><Remove /></el-icon>
+              <span>{{ formData.data.oppMembraneCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #peBagId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.peBagId || formData.data.peBagId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('peBag', '1682221303530086402')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('peBag')"><Remove /></el-icon>
+              <span>{{ formData.data.peBagCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #meshBagId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.meshBagId || formData.data.meshBagId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('meshBag', '1682221356147630081')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('meshBag')"><Remove /></el-icon>
+              <span>{{ formData.data.meshBagCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #bubblePackId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.bubblePackId || formData.data.bubblePackId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('bubblePack', '1682221453145104386')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('bubblePack')"><Remove /></el-icon>
+              <span>{{ formData.data.bubblePackCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #suspendersId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.suspendersId || formData.data.suspendersId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('suspenders', '1682221651040755714')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('suspenders')"><Remove /></el-icon>
+              <span>{{ formData.data.suspendersCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #colouredPaperId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.colouredPaperId || formData.data.colouredPaperId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('colouredPaper', '1682221201491058690')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('colouredPaper')"><Remove /></el-icon>
+              <span>{{ formData.data.colouredPaperCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #selfAdhesiveStickerId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.selfAdhesiveStickerId || formData.data.selfAdhesiveStickerId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('selfAdhesiveSticker', '1697442459841290241')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('selfAdhesiveSticker')"><Remove /></el-icon>
+              <span>{{ formData.data.selfAdhesiveStickerCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #dropId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.dropId || formData.data.dropId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('drop', '1697442971286331393')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('drop')"><Remove /></el-icon>
+              <span>{{ formData.data.dropCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #logisticsPackagingMaterialId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.logisticsPackagingMaterialId || formData.data.logisticsPackagingMaterialId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('logisticsPackagingMaterial', '1682221528948760578')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('logisticsPackagingMaterial')"><Remove /></el-icon>
+              <span>{{ formData.data.logisticsPackagingMaterialCode }}</span>
+            </div>
+          </div>
+        </template>
+        <template #otherPackingMaterialId>
+          <div style="width: 100%">
+            <el-button
+              v-if="!formData.data.otherPackingMaterialId || formData.data.otherPackingMaterialId === '0'"
+              type="primary"
+              size="small"
+              @click="handleOpen('otherPackingMaterial', '1682221581453058049')"
+              style="margin: 5px 0; background-color: #43b214; border-color: #43b214">
+              选择BOM
+            </el-button>
+            <div style="width: 100%; display: flex; align-items: center" v-else>
+              <el-icon style="font-size: 16px; cursor: pointer" @click="clickRemove('otherPackingMaterial')"><Remove /></el-icon>
+              <span>{{ formData.data.otherPackingMaterialCode }}</span>
+            </div>
+          </div>
+        </template>
+      </byForm>
+      <template #footer>
+        <el-button @click="openDialog = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="submitForm()" size="large" v-preReClick>确 定</el-button>
+      </template>
+    </el-dialog>
+
+    <el-dialog title="选择BOM" v-if="openBOM" v-model="openBOM" width="84%">
+      <SelectBOM :selectStatus="true" :expressStatus="true" :bomClassifyId="bomClassifyId" @selectBOM="selectBOM"></SelectBOM>
+      <template #footer>
+        <el-button @click="openBOM = false" size="large">关 闭</el-button>
+      </template>
+    </el-dialog>
+  </el-card>
+</template>
+
+<script setup>
+import byTable from "/src/components/byTable/index";
+import byForm from "/src/components/byForm/index";
+import { ElMessage } from "element-plus";
+import SelectBOM from "/src/views/group/BOM/management/index";
+
+const { proxy } = getCurrentInstance();
+const skuList = ref([]);
+const sourceList = ref({
+  data: [],
+});
+const loading = ref(false);
+const config = computed(() => {
+  return [
+    {
+      attrs: {
+        label: "尺寸",
+        prop: "spec",
+        align: "center",
+        width: 180,
+      },
+    },
+    {
+      attrs: {
+        label: "OPP膜",
+        prop: "oppMembraneCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "PE袋",
+        prop: "peBagCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "网包",
+        prop: "meshBagCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "气泡袋",
+        prop: "bubblePackCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "松紧圈/背带",
+        prop: "suspendersCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "彩纸",
+        prop: "colouredPaperCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "不干胶",
+        prop: "selfAdhesiveStickerCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "吊牌",
+        prop: "dropCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "快递包材",
+        prop: "logisticsPackagingMaterialCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "其他包材",
+        prop: "otherPackingMaterialCode",
+        align: "center",
+      },
+      render(val) {
+        if (val) {
+          return val;
+        }
+        return "-";
+      },
+    },
+    {
+      attrs: {
+        label: "操作",
+        width: 80,
+        align: "center",
+        fixed: "right",
+      },
+      renderHTML(row) {
+        return [
+          {
+            attrs: {
+              label: "编辑",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              clickUpdate(row);
+            },
+          },
+        ];
+      },
+    },
+  ];
+});
+const getDemandData = () => {
+  proxy.post("/sku/list", {}).then((res) => {
+    if (res && res.length > 0) {
+      skuList.value = res.map((item) => {
+        return {
+          value: item.id,
+          label: item.code,
+        };
+      });
+    }
+  });
+};
+getDemandData();
+const getList = async () => {
+  loading.value = true;
+  proxy.post("/skuDefaultPackageSpec/page", { pageNum: 1, pageSize: 999 }).then((res) => {
+    sourceList.value.data = res.rows;
+    setTimeout(() => {
+      loading.value = false;
+    }, 200);
+  });
+};
+getList();
+const modalType = ref("add");
+const openDialog = ref(false);
+const submit = ref(null);
+const formOption = reactive({
+  inline: true,
+  labelWidth: "80px",
+  itemWidth: 100,
+  rules: [],
+  labelPosition: "right",
+});
+const formData = reactive({
+  data: {},
+});
+const formConfig = computed(() => {
+  return [
+    {
+      type: "input",
+      prop: "spec",
+      label: "规格",
+      disabled: modalType.value === "edit" ? true : false,
+    },
+    {
+      type: "slot",
+      slotName: "oppMembraneId",
+      label: "OPP膜",
+    },
+    {
+      type: "slot",
+      slotName: "peBagId",
+      label: "PE袋",
+    },
+    {
+      type: "slot",
+      slotName: "meshBagId",
+      label: "网包",
+    },
+    {
+      type: "slot",
+      slotName: "bubblePackId",
+      label: "气泡袋",
+    },
+    {
+      type: "slot",
+      slotName: "suspendersId",
+      label: "背带",
+    },
+    {
+      type: "slot",
+      slotName: "colouredPaperId",
+      label: "彩纸",
+    },
+    {
+      type: "slot",
+      slotName: "selfAdhesiveStickerId",
+      label: "不干胶",
+    },
+    {
+      type: "slot",
+      slotName: "dropId",
+      label: "吊牌",
+    },
+    {
+      type: "slot",
+      slotName: "logisticsPackagingMaterialId",
+      label: "快递包材",
+    },
+    {
+      type: "slot",
+      slotName: "otherPackingMaterialId",
+      label: "其他包材",
+    },
+  ];
+});
+const rules = ref({
+  spec: [{ required: true, message: "请输入规格", trigger: "blur" }],
+});
+const clickModal = () => {
+  modalType.value = "add";
+  formData.data = {};
+  openDialog.value = true;
+};
+const labelText = ref("");
+const openBOM = ref(false);
+const bomClassifyId = ref("");
+const handleOpen = (label, id) => {
+  labelText.value = label;
+  bomClassifyId.value = id;
+  openBOM.value = true;
+};
+const selectBOM = (data) => {
+  formData.data[labelText.value + "Id"] = data.id;
+  formData.data[labelText.value + "Code"] = data.code;
+  openBOM.value = false;
+  ElMessage({ message: "选择成功", type: "success" });
+};
+const clickRemove = (label) => {
+  formData.data[label + "Id"] = "0";
+  formData.data[label + "Code"] = "0";
+};
+const submitForm = () => {
+  submit.value.handleSubmit(() => {
+    proxy.post("/skuDefaultPackageSpec/" + modalType.value, formData.data).then(() => {
+      ElMessage({
+        message: modalType.value == "add" ? "添加成功" : "编辑成功",
+        type: "success",
+      });
+      openDialog.value = false;
+      getList();
+    });
+  });
+};
+const clickUpdate = (row) => {
+  modalType.value = "edit";
+  proxy.post("/skuDefaultPackageSpec/detail", { id: row.id }).then((res) => {
+    formData.data = res;
+    openDialog.value = true;
+  });
+};
+const loadingCard = ref(false);
+const clickUse = () => {
+  loadingCard.value = true;
+  ElMessage("请稍后,应用包材配置");
+  proxy.post("/skuDefaultPackageSpec/refresh", {}).then(
+    () => {
+      ElMessage({ message: "应用成功", type: "success" });
+      loadingCard.value = false;
+    },
+    (err) => {
+      console.log(err);
+      loadingCard.value = false;
+    }
+  );
+};
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-dialog) {
+  margin-top: 10px !important;
+  margin-bottom: 10px !important;
+}
+</style>

+ 370 - 0
src/views/group/product/material-configuration/index.vue

@@ -0,0 +1,370 @@
+<template>
+  <el-card class="box-card">
+    <byTable
+      :source="sourceList.data"
+      :pagination="sourceList.pagination"
+      :config="config"
+      :loading="loading"
+      :searchConfig="searchConfig"
+      highlight-current-row
+      :action-list="[
+        {
+          text: '新增包材配置',
+          action: () => clickModal(),
+        },
+      ]"
+      @get-list="getList"
+      @clickReset="clickReset">
+      <template #oppMembrane="{ item }">
+        <div v-if="item.oppMembrane == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #peBag="{ item }">
+        <div v-if="item.peBag == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #meshBag="{ item }">
+        <div v-if="item.meshBag == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #bubblePack="{ item }">
+        <div v-if="item.bubblePack == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #suspenders="{ item }">
+        <div v-if="item.suspenders == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #colouredPaper="{ item }">
+        <div v-if="item.colouredPaper == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #selfAdhesiveSticker="{ item }">
+        <div v-if="item.selfAdhesiveSticker == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #drop="{ item }">
+        <div v-if="item.drop == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #logisticsPackagingMaterial="{ item }">
+        <div v-if="item.logisticsPackagingMaterial == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+      <template #otherPackingMaterial="{ item }">
+        <div v-if="item.otherPackingMaterial == 1" class="status-ball"></div>
+        <div v-else>一</div>
+      </template>
+    </byTable>
+
+    <el-dialog :title="modalType == 'add' ? '新增包材配置' : '编辑包材配置'" v-if="openDialog" v-model="openDialog" width="400">
+      <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="submit">
+        <template #skuId>
+          <div style="width: 100%">
+            <el-select-v2 v-model="formData.data.skuId" :options="skuList" placeholder="请选择SKU" style="width: 100%" filterable />
+          </div>
+        </template>
+      </byForm>
+      <template #footer>
+        <el-button @click="openDialog = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="submitForm()" size="large" v-preReClick>确 定</el-button>
+      </template>
+    </el-dialog>
+  </el-card>
+</template>
+
+<script setup>
+import byTable from "/src/components/byTable/index";
+import byForm from "/src/components/byForm/index";
+import { ElMessage } from "element-plus";
+
+const { proxy } = getCurrentInstance();
+const skuList = ref([]);
+const sourceList = ref({
+  data: [],
+  pagination: {
+    total: 0,
+    pageNum: 1,
+    pageSize: 10,
+    skuCode: "",
+  },
+});
+const loading = ref(false);
+const searchConfig = computed(() => {
+  return [
+    {
+      type: "input",
+      prop: "skuCode",
+      label: "SKU编号",
+    },
+  ];
+});
+const config = computed(() => {
+  return [
+    {
+      attrs: {
+        label: "SKU品号",
+        prop: "skuCode",
+      },
+    },
+    {
+      attrs: {
+        label: "OPP膜",
+        slot: "oppMembrane",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "PE袋",
+        slot: "peBag",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "网包",
+        slot: "meshBag",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "气泡袋",
+        slot: "bubblePack",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "松紧圈/背带",
+        slot: "suspenders",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "彩纸",
+        slot: "colouredPaper",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "不干胶",
+        slot: "selfAdhesiveSticker",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "吊牌",
+        slot: "drop",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "快递包材",
+        slot: "logisticsPackagingMaterial",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "其他包材",
+        slot: "otherPackingMaterial",
+        align: "center",
+      },
+    },
+    {
+      attrs: {
+        label: "操作",
+        width: 80,
+        align: "center",
+        fixed: "right",
+      },
+      renderHTML(row) {
+        return [
+          {
+            attrs: {
+              label: "编辑",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              clickUpdate(row);
+            },
+          },
+        ];
+      },
+    },
+  ];
+});
+const getDemandData = () => {
+  proxy.post("/sku/list", {}).then((res) => {
+    if (res && res.length > 0) {
+      skuList.value = res.map((item) => {
+        return {
+          value: item.id,
+          label: item.code,
+        };
+      });
+    }
+  });
+};
+getDemandData();
+const getList = async (req, status) => {
+  if (status) {
+    sourceList.value.pagination = {
+      pageNum: sourceList.value.pagination.pageNum,
+      pageSize: sourceList.value.pagination.pageSize,
+    };
+  } else {
+    sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
+  }
+  loading.value = true;
+  proxy.post("/skuDefaultPackage/page", sourceList.value.pagination).then((res) => {
+    sourceList.value.data = res.rows;
+    sourceList.value.pagination.total = res.total;
+    setTimeout(() => {
+      loading.value = false;
+    }, 200);
+  });
+};
+getList();
+const clickReset = () => {
+  getList("", true);
+};
+const modalType = ref("add");
+const openDialog = ref(false);
+const submit = ref(null);
+const formOption = reactive({
+  inline: true,
+  labelWidth: "80px",
+  itemWidth: 100,
+  rules: [],
+  labelPosition: "right",
+});
+const formData = reactive({
+  data: {},
+});
+const formConfig = computed(() => {
+  return [
+    {
+      type: "slot",
+      prop: "skuId",
+      slotName: "skuId",
+      label: "SKU",
+    },
+    {
+      type: "switch",
+      prop: "oppMembrane",
+      label: "OPP膜",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "peBag",
+      label: "PE袋",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "meshBag",
+      label: "网包",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "bubblePack",
+      label: "气泡袋",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "suspenders",
+      label: "背带",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "colouredPaper",
+      label: "彩纸",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "selfAdhesiveSticker",
+      label: "不干胶",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "drop",
+      label: "吊牌",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "logisticsPackagingMaterial",
+      label: "快递包材",
+      active: 1,
+      inactive: 0,
+    },
+    {
+      type: "switch",
+      prop: "otherPackingMaterial",
+      label: "其他包材",
+      active: 1,
+      inactive: 0,
+    },
+  ];
+});
+const rules = ref({
+  skuId: [{ required: true, message: "请选择SKU", trigger: "change" }],
+});
+const clickModal = () => {
+  modalType.value = "add";
+  formData.data = {};
+  openDialog.value = true;
+};
+const submitForm = () => {
+  submit.value.handleSubmit(() => {
+    proxy.post("/skuDefaultPackage/" + modalType.value, formData.data).then(() => {
+      ElMessage({
+        message: modalType.value == "add" ? "添加成功" : "编辑成功",
+        type: "success",
+      });
+      openDialog.value = false;
+      getList();
+    });
+  });
+};
+const clickUpdate = (row) => {
+  modalType.value = "edit";
+  proxy.post("/skuDefaultPackage/detail", { id: row.id }).then((res) => {
+    formData.data = res;
+    openDialog.value = true;
+  });
+};
+</script>
+
+<style lang="scss" scoped>
+.status-ball {
+  border-radius: 50px;
+  width: 8px;
+  height: 8px;
+  background-color: black;
+  margin: auto;
+}
+</style>