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

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":
           // 查看批次

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>

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(