add 子订单进度—混料订单编辑

2023-08-08 16:54:39 +08:00 · 2023-08-08 16:54:39 +08:00 · 3601b574fb
commit 3601b574fb
parent 2ab361be85
3 changed files with 177 additions and 51 deletions
--- a/src/views/modules/pms/order/components/TablePagi.vue
+++ b/src/views/modules/pms/order/components/TablePagi.vue
@ -18,8 +18,13 @@
      :total="totalPage"
      layout="total, prev, pager, next, jumper"></el-pagination>

-    <!-- 编辑弹窗 -->
-    <DialogJustForm ref="vdialog" v-if="false" />
+    <!-- 混料订单的 编辑弹窗 -->
+    <blender-order-edit
+      ref="blenderOrderEdit"
+      v-if="blenderOrderEditVisible"
+      @destroy="blenderOrderEditVisible = false"
+      @refreshDataList="getAList" />
+
    <!-- 批次弹窗 -->
    <BatchDialog
      ref="batchDialog"
@ -31,12 +36,13 @@

 <script>
 import BaseListTable from "./BaseListTable.vue";
-import DialogJustForm from "./DialogJustForm.vue";
+// import DialogJustForm from "./DialogJustForm.vue";
 import BatchDialog from "./BatchDialog.vue";
+import BlenderOrderEdit from "./tabs/blenderOrder-edit.vue";

 export default {
  name: "TablePaginationComp",
-  components: { BaseListTable, DialogJustForm, BatchDialog },
+  components: { BaseListTable, BlenderOrderEdit, BatchDialog },
  props: {
    tableConfig: {
      type: Object,
@ -68,6 +74,7 @@ export default {
      },
      totalPage: 0,
      refreshLayoutKey: 0,
+      blenderOrderEditVisible: false,
      /** batch related */
      batchDialogVisible: false,
      batchDialogConfigs: {},
@ -80,10 +87,11 @@ export default {
    handleOperate({ type, data: id }) {
      console.log("payload", type, id);
      switch (type) {
-        case "edit":
-          // 编辑
-          this.$refs.vdialog.init(id);
-          console.log("编辑");
+        case "blender-edit":
+          this.blenderOrderEditVisible = true;
+          this.$nextTick(() => {
+            this.$refs.blenderOrderEdit.init(id);
+          });
          break;
        case "view-batch":
          // 查看批次
--- a/src/views/modules/pms/order/components/tabs/blenderOrder-edit.vue
+++ b/src/views/modules/pms/order/components/tabs/blenderOrder-edit.vue
@ -0,0 +1,86 @@
+<!-- 
+    filename: blenderOrder-edit.vue
+    author: liubin
+    date: 2023-08-08 16:20:48
+    description: 
+-->
+
+<template>
+  <el-dialog
+    class="blender-order-dialog"
+    :visible="visible"
+    @close="close"
+    @closed="$emit('destroy')"
+    :close-on-click-modal="false"
+    :append-to-body="true"
+    v-loading="optionsLoading || formLoading">
+    <div slot="title" class="dialog-title">
+      <h2 class="">
+        {{ mode.includes("detail") ? "查看详情" : dataForm.id ? "修改订单" : "新增订单" }}
+      </h2>
+    </div>
+
+    <!-- form  -->
+    <el-form ref="dataForm" :model="dataForm" size="small">
+      <el-row :gutter="20">
+        <el-col :span="6">
+          <el-form-item label="订单状态" prop="statusDictValue" :rules="null"></el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <!-- footer  -->
+    <div slot="footer">
+      <!-- TODO: permission 相关内容 未添加  -->
+      <el-button v-if="mode.includes('create')" type="primary" @click="handleSave('POST')" :loading="btnLoading">
+        保存
+      </el-button>
+      <el-button v-if="mode.includes('edit')" type="primary" @click="handleSave('PUT')" :loading="btnLoading">
+        更新
+      </el-button>
+      <el-button v-if="mode.includes('reset')" type="warning" @click="handleReset">重置</el-button>
+      <el-button @click="close">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "BlenderOrderEdit",
+  components: {},
+  props: {},
+  data() {
+    return {
+      visible: false,
+      mode: "#create#reset",
+      optionsLoading: false,
+      formLoading: false,
+      btnLoading: false,
+      dataForm: {
+        id: null,
+      },
+    };
+  },
+  computed: {},
+  methods: {
+    init(id) {
+      console.log("[blenderOrderEdit] init", id);
+      this.visible = true;
+    },
+    close() {
+      this.visible = false;
+    },
+    handleSave(type) {
+      switch (type) {
+        case "POST":
+          break;
+        case "PUT":
+          break;
+      }
+    },
+    handleReset() {},
+  },
+};
+</script>
+
+<style scoped lang="scss"></style>
--- a/src/views/modules/pms/order/components/tabs/subOrderDetail.vue
+++ b/src/views/modules/pms/order/components/tabs/subOrderDetail.vue
@ -3,16 +3,24 @@
    <el-row :gutter="20">
      <el-col style="margin-bottom: 12px">
        <!-- 混料订单  -->
-        <TablePagi v-if="order !== null" :extra-query-fields="{ code: order.code, cate: order.cate }"
-          :urls="{ page: '/pms/blenderOrder/pageView', detach: '/pms/trans/blenderDeli' }" :page-is-post="true" :table-config="{
+        <TablePagi
+          v-if="order !== null"
+          :extra-query-fields="{ code: order.code, cate: order.cate }"
+          :urls="{ page: '/pms/blenderOrder/pageView', detach: '/pms/trans/blenderDeli' }"
+          :page-is-post="true"
+          :table-config="{
            table: null,
            column: blenderTableProps,
          }" />
      </el-col>
      <el-col style="margin-bottom: 12px">
        <!-- 压制订单  -->
-        <TablePagi v-if="order !== null" :extra-query-fields="{ code: order.code, cate: order.cate }"
-          :urls="{ page: '/pms/pressOrder/pageView', detach: '/pms/trans/pressDeli' }" :page-is-post="true" :table-config="{
+        <TablePagi
+          v-if="order !== null"
+          :extra-query-fields="{ code: order.code, cate: order.cate }"
+          :urls="{ page: '/pms/pressOrder/pageView', detach: '/pms/trans/pressDeli' }"
+          :page-is-post="true"
+          :table-config="{
            table: null,
            column: pressTableProps,
          }" />
@ -22,16 +30,24 @@
    <el-row :gutter="20">
      <el-col style="margin-bottom: 12px">
        <!-- 窑炉订单  -->
-        <TablePagi v-if="order !== null" :extra-query-fields="{ code: order.code, cate: order.cate }"
-          :urls="{ page: '/pms/kilnOrder/pageView' }" :page-is-post="true" :table-config="{
+        <TablePagi
+          v-if="order !== null"
+          :extra-query-fields="{ code: order.code, cate: order.cate }"
+          :urls="{ page: '/pms/kilnOrder/pageView' }"
+          :page-is-post="true"
+          :table-config="{
            table: null,
            column: kilnTableProps,
          }" />
      </el-col>
      <el-col style="margin-bottom: 12px">
        <!-- 检测包装订单  -->
-        <TablePagi v-if="order !== null" :extra-query-fields="{ code: order.code, cate: order.cate }"
-          :urls="{ page: '/pms/qualityPackOrder/pageView' }" :page-is-post="true" :table-config="{
+        <TablePagi
+          v-if="order !== null"
+          :extra-query-fields="{ code: order.code, cate: order.cate }"
+          :urls="{ page: '/pms/qualityPackOrder/pageView' }"
+          :page-is-post="true"
+          :table-config="{
            table: null,
            column: detectionTableProps,
          }" />
@ -43,39 +59,37 @@
 <script>
 import TablePagi from "../TablePagi.vue";
 import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
+// import BlenderOrderEdit from "./blenderOrder-edit.vue";

 const percentComponent = {
  name: "PercentComponent",
+  components: {},
  props: {
    injectData: {
      type: Object,
-      default: () => ({})
-    }
+      default: () => ({}),
+    },
  },
  data() {
-    return {
-
-    }
-  },
-  methods: {
-
+    return {};
  },
+  methods: {},
  render: function (h) {
-    const value = this.injectData[this.injectData.head.prop]
-    
+    const value = this.injectData[this.injectData.head.prop];
+
    return h(
-      'div',
+      "div",
      {
        style: {
-          padding: '0 10px',
-          background: value > 0 && value <= 100 ? '#ffd400' : (value > 100 ? '#6797ff' : 'unset'),
-          color: value > 100 ? 'white' : 'unset'
-        }
+          padding: "0 10px",
+          background: value > 0 && value <= 100 ? "#ffd400" : value > 100 ? "#6797ff" : "unset",
+          color: value > 100 ? "white" : "unset",
+        },
      },
      value !== null && value !== undefined ? value + " %" : "-"
-    )
-  }
-}
+    );
+  },
+};

 export default {
  name: "SuborderDetailTag",
@ -92,12 +106,15 @@ export default {
      // 混料
      blenderTableProps: [
        { width: 200, prop: "code", label: "混料订单号" },
-        { width: 350, prop: "percent", label: "进度", className: 'no-padding-class', subcomponent: percentComponent }, // filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
+        { width: 350, prop: "percent", label: "进度", className: "no-padding-class", subcomponent: percentComponent }, // filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
        {
          width: 575,
          prop: "statusDictValue",
          label: "订单状态",
-          filter: (val) => (val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val] : "-"),
+          filter: (val) =>
+            val !== null && val !== undefined
+              ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝", "已下发"][val]
+              : "-",
        },
        { prop: "qty", label: "混料总量 [kg]" },
        {
@ -107,28 +124,33 @@ export default {
          width: 200,
          subcomponent: TableOperaionComponent,
          options: [
-            { name: "edit", label: "编辑", emitFull: true, icon: "edit-outline" },
-            { name: "view-batch", label: "查看批次", color: "#ff8000", toRouter: "pms-blenderBatch", icon: "document-copy" }, // 路由跳转至 pms-blenderBatch
+            { name: "blender-edit", label: "编辑", emitFull: true, icon: "edit-outline" },
+            {
+              name: "view-batch",
+              label: "查看批次",
+              color: "#ff8000",
+              toRouter: "pms-blenderBatch",
+              icon: "document-copy",
+            }, // 路由跳转至 pms-blenderBatch
            { name: "detach", label: "下发", color: "#099", icon: "bottom-right" },
          ],
        },
      ],
-      blenderEditConfig: {
-        form: {
-          field: [
-            [],
-          ]
-        }
-      },
      refreshLayoutKey1: "",
      // 压制
      pressTableProps: [
        { width: 200, prop: "code", label: "压制订单号" },
-        { width: 350, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
+        {
+          width: 350,
+          prop: "percent",
+          label: "进度",
+          filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+        },
        {
          prop: "statusDictValue",
          label: "订单状态",
-          filter: (val) => (val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝"][val] : "-"),
+          filter: (val) =>
+            val !== null && val !== undefined ? ["等待", "确认", "生产", "暂停", "结束", "接受", "拒绝"][val] : "-",
        },
        { prop: "qty", label: "生产量" },
        { prop: "qtyComplete", label: "完成量" },
@ -147,7 +169,12 @@ export default {
      // 窑炉
      kilnTableProps: [
        { width: 200, prop: "code", label: "烧成订单号" },
-        { width: 350, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
+        {
+          width: 350,
+          prop: "percent",
+          label: "进度",
+          filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+        },
        { prop: "qty", label: "生产量" },
        { prop: "qtyComplete", label: "完成量" },
      ],
@ -155,7 +182,12 @@ export default {
      // 检测
      detectionTableProps: [
        { width: 200, prop: "code", label: "检测包装订单号" },
-        { width: 350, prop: "percent", label: "进度", filter: (val) => (val !== null && val !== undefined ? val + " %" : "-") },
+        {
+          width: 350,
+          prop: "percent",
+          label: "进度",
+          filter: (val) => (val !== null && val !== undefined ? val + " %" : "-"),
+        },
        { prop: "qty1", label: "检测量" },
        { prop: "qty1Complete", label: "完成量" },
        { prop: "goodqty1", label: "检测合格量" },
@ -164,8 +196,8 @@ export default {
      refreshLayoutKey4: "",
    };
  },
-  created() { },
-  mounted() { },
+  created() {},
+  mounted() {},
  methods: {
    init(/** 参数 */) {
      // Promise.all(