Browse Source

jxskbom管理

cz 2 years ago
parent
commit
93dfdcdc4e
2 changed files with 737 additions and 1 deletions
  1. 736 0
      src/views/JXSK/production/bom/index.vue
  2. 1 1
      src/views/production/project/bom/index.vue

+ 736 - 0
src/views/JXSK/production/bom/index.vue

@@ -0,0 +1,736 @@
+<template>
+  <div class="tenant">
+    <!-- <Banner /> -->
+    <div class="content">
+      <byTable
+        :source="sourceList.data"
+        :pagination="sourceList.pagination"
+        :config="config"
+        :loading="loading"
+        highlight-current-row
+        :selectConfig="selectConfig"
+        :table-events="{
+          //element talbe事件都能传
+          select: select,
+        }"
+        :action-list="[
+          {
+            text: '添加BOM',
+            action: () => openModal('add'),
+          },
+        ]"
+        @get-list="getList"
+      >
+        <template #versionSlot="{ item }">
+          <div
+            style="cursor: pointer; color: #409eff"
+            @click="hanldeOpenVer(item)"
+          >
+            v{{ item.versionNumber }}
+          </div>
+        </template>
+      </byTable>
+    </div>
+    <el-dialog
+      :title="titleText"
+      v-model="dialogVisible"
+      width="800"
+      v-loading="submitLoading"
+      destroy-on-close
+    >
+      <byForm
+        :formConfig="formConfig"
+        :formOption="formOption"
+        v-model="formData.data"
+        :rules="rules"
+        ref="byform"
+      >
+        <template #slotFile>
+          <div>
+            <el-upload
+              v-model:fileList="fileList"
+              :show-file-list="false"
+              class="upload-demo"
+              action="https://winfaster.obs.cn-south-1.myhuaweicloud.com"
+              :data="uploadData"
+              :before-upload="handleBeforeUpload"
+              accept=".rar,.zip"
+            >
+              <el-button type="primary">选 择</el-button>
+            </el-upload>
+            <div>
+              <div style="margin-top: 15px">
+                <el-tag
+                  style="margin-right: 10px"
+                  class="ml-2"
+                  type="info"
+                  v-for="(item, index) in fileListCopy"
+                  :key="index"
+                  >{{ item.fileName }}</el-tag
+                >
+              </div>
+            </div>
+          </div>
+        </template>
+        <template #slot>
+          <div>
+            <el-button type="primary" plain @click="openMaterial = true"
+              >添加物料/半成品</el-button
+            >
+            <el-button type="primary" plain> Excel导入</el-button>
+            <el-form
+              ref="tableForm"
+              :model="formData.data"
+              :rules="rules"
+              label-width="0px"
+              style="margin-top: 15px"
+            >
+              <el-table :data="formData.data.bomDetailList">
+                <el-table-column prop="productCode" label="物料编码" />
+                <el-table-column prop="productName" label="物料名称" />
+                <el-table-column prop="productUnit" label="单位" />
+                <el-table-column prop="quantity" label="数量" width="150">
+                  <template #default="{ row, $index }">
+                    <el-form-item
+                      :prop="'bomDetailList.' + $index + '.quantity'"
+                      :rules="rules.quantity"
+                      :inline-message="true"
+                    >
+                      <el-input-number
+                        v-model="row.quantity"
+                        :precision="2"
+                        :controls="false"
+                        :min="1"
+                      />
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="zip" label="成本" width="150">
+                  <template #default="{ row, $index }">
+                    <el-form-item
+                      :prop="'bomDetailList.' + $index + '.cost'"
+                      :rules="rules.cost"
+                      :inline-message="true"
+                    >
+                      <el-input-number
+                        v-model="row.cost"
+                        :precision="2"
+                        :controls="false"
+                        :min="1"
+                      />
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="zip" label="操作" width="100">
+                  <template #default="{ $index }">
+                    <el-button type="primary" link @click="handleRemove($index)"
+                      >删除</el-button
+                    >
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form>
+          </div>
+        </template>
+      </byForm>
+      <template #footer>
+        <div v-if="isShowBtns">
+          <el-button @click="dialogVisible = false" size="large"
+            >取 消</el-button
+          >
+          <el-button
+            type="primary"
+            @click="submitForm('byform')"
+            size="large"
+            :loading="submitLoading"
+          >
+            确 定
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog
+      v-model="openMaterial"
+      title="选择产品"
+      width="70%"
+      append-to-body
+    >
+      <SelectMaterial @handleSelect="handleSelect"></SelectMaterial>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="openMaterial = false">取消</el-button>
+        </span>
+      </template>
+    </el-dialog>
+
+    <el-dialog v-model="openVersion" title="切换版本" width="30%">
+      <byForm
+        :formConfig="formConfig1"
+        :formOption="formOption"
+        v-model="formData.data1"
+        :rules="rules1"
+        ref="byform1"
+      >
+        <template #versionSlot>
+          <div>
+            <el-select
+              v-model="formData.data1.versionNumber"
+              placeholder="请选择版本号"
+              @change="changeRowData"
+            >
+              <el-option
+                v-for="item in versionData"
+                :label="'v' + item.versionNumber"
+                :value="item.versionNumber"
+              />
+            </el-select>
+            <el-button
+              type="primary"
+              link
+              style="margin-left: 10px"
+              @click="handleGetDetails"
+              v-if="formData.data1.versionNumber"
+              >查看</el-button
+            >
+          </div>
+        </template>
+      </byForm>
+      <template #footer>
+        <el-button @click="openVersion = false" size="large">取 消</el-button>
+        <el-button
+          type="primary"
+          @click="handleChangeVer('byform1')"
+          size="large"
+        >
+          确 定
+        </el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+  
+<script setup>
+/* eslint-disabled vue/no-unused-components */
+import { ElMessage, ElMessageBox } from "element-plus";
+import byTable from "@/components/byTable/index";
+import byForm from "@/components/byForm/index";
+import { computed, defineComponent, ref, watch, watchEffect } from "vue";
+import SelectMaterial from "@/components/product/SelectMaterial";
+const uploadData = ref({});
+let fileList = ref([]);
+let fileListCopy = ref([]);
+const loading = ref(false);
+const submitLoading = ref(false);
+const sourceList = ref({
+  data: [],
+  pagination: {
+    total: 3,
+    pageNum: 1,
+    pageSize: 10,
+  },
+});
+let dialogVisible = ref(false);
+let openMaterial = ref(false);
+let openVersion = ref(false);
+let titleText = ref("");
+let modalType = ref("add");
+let rules = ref({
+  productId: [{ required: true, message: "请选择产品", trigger: "change" }],
+  quantity: [{ required: true, message: "请输入数量", trigger: "blur" }],
+  cost: [{ required: true, message: "请输入成本", trigger: "blur" }],
+  personLiableId: [
+    { required: true, message: "请选择负责人", trigger: "change" },
+  ],
+});
+let rules1 = ref({
+  versionNumber: [
+    { required: true, message: "请选择版本号", trigger: "change" },
+  ],
+});
+
+const { proxy } = getCurrentInstance();
+const selectConfig = reactive([
+  // {
+  //   label: "车间类型",
+  //   prop: "type",
+  //   data: [
+  //     {
+  //       label: "普通车间",
+  //       value: "1",
+  //     },
+  //     {
+  //       label: "半自动化车间",
+  //       value: "2",
+  //     },
+  //     {
+  //       label: "自动化车间",
+  //       value: "3",
+  //     },
+  //   ],
+  // },
+]);
+const config = computed(() => {
+  return [
+    {
+      attrs: {
+        label: "产品类型",
+        prop: "productType",
+        width: 100,
+      },
+      render(productType) {
+        return productType ? "成品" : "半成品";
+      },
+    },
+    {
+      attrs: {
+        label: "产品编码",
+        prop: "productCode",
+        width: 150,
+      },
+    },
+    {
+      attrs: {
+        label: "产品名称",
+        prop: "productName",
+      },
+    },
+    {
+      attrs: {
+        label: "状态",
+        prop: "status",
+      },
+      render(status) {
+        return status === 1 ? "启用" : "禁用";
+      },
+    },
+    {
+      attrs: {
+        label: "当前版本",
+        prop: "versionNumber",
+        slot: "versionSlot",
+      },
+    },
+    {
+      attrs: {
+        label: "最近维护人",
+        prop: "updateUserName",
+      },
+    },
+    {
+      attrs: {
+        label: "最近维护时间",
+        prop: "updateTime",
+      },
+    },
+    // {
+    //   attrs: {
+    //     label: "BOM文件",
+    //     prop: "type",
+    //     width: 120,
+    //   },
+    //   render(type) {
+    //     return type == 1
+    //       ? "普通车间"
+    //       : type == 2
+    //       ? "半自动化车间"
+    //       : type == "3"
+    //       ? "自动化车间"
+    //       : "";
+    //   },
+    // },
+
+    {
+      attrs: {
+        label: "操作",
+        width: "200",
+        align: "right",
+      },
+      // 渲染 el-button,一般用在最后一列。
+      renderHTML(row) {
+        return [
+          {
+            attrs: {
+              label: "新建版本",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              getDtl(row, "add", true);
+            },
+          },
+          {
+            attrs: {
+              label: "修改",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              getDtl(row, "edit");
+            },
+          },
+          {
+            attrs: {
+              label: row.status === 1 ? "禁用" : "启用",
+              type: "primary",
+              text: true,
+            },
+            el: "button",
+            click() {
+              ElMessageBox.confirm(
+                `是否${row.status === 1 ? "禁用" : "启用"} ?`,
+                "提示",
+                {
+                  confirmButtonText: "确定",
+                  cancelButtonText: "取消",
+                  type: "warning",
+                }
+              ).then(() => {
+                proxy.post("/bomInfo/detail", { id: row.id }).then((res) => {
+                  res.bomDetailList = res.bomDetailVoList;
+                  res.status = row.status ? 0 : 1;
+                  formData.data = res;
+                  proxy.post("/bomInfo/edit", formData.data).then((res) => {
+                    ElMessage({
+                      message: "操作成功",
+                      type: "success",
+                    });
+                    getList();
+                  });
+                });
+              });
+            },
+          },
+          // {
+          //   attrs: {
+          //     label: "删除",
+          //     type: "danger",
+          //     text: true,
+          //   },
+          //   el: "button",
+          //   click() {
+          //     // 弹窗提示是否删除
+          //     ElMessageBox.confirm(
+          //       "此操作将永久删除该数据, 是否继续?",
+          //       "提示",
+          //       {
+          //         confirmButtonText: "确定",
+          //         cancelButtonText: "取消",
+          //         type: "warning",
+          //       }
+          //     ).then(() => {
+          //       // 删除
+          //       proxy
+          //         .post("/workshop/delete", {
+          //           id: row.id,
+          //         })
+          //         .then((res) => {
+          //           ElMessage({
+          //             message: "删除成功",
+          //             type: "success",
+          //           });
+          //           getList();
+          //         });
+          //     });
+          //   },
+          // },
+        ];
+      },
+    },
+  ];
+});
+
+let formData = reactive({
+  data: {
+    productId: "",
+    addType: "1",
+    bomDetailList: [],
+  },
+  data1: {
+    productId: "",
+    versionNumber: "",
+  },
+});
+const formOption = reactive({
+  inline: true,
+  labelWidth: 100,
+  itemWidth: 100,
+  rules: [],
+});
+const byform = ref(null);
+const formConfig = reactive([
+  {
+    type: "select",
+    prop: "productId",
+    label: "产品名称",
+    required: true,
+    disabled: false,
+    isLoad: {
+      url: "/productInfo/page",
+      req: {
+        pageNum: 1,
+        pageSize: 9999,
+        definition: "1",
+      },
+      labelKey: "name",
+      labelVal: "id",
+      method: "post",
+      resUrl: "rows",
+    },
+  },
+  {
+    type: "title",
+    title: "应用程序",
+  },
+  {
+    type: "slot",
+    slotName: "slotFile",
+    label: "上传程序",
+  },
+  {
+    type: "slot",
+    slotName: "slot",
+    label: "物料信息",
+  },
+]);
+
+const formConfig1 = reactive([
+  {
+    type: "select",
+    prop: "productId",
+    label: "产品名称",
+    required: true,
+    disabled: true,
+    isLoad: {
+      url: "/productInfo/page",
+      req: {
+        pageNum: 1,
+        pageSize: 9999,
+        definition: "1",
+      },
+      labelKey: "name",
+      labelVal: "id",
+      method: "post",
+      resUrl: "rows",
+    },
+  },
+  {
+    type: "slot",
+    slotName: "versionSlot",
+    label: "切换版本",
+    required: true,
+  },
+]);
+const getList = async (req) => {
+  sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
+  loading.value = true;
+  proxy.post("/bomInfo/page", sourceList.value.pagination).then((message) => {
+    console.log(message);
+    sourceList.value.data = message.rows;
+    sourceList.value.pagination.total = message.total;
+    setTimeout(() => {
+      loading.value = false;
+    }, 200);
+  });
+};
+const openModal = () => {
+  dialogVisible.value = true;
+  titleText.value = "添加BOM";
+  modalType.value = "add";
+  formData.data = {
+    productId: "",
+    addType: "1",
+    bomDetailList: [],
+  };
+  fileList.value = [];
+  fileListCopy.value = [];
+  formConfig[0].disabled = false;
+};
+const submitForm = () => {
+  byform.value.handleSubmit((valid) => {
+    if (!formData.data.bomDetailList.length > 0) {
+      return ElMessage({
+        message: "请添加物料/半成品",
+        type: "info",
+      });
+    }
+    if (fileList.value.length > 0) {
+      formData.data.fileList =
+        fileListCopy.value.map((x) => ({
+          id: x.id,
+          fileName: x.fileName,
+        })) || [];
+    } else {
+      return ElMessage({
+        message: "请上传程序",
+        type: "info",
+      });
+    }
+    proxy.$refs.tableForm.validate((vaild) => {
+      if (vaild) {
+        submitLoading.value = true;
+        formData.data.bomDetailList = formData.data.bomDetailList.map((x) => ({
+          productId: x.productId,
+          quantity: x.quantity,
+          cost: x.cost,
+        }));
+        proxy.post(`/bomInfo/${modalType.value}ByJxst`, formData.data).then(
+          (res) => {
+            ElMessage({
+              message: modalType.value == "add" ? "添加成功" : "编辑成功",
+              type: "success",
+            });
+            dialogVisible.value = false;
+            submitLoading.value = false;
+            getList();
+          },
+          (err) => {
+            formData.data.bomDetailList = [];
+            submitLoading.value = false;
+          }
+        );
+      }
+    });
+  });
+};
+const byform1 = ref(null);
+const handleChangeVer = () => {
+  if (formData.data1.versionNumber === "")
+    return ElMessage({
+      message: "请选择版本号",
+      type: "info",
+    });
+  byform1.value.handleSubmit((valid) => {
+    submitLoading.value = true;
+    proxy.post("/bomInfo/editVersion", formData.data1).then(
+      (res) => {
+        ElMessage({
+          message: "切换成功",
+          type: "success",
+        });
+        openVersion.value = false;
+        submitLoading.value = false;
+        getList();
+      },
+      (err) => {
+        submitLoading.value = false;
+      }
+    );
+  });
+};
+
+const getDtl = (row, type, isNew) => {
+  formConfig[0].disabled = true; //禁止修改产品信息
+  modalType.value = type;
+  proxy.post("/bomInfo/detail", { id: row.id }).then((res) => {
+    if (isNew) {
+      titleText.value = "新建版本";
+      formData.data = {
+        addType: "2", //2为新建版本
+        productId: res.productId,
+        bomDetailList: [],
+      };
+    } else {
+      titleText.value = openVersion.value ? "版本详情" : "编辑BOM";
+      res.bomDetailList = res.bomDetailVoList;
+      formData.data = res;
+    }
+    dialogVisible.value = true;
+  });
+  proxy
+    .post("/fileInfo/getList", { businessIdList: [row.id] })
+    .then((fileObj) => {
+      fileList.value = fileObj[row.id] || [];
+      fileListCopy.value = [...fileList.value];
+    });
+};
+
+const handleSelect = (row) => {
+  const flag = formData.data.bomDetailList.some((x) => x.productId === row.id);
+  if (flag)
+    return ElMessage({
+      message: "该物料已选择",
+      type: "info",
+    });
+  formData.data.bomDetailList.push({
+    productId: row.id,
+    productCode: row.code,
+    productName: row.name,
+    productUnit: row.unit,
+    quantity: null,
+    cost: null,
+  });
+  return ElMessage({
+    message: "选择成功",
+    type: "success",
+  });
+};
+
+const handleRemove = (index) => {
+  console.log(index, "as");
+  formData.data.bomDetailList.splice(index, 1);
+  return ElMessage({
+    message: "删除成功",
+    type: "success",
+  });
+};
+
+const versionData = ref([]);
+let isShowBtns = ref(true);
+let rowData = ref({});
+const hanldeOpenVer = (row) => {
+  formData.data1 = {
+    productId: "",
+    versionNumber: "",
+  };
+  rowData.value = row;
+  formData.data1.productId = row.productId;
+  proxy
+    .post("/bomInfo/getVersion", { productId: row.productId })
+    .then((res) => {
+      versionData.value = res;
+      formData.data1.versionNumber = res.filter(
+        (x) => x.currentVersion === 1
+      )[0].versionNumber;
+      openVersion.value = true;
+    });
+};
+
+const handleGetDetails = () => {
+  getDtl(rowData.value);
+};
+
+watchEffect(() => {
+  isShowBtns.value = openVersion.value ? false : true;
+  //监听是否是在切换版本中,如是隐藏提交添加弹窗的按钮模块
+});
+
+const changeRowData = (val) => {
+  const data = versionData.value.find((x) => x.versionNumber === val);
+  rowData.value = data ? data : {};
+};
+
+const handleBeforeUpload = async (file) => {
+  const res = await proxy.post("/fileInfo/getSing", { fileName: file.name });
+  uploadData.value = res.uploadBody;
+  fileListCopy.value = [
+    {
+      id: res.id,
+      fileName: res.fileName,
+      path: res.fileUrl,
+      url: res.fileUrl,
+      uid: file.uid,
+    },
+  ];
+};
+
+getList();
+</script>
+  
+<style lang="scss" scoped>
+.tenant {
+  padding: 20px;
+}
+</style>

+ 1 - 1
src/views/production/project/bom/index.vue

@@ -533,7 +533,7 @@ const submitForm = () => {
             getList();
           },
           (err) => {
-            console.log(err, "aswwwww");
+            formData.data.bomDetailList = [];
             submitLoading.value = false;
           }
         );