feat: 添加改约改派页面

src/views/workOrder/workOrderPool/components/mixins/showRecordSelected.js

@@ -0,0 +1,97 @@
+import { required } from '@/components/template/rules_verify.js'
+export default {
+  props: {
+    recordSelected: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+    }
+  },
+  watch: {
+    recordSelected: {
+      handler() {
+        this.orderInfo.recordSelected = [...this.recordSelected.map(item => ({ ...item }))]
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  computed: {
+    columns() {
+      return [
+        {
+          columnAttributes: {
+            label: '产品品牌',
+            prop: 'brandId'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '产品大类',
+            prop: 'mainId'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '产品小类',
+            prop: 'smallId'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '产品机型',
+            prop: 'selectedItemsName'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '数量',
+            prop: 'num'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '备注',
+            prop: 'remark'
+          },
+        },
+        {
+          columnAttributes: {
+            label: '操作',
+          },
+          render: (h, { row, column, index }) => {
+            return <div style="padding-left:10px">
+              <el-button type="text" onClick={() => {
+              }}>删除</el-button>
+            </div>
+          }
+        }
+      ]
+    },
+    selectedItems() {
+      return [{
+        name: 'slot-component',
+        md: 24,
+        formItemAttributes: {
+          label: '',
+          'label-width': '0px',
+          prop: 'recordSelected',
+          rules: [...required],
+        },
+        render: (h, { props }) => {
+          return (
+            <div>
+              <zj-table
+                columns={this.columns}
+                table-data={this.orderInfo.recordSelected}
+              />
+            </div>
+          )
+        }
+      }]
+    },
+  },
+}

src/views/workOrder/workOrderPool/components/reassignment/index.vue

@@ -0,0 +1,89 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill class="neibuview">
+      <zj-form-container ref="formRef" :form-data="orderInfo" :form-attributes="{ size: 'mini' }">
+        <zj-form-module title="改派 / 下派信息" label-width="100px" :form-data="orderInfo"
+          :form-items="pandanxinxi"></zj-form-module>
+        <zj-form-module title="已选工单" label-width="100px" :form-data="orderInfo"
+          :form-items="selectedItems"></zj-form-module>
+      </zj-form-container>
+    </zj-page-fill>
+    <!-- 操作按钮 -->
+    <div>
+      <div style="box-sizing: border-box;padding: 16px;text-align:right;">
+        <el-button type="primary" size="mini" @click="allVerify">
+          确定
+        </el-button>
+      </div>
+    </div>
+  </zj-page-container>
+</template>
+
+<script>
+import pandanxinxi from '../../detailModule/workOrderInfo/mixins/pandanxinxi.js'
+import showRecordSelected from "../mixins/showRecordSelected.js"
+import { required } from '@/components/template/rules_verify.js'
+export default {
+  mixins: [
+    pandanxinxi,
+    showRecordSelected
+  ],
+  data() {
+    return {
+      orderInfo: {
+        websitId: "",
+        workerId: "",
+        workerId_fz: "",
+        orderWorkers: [],
+        recordSelected: []
+      }
+    }
+  },
+  computed: {
+    formOptions() {
+      return {
+        // 派单信息-----------------------------
+        // 服务商网点
+        websitId: {
+          isEdit: true,
+          isShow: true,
+          isRules: [...required]
+        },
+        workerId: {
+          isEdit: true,
+          isShow: true,
+          isRules: [...required]
+        },
+        orderWorkers: {
+          isEdit: true,
+          isShow: true,
+          isRules: [...required]
+        },
+      }
+    },
+  },
+  methods: {
+    allVerify() {
+      this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
+
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.neibuview {
+  box-sizing: border-box;
+  padding-left: 16px;
+
+  ::v-deep .zj-page-fill-scroll {
+    box-sizing: border-box;
+    padding-right: 16px;
+
+    &>div:nth-child(1) {
+      margin-top: 20px;
+    }
+  }
+}
+</style>

src/views/workOrder/workOrderPool/components/reschedule/index.vue

@@ -0,0 +1,92 @@
+<template>
+  <zj-page-container>
+    <zj-page-fill class="neibuview">
+      <zj-form-container ref="formRef" :form-data="orderInfo" :form-attributes="{ size: 'mini' }">
+        <zj-form-module title="改约 / 预约信息" label-width="110px" :form-data="orderInfo"
+          :form-items="serviceInfo"></zj-form-module>
+        <zj-form-module title="已选工单" label-width="100px" :form-data="orderInfo"
+          :form-items="selectedItems"></zj-form-module>
+      </zj-form-container>
+    </zj-page-fill>
+    <!-- 操作按钮 -->
+    <div>
+      <div style="box-sizing: border-box;padding: 16px;text-align:right;">
+        <el-button type="primary" size="mini" @click="allVerify">
+          确定
+        </el-button>
+      </div>
+    </div>
+  </zj-page-container>
+</template>
+
+<script>
+import showRecordSelected from "../mixins/showRecordSelected.js"
+import { required } from '@/components/template/rules_verify.js'
+export default {
+  mixins: [
+    showRecordSelected
+  ],
+  data() {
+    return {
+      orderInfo: {
+        appointmentTime: "",
+        recordSelected: []
+      }
+    }
+  },
+  computed: {
+    serviceInfo() {
+      return [
+        {
+          isShow: this.formOptions.appointmentTime.isShow,
+          name: 'el-date-picker',
+          md: 8,
+          attributes: {
+            disabled: !this.formOptions.appointmentTime.isEdit,
+            style: { width: '100%' },
+            placeholder: '请选择',
+            'value-format': 'yyyy-MM-dd HH:mm:ss',
+          },
+          formItemAttributes: {
+            label: '预约上门日期',
+            prop: 'appointmentTime',
+            rules: this.formOptions.appointmentTime.isRules
+          }
+        },
+      ]
+    },
+    formOptions() {
+      return {
+        appointmentTime: {
+          isEdit: true,
+          isShow: true,
+          isRules: [...required]
+        },
+      }
+    },
+  },
+  methods: {
+    allVerify() {
+      this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
+
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.neibuview {
+  box-sizing: border-box;
+  padding-left: 16px;
+
+  ::v-deep .zj-page-fill-scroll {
+    box-sizing: border-box;
+    padding-right: 16px;
+
+    &>div:nth-child(1) {
+      margin-top: 20px;
+    }
+  }
+}
+</style>

src/views/workOrder/workOrderPool/index.vue

@@ -17,15 +17,18 @@
       </el-dialog>
     </div>
     <!-- 批量预约/改约 -->
-    <!-- <div class="cartographer_big">
-      <el-dialog title="批量预约" width="100%" :modal="false" :visible.sync="false" :before-close="() => { }">
+    <div class="cartographer_big">
+      <el-dialog title="批量预约 / 改约" width="100%" :modal="false" :visible.sync="rescheduleBool" :before-close="rescheduleClose">
+        <Reschedule v-if="rescheduleBool" />
       </el-dialog>
-    </div> -->
+    </div>
     <!-- 批量派工/改派 -->
-    <!-- <div class="cartographer_big">
-      <el-dialog title="批量派工" width="100%" :modal="false" :visible.sync="false" :before-close="() => { }">
+    <div class="cartographer_big">
+      <el-dialog title="批量派工 / 改派" width="100%" :modal="false" :visible.sync="reassignmentBool"
+        :before-close="reassignmentClose">
+        <Reassignment v-if="reassignmentBool" />
       </el-dialog>
-    </div> -->
+    </div>
   </template-page>
 </template>
 
@@ -33,15 +36,19 @@
 import { EventBus } from '@/utils/eventBus'
 import TemplatePage from '@/components/template/template-page-1.vue'
 import import_mixin from '@/components/template/import_mixin.js'
+import { listPageV2 } from "@/api/workOrder/orderType";
+import { orderBaseList, orderBaseListExport, orderBaseStatusCount } from "@/api/workOrderPool.js"
 import workOrderInfo from './detailModule/workOrderInfo/index.vue'
 import Detail from './detail'
-import { orderBaseList, orderBaseListExport, orderBaseStatusCount } from "@/api/workOrderPool.js"
-import { listPageV2 } from "@/api/workOrder/orderType";
+import Reassignment from "./components/reassignment/index.vue"
+import Reschedule from "./components/reschedule/index.vue"
 export default {
   components: {
     TemplatePage,
     workOrderInfo,
     Detail,
+    Reassignment,
+    Reschedule
   },
   mixins: [import_mixin],
   data() {
@@ -51,6 +58,10 @@ export default {
       createFormBool: false,
       // 详情
       detailFormBool: false,
+      // 批量改约
+      rescheduleBool: false,
+      // 批量派工/改派
+      reassignmentBool: false,
       // 表格属性
       tableAttributes: {
         // 启用勾选列
@@ -136,15 +147,15 @@ export default {
               click: () => { }
             },
             {
-              name: '批量下派工程师',
+              name: '批量下派改派',
               click: () => {
-
+                this.reassignmentBool = true
               }
             },
             {
-              name: '批量改约',
+              name: '批量预约改约',
               click: () => {
-
+                this.rescheduleBool = true
               }
             },
           ],
@@ -179,19 +190,6 @@ export default {
       return row[column['property']] === value
     },
 
-    handleClose() {
-      // this.$router.push({
-      //   name: "workOrderPool",
-      //   params: {},
-      //   query: {}
-      // })
-      this.$nextTick(() => {
-        this.createFormBool = false
-        this.detailFormBool = false
-        this.$refs?.pageRef?.refreshList()
-      })
-    },
-
     // 列表请求函数
     getList(p, cb) {
       try {
@@ -213,8 +211,10 @@ export default {
         })
       }
     },
+
     // 列表导出函数
     exportList: orderBaseListExport,
+
     // 表格列解析渲染数据更改
     columnParsing(item, defaultData) {
       if (item.jname === 'orderFlags') {
@@ -234,10 +234,12 @@ export default {
       }
       return defaultData
     },
+
     // 监听勾选变化
     selectionChange(data) {
       this.recordSelected = data
     },
+
     operation(h, { row, index, column }) {
       return (
         <div class='operation-btns'>
@@ -249,7 +251,31 @@ export default {
           }}>编辑</el-button>
         </div>
       )
-    }
+    },
+
+    handleClose() {
+      this.$router.push({
+        name: "workOrderPool",
+        params: {},
+        query: {}
+      })
+      this.$nextTick(() => {
+        this.createFormBool = false
+        this.detailFormBool = false
+        this.$refs?.pageRef?.refreshList()
+      })
+    },
+
+    rescheduleClose() {
+      this.rescheduleBool = false
+      this.recordSelected = []
+    },
+
+    reassignmentClose() {
+      this.reassignmentBool = false
+      this.recordSelected = []
+    },
+
   }
 }
 </script>