服务工单-基本操作完成

src/views/businessManagement/deliveryRecord/components/littleTable.vue

@@ -1,15 +1,26 @@
 <template>
   <div class="app-container">
-    <div>{{message}}</div>
-    <el-table :key="contact.tableKey" v-loading="contact.listLoading" element-loading-text="给我一点时间" :data="contact.list" border fit highlight-current-row style="width: 100%;" :row-style="rowStyle" :cell-style="cellStyle" class="elTable table-fixed">
-
+    <div>{{ message }}</div>
+    <el-table
+      :key="contact.tableKey"
+      v-loading="contact.listLoading"
+      element-loading-text="给我一点时间"
+      :data="contact.list"
+      border
+      fit
+      highlight-current-row
+      style="width: 100%"
+      :row-style="rowStyle"
+      :cell-style="cellStyle"
+      class="elTable table-fixed"
+    >
       <el-table-column label="序号" align="center" type="index" width="50px">
         <template slot-scope="scope">
           <span>{{ scope.$index + 1 }}</span>
         </template>
       </el-table-column>
 
-      <el-table-column label="货品名称" min-width="110px" align="center">
+      <el-table-column label="产品名称" min-width="110px" align="center">
         <template slot-scope="scope">
           <span>{{ scope.row.pname }}</span>
         </template>
@@ -27,19 +38,43 @@
       <el-table-column label="数量" min-width="110px" align="center">
         <template slot-scope="scope">
           <span v-if="create.dialogStatus == 'see'">{{ scope.row.nums }}</span>
-          <el-input v-if="create.dialogStatus == 'update' ||  create.dialogStatus == 'create' " v-model="scope.row.nums" style="width:95%;padding:10px 0;" />
+          <el-input
+            v-if="
+              create.dialogStatus == 'update' || create.dialogStatus == 'create'
+            "
+            v-model="scope.row.nums"
+            style="width: 95%; padding: 10px 0"
+          />
         </template>
       </el-table-column>
 
       <el-table-column label="备注" min-width="280px" align="center">
         <template slot-scope="scope">
-          <span v-if="create.dialogStatus == 'see'">{{ scope.row.remark }}</span>
-          <el-input v-if="create.dialogStatus == 'update' ||  create.dialogStatus == 'create' " v-model="scope.row.remark" type="textarea" :autosize="{ minRows: 1.3, maxRows: 4}" style="width:95%;padding:10px 0;" />
+          <span v-if="create.dialogStatus == 'see'">{{
+            scope.row.remark
+          }}</span>
+          <el-input
+            v-if="
+              create.dialogStatus == 'update' || create.dialogStatus == 'create'
+            "
+            v-model="scope.row.remark"
+            type="textarea"
+            :autosize="{ minRows: 1.3, maxRows: 4 }"
+            style="width: 95%; padding: 10px 0"
+          />
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" width="110" class-name="small-padding fixed-width" fixed="right">
-        <template slot-scope="{row}">
-          <el-button class="miniDanger" @click="form_delete2(row)">删除</el-button>
+      <el-table-column
+        label="操作"
+        align="center"
+        width="110"
+        class-name="small-padding fixed-width"
+        fixed="right"
+      >
+        <template slot-scope="{ row }">
+          <el-button class="miniDanger" @click="form_delete2(row)"
+            >删除</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -47,51 +82,57 @@
 </template>
 
 <script>
-import { GetDataByName, PostDataByName, failproccess, ExecDataByConfig, GetDataByNames, checkButtons, calculativeWidth } from '@/api/common'
-import Cookies from 'js-cookie'
-import { parseTime } from '@/utils/index.js'
-import Pagination from '@/components/Pagination'
-import { MessageBox } from 'element-ui'
+import {
+  GetDataByName,
+  PostDataByName,
+  failproccess,
+  ExecDataByConfig,
+  GetDataByNames,
+  checkButtons,
+  calculativeWidth,
+} from "@/api/common";
+import Cookies from "js-cookie";
+import { parseTime } from "@/utils/index.js";
+import Pagination from "@/components/Pagination";
+import { MessageBox } from "element-ui";
 export default {
-  name: 'LittleTable',
+  name: "LittleTable",
   components: { Pagination },
   data() {
     return {
-
       message: "",
       isRoleEdit: [],
       contact: {
         dialogFormVisible: false,
-        dialogStatus: '',
-        temp: { id: '', contactName: '', telephone: '', address: '', remark: '' },
+        dialogStatus: "",
+        temp: {
+          id: "",
+          contactName: "",
+          telephone: "",
+          address: "",
+          remark: "",
+        },
         rules: {},
         getdataListParm: {
-          name: 'getContacts',
+          name: "getContacts",
           page: 1,
           offset: 1,
           pagecount: 10,
-          returntype: 'Map',
-          parammaps: { customerId: '' }
+          returntype: "Map",
+          parammaps: { customerId: "" },
         },
         tableKey: 0,
         list: [],
         total: 0,
         listLoading: false,
-
       },
-
-    }
+    };
   },
 
-  created() {
+  created() {},
 
-  },
-
-  methods: {
-
-
-  }
-}
+  methods: {},
+};
 </script>
 <style lang="scss" scoped>
 .search {

src/views/customboard/addboard/index.vue

@@ -1,21 +1,46 @@
 <template>
-
-  <div v-loading="loading" class="container" style="position:relactive">
-    <div style="position:absolute;top:170px;right:100px;z-index:1" v-show="editBtn">
+  <div v-loading="loading" class="container" style="position: relactive">
+    <div
+      style="position: absolute; top: 170px; right: 100px; z-index: 1"
+      v-show="editBtn"
+    >
       <!-- <el-button class="miniSuccess" @click="control_edit()">编辑</el-button> -->
-      <el-button type="primary" size="mini" :loading="control_btn_l" @click="control_edit()">
-        {{control_btn}}
+      <el-button
+        type="primary"
+        size="mini"
+        :loading="control_btn_l"
+        @click="control_edit()"
+      >
+        {{ control_btn }}
       </el-button>
     </div>
 
-    <el-card v-show="false" body-style="padding: 0px;" class="dashboard-list" shadow="never">
+    <el-card
+      v-show="false"
+      body-style="padding: 0px;"
+      class="dashboard-list"
+      shadow="never"
+    >
       <!-- <div slot="header">
         <span>看板</span>
         <i class="el-icon-plus" @click="addDashboard" />
       </div> -->
       <ul>
-        <draggable v-model="dashboardList" :group="{name: 'dashboard',pull: true}" class="draggable-wrapper" @change="handleOrderChange">
-          <li v-for="(item,index) in dashboardList" :key="item.dashboard_id" :class="{'dashboard-list-item': true, 'high-light-dashboard': currentDashboard.dashboard_id === item.dashboard_id}">
+        <draggable
+          v-model="dashboardList"
+          :group="{ name: 'dashboard', pull: true }"
+          class="draggable-wrapper"
+          @change="handleOrderChange"
+        >
+          <li
+            v-for="(item, index) in dashboardList"
+            :key="item.dashboard_id"
+            :class="{
+              'dashboard-list-item': true,
+              'high-light-dashboard':
+                currentDashboard.dashboard_id === item.dashboard_id,
+            }"
+          >
             <span @click="switchDb(item)">
               <i class="el-icon-document" />
               <span>{{ item.name }}</span>
@@ -25,57 +50,98 @@
                 <i class="el-icon-more" />
               </span>
               <el-dropdown-menu slot="dropdown">
-                <el-dropdown-item :command="{
+                <el-dropdown-item
+                  :command="{
                     type: 'edit',
-                    target: item
-                  }">
-                  {{ $t('common.edit') }}
+                    target: item,
+                  }"
+                >
+                  {{ $t("common.edit") }}
                 </el-dropdown-item>
-                <el-dropdown-item :command="{
+                <el-dropdown-item
+                  :command="{
                     type: 'delete',
-                    target: item
-                  }">
-                  {{ $t('common.delete') }}
+                    target: item,
+                  }"
+                >
+                  {{ $t("common.delete") }}
                 </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
-
           </li>
         </draggable>
       </ul>
     </el-card>
-    <dashboardItem :dashboard="currentDashboard" :mode="isEdit" :title="isTitle" @fatherMethod="get_table_data" />
-    <el-dialog :title="$t('dashboard.addOrEditDashboard')" width="750px" :visible.sync="editDialogVisible">
+    <dashboardItem
+      :dashboard="currentDashboard"
+      :mode="isEdit"
+      :title="isTitle"
+      @fatherMethod="get_table_data"
+    />
+    <el-dialog
+      :title="$t('dashboard.addOrEditDashboard')"
+      width="750px"
+      :visible.sync="editDialogVisible"
+    >
       <el-form label-width="160px">
         <el-form-item :label="$t('dashboard.dashboardName')">
-          <el-input v-model="dbObj.name" size="small" style="width: 450px;" :placeholder="$t('dashboard.dashboardNamePlaceholder')" />
+          <el-input
+            v-model="dbObj.name"
+            size="small"
+            style="width: 450px"
+            :placeholder="$t('dashboard.dashboardNamePlaceholder')"
+          />
         </el-form-item>
         <el-form-item :label="$t('dashboard.dashboardDesc')">
-          <el-input v-model="dbObj.desc" type="textarea" :rows="5" size="small" style="width: 450px;" :placeholder="$t('dashboard.dashboardDescPlaceholder')" />
+          <el-input
+            v-model="dbObj.desc"
+            type="textarea"
+            :rows="5"
+            size="small"
+            style="width: 450px"
+            :placeholder="$t('dashboard.dashboardDescPlaceholder')"
+          />
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button type="primary" size="small" @click="editDialogVisible = false"> {{ $t('common.cancel') }}</el-button>
-        <el-button type="primary" size="small" @click="handleSubmit"> {{ $t('common.confirm') }}</el-button>
+        <el-button
+          type="primary"
+          size="small"
+          @click="editDialogVisible = false"
+        >
+          {{ $t("common.cancel") }}</el-button
+        >
+        <el-button type="primary" size="small" @click="handleSubmit">
+          {{ $t("common.confirm") }}</el-button
+        >
       </span>
     </el-dialog>
   </div>
-
 </template>
 
 <script>
-import draggable from 'vuedraggable'
-import dashboardItem from './dashboardItem'
-import { GetDataByName, ExeSqlJiade, PostDataByName, dashboardListJiade } from '@/api/common'
-import Cookies from 'js-cookie'
+import draggable from "vuedraggable";
+import dashboardItem from "./dashboardItem";
+import {
+  GetDataByName,
+  ExeSqlJiade,
+  PostDataByName,
+  dashboardListJiade,
+} from "@/api/common";
+import Cookies from "js-cookie";
 // import { addDashboard, updateDashboard, dashboardList, deleteDashboard, dbOrder } from '@/api/dashboard'
-import { addDashboard, updateDashboard, deleteDashboard, dbOrder } from '@/api/dashboard'
+import {
+  addDashboard,
+  updateDashboard,
+  deleteDashboard,
+  dbOrder,
+} from "@/api/dashboard";
 export default {
-  name: 'Addboard',
+  name: "Addboard",
   components: { dashboardItem, draggable },
   data() {
     return {
-      isEdit: 'view',
+      isEdit: "view",
       dashboardList: [],
       currentDashboard: undefined,
       editDialogVisible: false,
@@ -83,79 +149,70 @@ export default {
       loading: false,
       isCollapse: false,
       did: undefined,
-      isTitle: '2',
+      isTitle: "2",
       editBtn: false,
-      control_btn: '编辑',
+      control_btn: "编辑",
       control_btn_l: false,
 
       get_role_data: {
-        name: 'getChartRole',
+        name: "getChartRole",
         page: 1,
         offset: 1,
         pagecount: 10,
-        returntype: 'Map',
+        returntype: "Map",
         parammaps: {
-          pastureid: Cookies.get('pastureid'),
-          empid: Cookies.get('employeid'),
-          type: '1',
+          pastureid: Cookies.get("pastureid"),
+          empid: Cookies.get("employeid"),
+          type: "1",
           id: localStorage.getItem("AddboardIsEditId"),
-
-        }
+        },
       },
-
-    }
+    };
   },
 
   created() {
     // console.log('this.$route.params.id', this.$route.params.id)
     // const isEdit = this.$route.params.isEdit
 
-    // this.isEdit = isEdit 
-    this.did = window.location.href.split('~')[1]
-    this.haha = window.location.href.split('~')[2]
+    // this.isEdit = isEdit
+    this.did = window.location.href.split("~")[1];
+    this.haha = window.location.href.split("~")[2];
 
-    console.log('this.did', this.did)
-    console.log('this.haha', this.haha)
+    console.log("this.did", this.did);
+    console.log("this.haha", this.haha);
 
     if (this.haha == 3) {
-      console.log('this.haha333333333')
-      this.isTitle = '3'
-      this.editBtn = false
+      console.log("this.haha333333333");
+      this.isTitle = "3";
+      this.editBtn = false;
     } else {
-      this.isTitle = '2'
-      this.get_Role()
+      this.isTitle = "2";
+      this.get_Role();
     }
 
-    this.get_table_data()
-
-
-
+    this.get_table_data();
   },
 
   methods: {
-
-
     get_Role() {
-      GetDataByName(this.get_role_data).then(res => {
-        console.log('权限数据', res.data)
-        if (res.data.list[0].statue == 'editOk') {
-          this.editBtn = true
+      GetDataByName(this.get_role_data).then((res) => {
+        console.log("权限数据", res.data);
+        if (res.data.list[0].statue == "editOk") {
+          this.editBtn = true;
         } else {
-          this.editBtn = false
+          this.editBtn = false;
         }
-
-
-      })
+      });
     },
 
     control_edit() {
-      this.isEdit = 'edit'
+      this.isEdit = "edit";
       if (this.control_btn == "编辑") {
-        this.control_btn = "正在编辑"
-        this.control_btn_l = true
+        this.control_btn = "正在编辑";
+        this.control_btn_l = true;
       } else {
-        this.control_btn = "编辑"
-        this.control_btn_l = false
+        this.control_btn = "编辑";
+        this.control_btn_l = false;
       }
     },
     // get_table_data() {
@@ -186,7 +243,7 @@ export default {
     // },
 
     get_table_data() {
-      this.loading = true
+      this.loading = true;
 
       // if (this.$route.params.id) {
       //   this.did = this.$route.params.id
@@ -194,34 +251,28 @@ export default {
       //   this.did = this.did
       // }
 
-
       if (this.did) {
-
-        this.did = this.did
-
+        this.did = this.did;
       } else {
-        this.did = localStorage.getItem("AddboardIsEditId")
+        this.did = localStorage.getItem("AddboardIsEditId");
       }
 
-
-
-
       var send_data = {
-        name: 'getdashboardsV2',
+        name: "getdashboardsV2",
         parammaps: {
-          pastureid: Cookies.get('pastureid'),
-          empid: Cookies.get('employeid'),
-          did: this.did
-        }
-      }
-      console.log('进入大页面=================')
-
-      dashboardListJiade(send_data).then(resp => {
-        this.loading = false
-        this.dashboardList = []
-        console.log('看板列表数据：', resp)
-        console.log('看板列表优化数据list：', resp.data.list)
-        console.log('看板列表优化数据dashboards：', resp.data.dashboards)
+          pastureid: Cookies.get("pastureid"),
+          empid: Cookies.get("employeid"),
+          did: this.did,
+        },
+      };
+      console.log("进入大页面=================");
+
+      dashboardListJiade(send_data).then((resp) => {
+        this.loading = false;
+        this.dashboardList = [];
+        console.log("看板列表数据：", resp);
+        console.log("看板列表优化数据list：", resp.data.list);
+        console.log("看板列表优化数据dashboards：", resp.data.dashboards);
 
         // resp.data.order.forEach((id, index) => {
         //   const itemIndex = resp.data.dashboards.findIndex(item => item.dashboard_id === id)
@@ -232,48 +283,49 @@ export default {
         //     console.log(id, index)
         //   }
         // })
-        this.dashboardList = this.dashboardList.concat(resp.data.dashboards)
+        this.dashboardList = this.dashboardList.concat(resp.data.dashboards);
         // const dashboard = this.dashboardList.find(item => item.dashboard_id === this.$route.params.id)
-        const dashboard = this.dashboardList.find(item => item.dashboard_id === localStorage.getItem("AddboardIsEditId"))
-
+        const dashboard = this.dashboardList.find(
+          (item) =>
+            item.dashboard_id === localStorage.getItem("AddboardIsEditId")
+        );
 
         if (dashboard) {
-          this.currentDashboard = dashboard
+          this.currentDashboard = dashboard;
         } else {
-          this.currentDashboard = this.dashboardList[0]
+          this.currentDashboard = this.dashboardList[0];
         }
-        console.log('this.currentDashboard', this.currentDashboard)
+        console.log("this.currentDashboard", this.currentDashboard);
 
-        console.log('this.dashboardList', this.dashboardList)
+        console.log("this.dashboardList", this.dashboardList);
 
         if (this.currentDashboard) {
           // this.$router.push({ path: '/customboard/addboard', query: { id: this.currentDashboard.dashboard_id }}).catch(_ => { })
         }
-      })
-
+      });
     },
     switchDb(db) {
       if (db.dashboard_id === this.currentDashboard.dashboard_id) {
-        this.get_table_data()
-        return
+        this.get_table_data();
+        return;
       }
 
-      this.currentDashboard = db
-      this.$router.push(`/dashboard?id=${this.currentDashboard.dashboard_id}`)
+      this.currentDashboard = db;
+      this.$router.push(`/dashboard?id=${this.currentDashboard.dashboard_id}`);
     },
     addDashboard() {
-      this.dbObj = {}
-      this.editDialogVisible = true
+      this.dbObj = {};
+      this.editDialogVisible = true;
     },
     editDashboard(db) {
-      this.dbObj = Object.assign({}, db)
-      this.editDialogVisible = true
+      this.dbObj = Object.assign({}, db);
+      this.editDialogVisible = true;
     },
     handleCommand(cmd) {
-      if (cmd.type === 'edit') {
-        this.editDashboard(cmd.target)
+      if (cmd.type === "edit") {
+        this.editDashboard(cmd.target);
       } else {
-        this.deleteDashboard(cmd.target)
+        this.deleteDashboard(cmd.target);
       }
     },
     // handleSubmit() {
@@ -291,33 +343,33 @@ export default {
     // },
     handleSubmit() {
       if (this.dbObj.dashboard_id) {
-        updateDashboard(this.dbObj).then(resp => {
-          this.get_table_data()
-          this.editDialogVisible = false
-        })
+        updateDashboard(this.dbObj).then((resp) => {
+          this.get_table_data();
+          this.editDialogVisible = false;
+        });
       } else {
-        console.log('this.dbObj', this.dbObj)
+        console.log("this.dbObj", this.dbObj);
 
         var data = {
-          name: 'insertDashboard',
+          name: "insertDashboard",
           parammaps: {
             dname: this.dbObj.name,
             display: this.dbObj.desc,
-            pastureid: Cookies.get('pastureid'),
-            empid: Cookies.get('employeid'),
-            emp: Cookies.get('employename')
-          }
-        }
-
-        PostDataByName(data).then(response => {
-          console.log('新增保存发送参数', data)
+            pastureid: Cookies.get("pastureid"),
+            empid: Cookies.get("employeid"),
+            emp: Cookies.get("employename"),
+          },
+        };
+
+        PostDataByName(data).then((response) => {
+          console.log("新增保存发送参数", data);
           this.$message({
-            type: 'success',
-            message: this.$t('common.saveSuccess')
-          })
-          this.get_table_data()
-          this.editDialogVisible = false
-        })
+            type: "success",
+            message: this.$t("common.saveSuccess"),
+          });
+          this.get_table_data();
+          this.editDialogVisible = false;
+        });
 
         // addDashboard(this.dbObj).then(resp => {
         //   this.get_table_data()
@@ -327,23 +379,26 @@ export default {
     },
     handleOrderChange(evt) {
       const data = {
-        order: this.dashboardList.map(item => item.dashboard_id)
-      }
-      dbOrder(data)
+        order: this.dashboardList.map((item) => item.dashboard_id),
+      };
+      dbOrder(data);
     },
     deleteDashboard(db) {
-      this.$confirm(this.$t('dashboard.deleteConfirm', db.name), this.$t('common.confirm')).then(() => {
+      this.$confirm(
+        this.$t("dashboard.deleteConfirm", db.name),
+        this.$t("common.confirm")
+      ).then(() => {
         deleteDashboard({ dashboard_id: db.dashboard_id }).then(() => {
-          this.get_table_data()
+          this.get_table_data();
           this.$message({
-            type: 'success',
-            message: this.$t('common.deleteSuccess')
-          })
-        })
-      })
-    }
-  }
-}
+            type: "success",
+            message: this.$t("common.deleteSuccess"),
+          });
+        });
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>

src/views/productManagement/installationOrder/components/AcceptDialog.vue

@@ -0,0 +1,193 @@
+<!-- 接单弹窗 -->
+<template>
+  <el-dialog
+    title="接单"
+    :visible.sync="visible"
+    width="500px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    @close="handleDialogClose"
+    custom-class="accept-dialog"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item label="接单人" prop="acceptorId">
+        <el-input v-model="currentUser.name" disabled placeholder="当前用户" />
+      </el-form-item>
+
+      <el-form-item label="接单时间" prop="acceptTime">
+        <el-date-picker
+          v-model="form.acceptTime"
+          type="datetime"
+          placeholder="选择接单时间"
+          style="width: 100%"
+          disabled
+        />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button
+        type="primary"
+        @click="handleSubmit"
+        :loading="submitting"
+        class="submit-btn"
+        >确 定</el-button
+      >
+      <el-button @click="handleCancel" class="cancel-btn">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "AcceptDialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    rowData: {
+      type: Object,
+      default: () => ({}),
+    },
+    currentUser: {
+      type: Object,
+      default: () => ({
+        id: "",
+        name: "",
+      }),
+    },
+  },
+  data() {
+    return {
+      submitting: false,
+      form: {
+        acceptorId: "",
+        acceptTime: new Date(),
+      },
+      rules: {
+        acceptorId: [
+          { required: true, message: "请选择接单人", trigger: "change" },
+        ],
+        acceptTime: [
+          { required: true, message: "请选择接单时间", trigger: "change" },
+        ],
+      },
+    };
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.initForm();
+      }
+    },
+  },
+  methods: {
+    // 初始化表单
+    initForm() {
+      this.form.acceptorId = this.currentUser.id;
+      this.form.acceptTime = new Date();
+    },
+    // 提交表单
+    handleSubmit() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          this.submitting = true;
+          try {
+            await this.$emit("confirm", {
+              orderId: this.rowData.id,
+              acceptorId: this.form.acceptorId,
+              acceptTime: this.formatDateTime(this.form.acceptTime),
+            });
+          } finally {
+            this.submitting = false;
+          }
+        }
+      });
+    },
+    // 取消
+    handleCancel() {
+      this.$emit("update:visible", false);
+    },
+    // 关闭弹窗
+    handleDialogClose() {
+      this.$refs.form.resetFields();
+      this.handleCancel();
+    },
+    // 格式化日期时间
+    formatDateTime(date) {
+      if (!date) return "";
+      const d = new Date(date);
+      const year = d.getFullYear();
+      const month = String(d.getMonth() + 1).padStart(2, "0");
+      const day = String(d.getDate()).padStart(2, "0");
+      const hour = String(d.getHours()).padStart(2, "0");
+      const minute = String(d.getMinutes()).padStart(2, "0");
+      const second = String(d.getSeconds()).padStart(2, "0");
+      return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.accept-dialog {
+  :deep(.el-dialog__body) {
+    padding: 20px 20px 10px 20px;
+  }
+
+  :deep(.el-input.is-disabled .el-input__inner) {
+    color: #606266;
+    background-color: #f5f7fa;
+    border-color: #dcdfe6;
+  }
+
+  :deep(.el-date-editor.is-disabled) {
+    .el-input__inner {
+      color: #606266;
+      background-color: #f5f7fa;
+      border-color: #dcdfe6;
+    }
+  }
+
+  .dialog-footer {
+    text-align: right;
+    padding-top: 10px;
+
+    .submit-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      margin-left: 10px;
+      transition: all 0.3s;
+
+      &:hover {
+        opacity: 0.8;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+
+    .cancel-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      transition: all 0.3s;
+      border: 1px solid #dcdfe6;
+
+      &:hover {
+        color: #409eff;
+        border-color: #c6e2ff;
+        background-color: #ecf5ff;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/AddDialog.vue

@@ -12,7 +12,12 @@
       <el-row :gutter="10">
         <el-col :span="8">
           <el-form-item label="下单人" prop="orderer">
-            <el-select v-model="form.orderer" placeholder="请选择下单人" style="width: 100%" filterable>
+            <el-select
+              v-model="form.orderer"
+              placeholder="请选择下单人"
+              style="width: 100%"
+              filterable
+            >
               <el-option
                 v-for="item in installerOptions"
                 :key="item.value"
@@ -24,19 +29,28 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="服务项目" prop="serviceProject">
-            <el-select v-model="form.serviceProject" placeholder="请选择服务项目" style="width: 100%">
+            <el-select
+              v-model="form.serviceProject"
+              placeholder="请选择服务项目"
+              style="width: 100%"
+            >
               <el-option
                 v-for="item in projectOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
               />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="服务人员" prop="serviceStaff">
-            <el-select v-model="form.serviceStaff" placeholder="请选择服务人员" style="width: 100%">
+            <el-select
+              v-model="form.serviceStaff"
+              multiple
+              placeholder="请选择服务人员"
+              style="width: 100%"
+            >
               <el-option
                 v-for="item in installerOptions"
                 :key="item.value"
@@ -128,19 +142,55 @@
                   <div class="product-option">
                     <div class="option-item">
                       <span class="label">编号</span>
-                      <span class="value">{{item.goodsCode}}</span>
+                      <span class="value">{{ item.goodsCode }}</span>
                     </div>
                     <div class="option-item">
                       <span class="label">名称</span>
-                      <span class="value">{{item.goodsName}}</span>
+                      <el-tooltip
+                        :content="item.goodsName"
+                        placement="top"
+                        :disabled="item.goodsName.length <= 10"
+                        effect="light"
+                      >
+                        <span class="value">{{ item.goodsName }}</span>
+                      </el-tooltip>
                     </div>
                     <div class="option-item">
                       <span class="label">规格</span>
-                      <span class="value">{{item.goodsSpecification || '-'}}</span>
+                      <el-tooltip
+                        :content="item.goodsSpecification"
+                        placement="top"
+                        :disabled="
+                          !item.goodsSpecification ||
+                          item.goodsSpecification.length <= 5
+                        "
+                        effect="light"
+                      >
+                        <span class="value">{{
+                          item.goodsSpecification || "-"
+                        }}</span>
+                      </el-tooltip>
+                    </div>
+                    <div class="option-item">
+                      <span class="label">型号</span>
+                      <el-tooltip
+                        :content="item.goodsModel"
+                        placement="top"
+                        :disabled="
+                          !item.goodsModel || item.goodsModel.length <= 5
+                        "
+                        effect="light"
+                      >
+                        <span class="value">{{ item.goodsModel || "-" }}</span>
+                      </el-tooltip>
+                    </div>
+                    <div class="option-item">
+                      <span class="label">单位</span>
+                      <span class="value">{{ item.goodsUnit || "-" }}</span>
                     </div>
                     <div class="option-item">
                       <span class="label">库存</span>
-                      <span class="value">{{item.stock || 0}}</span>
+                      <span class="value">{{ item.stock || 0 }}</span>
                     </div>
                   </div>
                 </template>
@@ -151,14 +201,38 @@
       </el-row>
 
       <el-form-item label-width="120px">
-        <el-table :data="form.products" border style="width: calc(100% - 20px); ">
-          <el-table-column type="index" label="序号" width="50" align="center" />
-          <el-table-column prop="goodsCode" label="货品编号" align="center" />
-          <el-table-column prop="goodsName" label="货品名称" align="center" />
-          <el-table-column prop="goodsSpecification" label="货品规格" align="center" width="50"/>
-          <el-table-column prop="goodsImagePath" label="货品图片" align="center">
+        <el-table :data="form.products" border style="width: calc(100% - 20px)">
+          <el-table-column
+            type="index"
+            label="序号"
+            width="50"
+            align="center"
+          />
+          <el-table-column
+            prop="goodsCode"
+            label="货品编号"
+            align="center"
+            width="100"
+          />
+          <el-table-column
+            prop="goodsName"
+            label="货品名称"
+            align="center"
+            width="150"
+          />
+          <el-table-column
+            prop="goodsSpecification"
+            label="货品规格"
+            align="center"
+            width="50"
+          />
+          <el-table-column
+            prop="goodsImagePath"
+            label="货品图片"
+            align="center"
+          >
             <template slot-scope="scope">
-              <el-image 
+              <el-image
                 v-if="scope.row.goodsImagePath"
                 :src="baseApi + scope.row.goodsImagePath"
                 style="width: 50px; height: 50px"
@@ -169,16 +243,46 @@
                   <i class="el-icon-picture-outline"></i>
                 </div>
               </el-image>
-              <div v-else class="image-slot" style="width: 50px; height: 50px; display: inline-flex; justify-content: center; align-items: center; background: #f5f7fa; border-radius: 4px;">
-                <i class="el-icon-picture-outline" style="font-size: 20px; color: #909399;"></i>
+              <div
+                v-else
+                class="image-slot"
+                style="
+                  width: 50px;
+                  height: 50px;
+                  display: inline-flex;
+                  justify-content: center;
+                  align-items: center;
+                  background: #f5f7fa;
+                  border-radius: 4px;
+                "
+              >
+                <i
+                  class="el-icon-picture-outline"
+                  style="font-size: 20px; color: #909399"
+                ></i>
               </div>
             </template>
           </el-table-column>
-          <el-table-column prop="goodsUnit" label="计量单位" align="center" width="50"/>
-          <el-table-column prop="stock" label="现有库存" align="center" width="60"/>
-          <el-table-column prop="orderQuantity" label="订单数量" align="center" width="110">
+          <el-table-column
+            prop="goodsUnit"
+            label="计量单位"
+            align="center"
+            width="50"
+          />
+          <el-table-column
+            prop="stock"
+            label="现有库存"
+            align="center"
+            width="60"
+          />
+          <el-table-column
+            prop="orderQuantity"
+            label="订单数量"
+            align="center"
+            width="110"
+          >
             <template slot-scope="scope">
-              <el-input 
+              <el-input
                 v-model="scope.row.orderQuantity"
                 size="mini"
                 style="width: 70px"
@@ -186,27 +290,47 @@
               />
             </template>
           </el-table-column>
-          <el-table-column prop="shippedQuantity" label="已发货数量" align="center" width="70"/>
-          <el-table-column prop="unshippedQuantity" label="未发货数量" align="center" width="70"/>
-          <el-table-column prop="remark" label="备注" align="center" width="100">
+          <el-table-column
+            prop="shippedQuantity"
+            label="已服务数量"
+            align="center"
+            width="70"
+          />
+          <el-table-column
+            prop="unshippedQuantity"
+            label="未服务数量"
+            align="center"
+            width="70"
+          />
+          <el-table-column
+            prop="remark"
+            label="备注"
+            align="center"
+            width="100"
+          >
             <template slot-scope="scope">
-              <el-input 
-                v-model="scope.row.remark" 
+              <el-input
+                v-model="scope.row.remark"
                 size="mini"
                 placeholder="备注"
               />
             </template>
           </el-table-column>
-          <el-table-column label="操作" align="center" width="100" fixed="right">
+          <el-table-column
+            label="操作"
+            align="center"
+            width="100"
+            fixed="right"
+          >
             <template slot-scope="scope">
               <el-button
                 size="mini"
                 type="danger"
                 plain
                 @click="handleRemoveProduct(scope.$index)"
-                style="padding: 4px 8px; border-radius: 4px;"
+                style="padding: 4px 8px; border-radius: 4px"
               >
-                <i class="el-icon-delete" style="margin-right: 2px;" />
+                <i class="el-icon-delete" style="margin-right: 2px" />
                 删除
               </el-button>
             </template>
@@ -222,166 +346,174 @@
 </template>
 
 <script>
-import { GetDataByName,GetDataByNames,ExecDataByConfig } from '@/api/common'
+import { GetDataByName, GetDataByNames, ExecDataByConfig } from "@/api/common";
 
 export default {
-  name: 'AddDialog',
+  name: "AddDialog",
   props: {
     visible: {
       type: Boolean,
-      default: false
+      default: false,
     },
     installerOptions: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     projectOptions: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     currentUser: {
       type: Object,
       default: () => ({
-        id: '',
-        name: ''
-      })
-    }
+        id: "",
+        name: "",
+      }),
+    },
   },
   computed: {
     baseApi() {
-      return process.env.VUE_APP_BASE_API
-    }
+      return process.env.VUE_APP_BASE_API;
+    },
   },
   watch: {
     visible(val) {
       if (val) {
         // 弹窗打开时设置默认值并获取数据
         this.$nextTick(() => {
-          this.form.orderer = parseInt(this.currentUser.id)
-          this.customerOptions = []
-          this.getInitialData()
-        })
+          this.form.orderer = parseInt(this.currentUser.id);
+          this.customerOptions = [];
+          this.getInitialData();
+        });
       }
-    }
+    },
   },
   data() {
     return {
       form: {
-        orderer: '',
-        serviceProject: '',
-        serviceStaff: '',
-        estimatedCompleteTime: '',
-        deliveryNo: '',
-        contract: '',
-        customer: '',
-        remark: '',
-        products: []
+        orderer: "",
+        serviceProject: "",
+        serviceStaff: [],
+        estimatedCompleteTime: "",
+        deliveryNo: "",
+        contract: "",
+        customer: "",
+        remark: "",
+        products: [],
       },
-      
+
       customerOptions: [], // 客户选项
       loading: false, // 客户加载状态
-      selectedProduct: '', // 当前选中的货品
+      selectedProduct: "", // 当前选中的货品
       productOptions: [], // 货品选项
       productLoading: false, // 货品加载状态
-      
+
       // 表单校验规则
       rules: {
         orderer: [
-          { required: true, message: '请选择下单人', trigger: 'change' }
+          { required: true, message: "请选择下单人", trigger: "change" },
         ],
         serviceProject: [
-          { required: true, message: '请选择服务项目', trigger: 'change' }
+          { required: true, message: "请选择服务项目", trigger: "change" },
         ],
         serviceStaff: [
-          { required: true, message: '请选择服务人员', trigger: 'change' }
+          { required: true, message: "请选择服务人员", trigger: "change" },
         ],
         estimatedCompleteTime: [
-          { required: true, message: '请选择预计完成时间', trigger: 'change' }
+          { required: true, message: "请选择预计完成时间", trigger: "change" },
         ],
         customer: [
-          { required: true, message: '请选择客户', trigger: 'change' }
-        ]
-      }
-    }
+          { required: true, message: "请选择客户", trigger: "change" },
+        ],
+      },
+    };
   },
   methods: {
     // 处理客户输入
     handleCustomerInput(value) {
-      this.loading = true
-      const send_select_list = 
-        {
-          name: 'getCustomerNameFuzzy',
-          returntype:'Map',
-          parammaps: {
-            inputvalue: value || ''
-          }
-        }
-      
-
-      GetDataByName(send_select_list).then(response => {
-        this.customerOptions = response.data.list || []
-      }).catch(error => {
-        console.error('搜索客户失败:', error)
-        this.$message.error('搜索客户失败')
-      }).finally(() => {
-        this.loading = false
-      })
+      this.loading = true;
+      const send_select_list = {
+        name: "getCustomerNameFuzzy",
+        returntype: "Map",
+        parammaps: {
+          inputvalue: value || "",
+        },
+      };
+
+      GetDataByName(send_select_list)
+        .then((response) => {
+          this.customerOptions = response.data.list || [];
+        })
+        .catch((error) => {
+          console.error("搜索客户失败:", error);
+          this.$message.error("搜索客户失败");
+        })
+        .finally(() => {
+          this.loading = false;
+        });
     },
 
     // 关闭弹窗
     handleDialogClose() {
-      this.$emit('update:visible', false)
-      this.$refs.form && this.$refs.form.resetFields()
+      this.$emit("update:visible", false);
+      this.$refs.form && this.$refs.form.resetFields();
     },
 
     // 取消
     handleCancel() {
-      this.handleDialogClose()
+      this.handleDialogClose();
     },
-    getInitialData(){
-        this.form.products = []
-        //this.handleProductInput('')
+    getInitialData() {
+      this.form.products = [];
+      //this.handleProductInput('')
     },
     // 移除货品
     handleRemoveProduct(index) {
-      this.form.products.splice(index, 1)
+      this.form.products.splice(index, 1);
     },
 
     // 处理货品输入搜索
     handleProductInput(value) {
-      this.productLoading = true
+      this.productLoading = true;
       const send_select_list = {
-        name: 'getGoodsListByCode',
-        returntype: 'Map',
+        name: "getGoodsListByCode",
+        returntype: "Map",
         parammaps: {
-          goodsCode: value || ''
-        }
-      }
-
-      GetDataByName(send_select_list).then(response => {
-        this.productOptions = response.data.list || []
-        // 打印第一条数据查看结构
-        if (this.productOptions.length > 0) {
-          console.log('商品数据结构:', this.productOptions[0])
-        }
-      }).catch(error => {
-        console.error('搜索货品失败:', error)
-        this.$message.error('搜索货品失败')
-      }).finally(() => {
-        this.productLoading = false
-      })
+          goodsCode: value || "",
+        },
+      };
+
+      GetDataByName(send_select_list)
+        .then((response) => {
+          this.productOptions = response.data.list || [];
+          // 打印第一条数据查看结构
+          if (this.productOptions.length > 0) {
+            console.log("商品数据结构:", this.productOptions[0]);
+          }
+        })
+        .catch((error) => {
+          console.error("搜索货品失败:", error);
+          this.$message.error("搜索货品失败");
+        })
+        .finally(() => {
+          this.productLoading = false;
+        });
     },
 
     // 处理货品选择变化
     handleProductChange(value) {
-      const selectedProduct = this.productOptions.find(item => item.goodsId === value)
+      const selectedProduct = this.productOptions.find(
+        (item) => item.goodsId === value
+      );
       if (selectedProduct) {
         // 检查是否已经添加过该货品
-        const existingProduct = this.form.products.find(item => item.goodsId === selectedProduct.goodsId)
+        const existingProduct = this.form.products.find(
+          (item) => item.goodsId === selectedProduct.goodsId
+        );
         if (existingProduct) {
-          this.$message.warning('该货品已经添加过了')
-          this.selectedProduct = ''
-          return
+          this.$message.warning("该货品已经添加过了");
+          this.selectedProduct = "";
+          return;
         }
 
         // 添加新货品到表格
@@ -390,45 +522,45 @@ export default {
           goodsCode: selectedProduct.goodsCode,
           goodsName: selectedProduct.goodsName,
           goodsSpecification: selectedProduct.goodsSpecification,
-          goodsImagePath: selectedProduct.goodsImagePath || '',
+          goodsImagePath: selectedProduct.goodsImagePath || "",
           goodsUnit: selectedProduct.goodsUnit,
           stock: selectedProduct.stock || 0,
           orderQuantity: 1,
           shippedQuantity: 0,
           unshippedQuantity: 0,
-          remark: ''
-        })
+          remark: "",
+        });
       }
-      this.selectedProduct = '' // 清空选择
+      this.selectedProduct = ""; // 清空选择
     },
 
     // 处理订单数量输入
     handleOrderQuantityInput(value, row) {
       // 只允许输入正整数
-      value = value.replace(/[^\d]/g, '')
-      if (value === '') {
-        row.orderQuantity = 1
+      value = value.replace(/[^\d]/g, "");
+      if (value === "") {
+        row.orderQuantity = 1;
       } else {
-        const num = parseInt(value)
-        row.orderQuantity = num || 1
+        const num = parseInt(value);
+        row.orderQuantity = num || 1;
       }
     },
 
     // 提交表单
-    handleSubmit() {
-      this.$refs.form.validate(async (valid) => {
+    async handleSubmit() {
+      this.$refs.form.validate(async (valid, errorFields) => {
         if (valid) {
           try {
             // 检查是否添加了货品
             if (this.form.products.length === 0) {
-              this.$message.warning('请至少添加一个货品')
-              return
+              this.$message.warning("请至少添加一个货品");
+              return;
             }
 
             // 构建保存参数
             const params = {
               common: {
-                returnmap: "0"
+                returnmap: "0",
               },
               data: [
                 {
@@ -436,31 +568,61 @@ export default {
                   type: "e",
                   parammaps: {
                     projectId: this.form.serviceProject,
-                    projectName: this.projectOptions.find(item => item.value === this.form.serviceProject)?.label || '',
+                    projectName:
+                      this.projectOptions.find(
+                        (item) => item.id === this.form.serviceProject
+                      )?.name || "",
                     customerId: this.form.customer,
-                    customerName: this.customerOptions.find(item => item.id === this.form.customer)?.name || '',
-                    totalQuantity: this.form.products.reduce((sum, item) => sum + parseInt(item.orderQuantity || 0), 0),
+                    customerName:
+                      this.customerOptions.find(
+                        (item) => item.id === this.form.customer
+                      )?.name || "",
+                    totalQuantity: this.form.products.reduce(
+                      (sum, item) => sum + parseInt(item.orderQuantity || 0),
+                      0
+                    ),
                     installedQuantity: 0,
-                    uninstalledQuantity: this.form.products.reduce((sum, item) => sum + parseInt(item.orderQuantity || 0), 0),
+                    uninstalledQuantity: this.form.products.reduce(
+                      (sum, item) => sum + parseInt(item.orderQuantity || 0),
+                      0
+                    ),
+                    createId: this.form.orderer,
+                    createName:
+                      this.installerOptions.find(
+                        (item) => item.value === this.form.orderer
+                      )?.label || "",
                     dispatcherId: this.form.orderer,
-                    dispatcherName: this.installerOptions.find(item => item.value === this.form.orderer)?.label || '',
-                    serviceStaffNames: this.installerOptions.find(item => item.value === this.form.serviceStaff)?.label || '',
-                    serviceStaffIds: this.form.serviceStaff,
-                    estimatedCompleteTime: this.form.estimatedCompleteTime ? this.form.estimatedCompleteTime.toISOString().slice(0, 19).replace('T', ' ') : null,
-                    remark: this.form.remark || ''
-                  }
+                    dispatcherName:
+                      this.installerOptions.find(
+                        (item) => item.value === this.form.orderer
+                      )?.label || "",
+                    serviceStaffNames: this.installerOptions
+                      .filter((item) =>
+                        this.form.serviceStaff.includes(item.value)
+                      )
+                      .map((item) => item.label)
+                      .join(","),
+                    serviceStaffIds: this.form.serviceStaff.join(","),
+                    estimatedCompleteTime: this.form.estimatedCompleteTime
+                      ? this.form.estimatedCompleteTime
+                          .toISOString()
+                          .slice(0, 19)
+                          .replace("T", " ")
+                      : null,
+                    remark: this.form.remark || "",
+                  },
                 },
                 {
                   name: "insertInstallationOrderDetail",
                   resultmaps: {
-                    list: this.form.products.map(item => ({
-                        goodsId: item.goodsId,
-                        goodsName: item.goodsName,
-                        orderQuantity: parseInt(item.orderQuantity || 0),
-                        shippedQuantity: 0,
-                        unshippedQuantity: parseInt(item.orderQuantity || 0),
-                        remark: item.remark || ''
-                    }))
+                    list: this.form.products.map((item) => ({
+                      goodsId: item.goodsId,
+                      goodsName: item.goodsName,
+                      orderQuantity: parseInt(item.orderQuantity || 0),
+                      shippedQuantity: 0,
+                      unshippedQuantity: parseInt(item.orderQuantity || 0),
+                      remark: item.remark || "",
+                    })),
                   },
                   children: [
                     {
@@ -469,47 +631,67 @@ export default {
                       parammaps: {
                         goodsId: "@insertInstallationOrderDetail.goodsId",
                         goodsName: "@insertInstallationOrderDetail.goodsName",
-                        orderQuantity: "@insertInstallationOrderDetail.orderQuantity",
+                        orderQuantity:
+                          "@insertInstallationOrderDetail.orderQuantity",
                         remark: "@insertInstallationOrderDetail.remark",
-                        shippedQuantity: "@insertInstallationOrderDetail.shippedQuantity",
-                        unshippedQuantity: "@insertInstallationOrderDetail.unshippedQuantity",
-                        orderId: "@insertInstallationOrder.LastInsertId"
-                      }
-                    }
-                  ]
-                }
-              ]
-            }
+                        shippedQuantity:
+                          "@insertInstallationOrderDetail.shippedQuantity",
+                        unshippedQuantity:
+                          "@insertInstallationOrderDetail.unshippedQuantity",
+                        orderId: "@insertInstallationOrder.LastInsertId",
+                      },
+                    },
+                  ],
+                },
+              ],
+            };
 
             // 调用保存接口
-            const response = await ExecDataByConfig(params)
-            if (response.msg === 'ok') {
-              this.$message.success('保存成功')
-              this.handleDialogClose()
-              this.$emit('success')
-            } else {
-              this.$message.error(response.data || '保存失败')
-            }
+            ExecDataByConfig(params)
+              .then((response) => {
+                if (response.msg === "ok") {
+                  this.$message.success("保存成功");
+                  this.handleDialogClose();
+                  this.$emit("success");
+                } else {
+                  this.$message.error(response.data || "保存失败");
+                }
+              })
+              .catch((error) => {
+                console.error("保存失败:", error);
+                this.$message.error("保存失败");
+              });
           } catch (error) {
-            console.error('保存失败:', error)
-            this.$message.error('保存失败')
+            console.error("保存失败:", error);
+            this.$message.error("保存失败");
+          }
+        } else {
+          // 收集并显示验证错误信息
+          const errorMessages = [];
+          for (const field in errorFields) {
+            const errors = errorFields[field];
+            errors.forEach((error) => {
+              errorMessages.push(error.message);
+            });
           }
+          this.$message.error(`表单验证失败：${errorMessages.join("、")}`);
+          return false;
         }
-      })
-    }
-  }
-}
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
 :deep(.el-dialog) {
   border-radius: 8px;
-  
+
   .el-dialog__header {
     padding: 20px;
     border-bottom: 1px solid #ebeef5;
     margin-right: 0;
-    
+
     .el-dialog__title {
       font-size: 16px;
       font-weight: 500;
@@ -519,31 +701,31 @@ export default {
 
   .el-dialog__body {
     padding: 20px;
-    
+
     .el-form {
       .el-form-item {
         margin-bottom: 18px;
-        
+
         .el-form-item__label {
           font-weight: normal;
           color: #606266;
         }
       }
-      
+
       .el-textarea {
         width: 100%;
       }
-      
+
       .el-table {
         margin-top: 8px;
-        
+
         th {
           background-color: #f5f7fa;
           color: #333;
           font-weight: 500;
           padding: 8px 0;
         }
-        
+
         td {
           padding: 8px 0;
         }
@@ -555,12 +737,12 @@ export default {
     padding: 15px 20px;
     border-top: 1px solid #ebeef5;
     text-align: right;
-    
+
     .el-button {
       padding: 9px 20px;
       font-size: 13px;
       border-radius: 4px;
-      
+
       & + .el-button {
         margin-left: 10px;
       }
@@ -595,30 +777,12 @@ export default {
     padding: 0 4px;
     box-sizing: border-box;
 
-    &:first-child {
-      width: 180px;
+    &:not(:last-child) {
       padding-right: 16px;
       margin-right: 4px;
-      
-      &::after {
-        content: '';
-        position: absolute;
-        right: 0;
-        top: 50%;
-        height: 14px;
-        width: 1px;
-        background-color: #dcdfe6;
-        transform: translateY(-50%);
-      }
-    }
 
-    &:nth-child(2) {
-      width: 160px;
-      padding-right: 16px;
-      margin-right: 4px;
-      
       &::after {
-        content: '';
+        content: "";
         position: absolute;
         right: 0;
         top: 50%;
@@ -629,34 +793,31 @@ export default {
       }
     }
 
+    &:nth-child(1) {
+      width: 120px;
+    } // 编号
+    &:nth-child(2) {
+      width: 250px;
+    } // 名称
     &:nth-child(3) {
-      width: 140px;
-      padding-right: 16px;
-      margin-right: 4px;
-      
-      &::after {
-        content: '';
-        position: absolute;
-        right: 0;
-        top: 50%;
-        height: 14px;
-        width: 1px;
-        background-color: #dcdfe6;
-        transform: translateY(-50%);
-      }
-    }
-
-    &:last-child {
-      flex: 1;
-      min-width: 80px;
-    }
+      width: 120px;
+    } // 规格
+    &:nth-child(4) {
+      width: 120px;
+    } // 型号
+    &:nth-child(5) {
+      width: 80px;
+    } // 单位
+    &:nth-child(6) {
+      width: 80px;
+    } // 库存
 
     .label {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       font-weight: 500;
-      color: #409EFF;
+      color: #409eff;
       background: rgba(64, 158, 255, 0.08);
       padding: 1px 6px;
       border-radius: 3px;
@@ -689,9 +850,10 @@ export default {
   margin: 1px;
   line-height: normal;
 
-  &.hover, &:hover {
+  &.hover,
+  &:hover {
     background-color: transparent;
-    
+
     .product-option {
       background-color: #f9fafc;
       border-color: #e4e7ed;
@@ -703,18 +865,18 @@ export default {
     .product-option {
       background-color: #f0f7ff;
       border-color: rgba(64, 158, 255, 0.2);
-      
+
       .label {
         background: rgba(64, 158, 255, 0.12);
         border-color: rgba(64, 158, 255, 0.3);
       }
-      
+
       .value {
-        color: #409EFF;
+        color: #409eff;
       }
 
       &::after {
-        content: '';
+        content: "";
         position: absolute;
         right: 8px;
         top: 50%;
@@ -722,7 +884,7 @@ export default {
         width: 4px;
         height: 4px;
         border-radius: 50%;
-        background-color: #409EFF;
+        background-color: #409eff;
       }
     }
   }
@@ -732,4 +894,18 @@ export default {
   padding: 1px;
   max-height: 280px;
 }
-</style> 
+
+:deep(.el-tooltip__popper) {
+  max-width: 300px;
+  line-height: 1.4;
+  padding: 8px 12px;
+  font-size: 12px;
+  word-break: break-all;
+  white-space: pre-wrap;
+
+  &.is-light {
+    border: 1px solid #e4e7ed;
+    color: #606266;
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/CheckDialog.vue

@@ -0,0 +1,380 @@
+<!-- 验收弹窗 -->
+<template>
+  <el-dialog
+    title="验收"
+    :visible.sync="visible"
+    width="500px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    @close="handleDialogClose"
+    custom-class="check-dialog"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item label="服务人员" prop="serviceStaffId">
+        <el-select
+          v-model="form.serviceStaffId"
+          placeholder="请选择服务人员"
+          style="width: 100%"
+          filterable
+        >
+          <el-option
+            v-for="item in installerOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="客户联系人" prop="customerContactId">
+        <el-select
+          v-model="form.customerContactId"
+          placeholder="请选择客户联系人"
+          style="width: 100%"
+          filterable
+        >
+          <el-option
+            v-for="item in customerContactOptions"
+            :key="item.id"
+            :label="item.contactName"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="验收日期" prop="checkDate">
+        <el-date-picker
+          v-model="form.checkDate"
+          type="date"
+          placeholder="选择验收日期"
+          style="width: 100%"
+        />
+      </el-form-item>
+
+      <el-form-item label="验收单" prop="checkImage">
+        <el-upload
+          id="uploadPic"
+          list-type="picture-card"
+          class="uploadPic"
+          :action="uploadImageUrl"
+          :limit="1"
+          :headers="headers"
+          :file-list="fileList"
+          :on-preview="handlePicPreview"
+          :auto-upload="true"
+          :on-change="
+            (file, fileList) => {
+              return handlePicChange(file, fileList);
+            }
+          "
+          :on-success="
+            (response, file, fileList) => {
+              return handlePicSuccess(response, file, fileList);
+            }
+          "
+          :on-remove="
+            (file, fileList) => {
+              return handlePicRemove(file, fileList);
+            }
+          "
+        >
+          <i slot="default" class="el-icon-plus"></i>
+        </el-upload>
+      </el-form-item>
+    </el-form>
+
+    <!-- 图片预览 -->
+    <el-dialog
+      title="预览"
+      :visible.sync="previewVisible"
+      append-to-body
+      width="800px"
+    >
+      <img :src="form.checkImagePreview" style="width: 100%" />
+    </el-dialog>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button
+        type="primary"
+        @click="handleSubmit"
+        :loading="submitting"
+        class="submit-btn"
+        >确 定</el-button
+      >
+      <el-button @click="handleCancel" class="cancel-btn">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { getToken } from "@/utils/auth";
+export default {
+  name: "CheckDialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    rowData: {
+      type: Object,
+      default: () => ({}),
+    },
+    installerOptions: {
+      type: Array,
+      default: () => [],
+    },
+    currentUser: {
+      type: Object,
+      default: () => ({}),
+    },
+    customerContactOptions: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      submitting: false,
+      previewVisible: false,
+      form: {
+        serviceStaffId: "",
+        customerContactId: "",
+        checkDate: new Date(),
+        checkImage: "",
+      },
+      rules: {
+        serviceStaffId: [
+          { required: true, message: "请选择服务人员", trigger: "change" },
+        ],
+        customerContactId: [
+          { required: true, message: "请选择客户联系人", trigger: "change" },
+        ],
+        checkDate: [
+          { required: true, message: "请选择验收日期", trigger: "change" },
+        ],
+        checkImage: [
+          { required: true, message: "请上传验收单", trigger: "change" },
+        ],
+      },
+      uploadImageUrl: process.env.VUE_APP_BASE_API + "authdata/uploaderimage",
+      headers: {
+        optname: "insertcustompic",
+        id: 1,
+        token: getToken(),
+      },
+      fileList: [],
+    };
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.initForm();
+      }
+    },
+  },
+  methods: {
+    initForm() {
+      this.form = {
+        serviceStaffId: parseInt(this.currentUser.id),
+        checkDate: new Date(),
+        checkImage: "",
+      };
+      this.fileList = [];
+      console.log("this.form", this.form);
+    },
+    beforeUpload(file) {
+      const isImage = file.type.startsWith("image/");
+      const isLt2M = file.size / 1024 / 1024 < 2;
+
+      if (!isImage) {
+        this.$message.error("只能上传图片文件!");
+        return false;
+      }
+      if (!isLt2M) {
+        this.$message.error("图片大小不能超过 2MB!");
+        return false;
+      }
+      return true;
+    },
+    handlePicSuccess(response, file, fileList) {
+      const id = response.execresult.LastInsertId;
+      this.form.checkImage = id;
+      if (file.raw) {
+        file.url = window.URL.createObjectURL(file.raw);
+      }
+      this.fileList = fileList;
+    },
+    handlePicChange(file, fileList) {
+      this.fileList = fileList;
+    },
+    handlePicPreview(file) {
+      this.previewVisible = true;
+    },
+    handlePicRemove(file, fileList) {
+      this.fileList = fileList;
+      if (fileList.length === 0) {
+        this.form.checkImage = "";
+      }
+    },
+    handleSubmit() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          this.submitting = true;
+          try {
+            await this.$emit("confirm", {
+              orderId: this.rowData.id,
+              serviceStaffId: this.form.serviceStaffId,
+              customerContactId: this.form.customerContactId,
+              checkDate: this.formatDate(this.form.checkDate),
+              checkImage: this.form.checkImage,
+            });
+          } finally {
+            this.submitting = false;
+          }
+        }
+      });
+    },
+    handleCancel() {
+      this.$emit("update:visible", false);
+    },
+    handleDialogClose() {
+      this.$refs.form.resetFields();
+      this.handleCancel();
+    },
+    formatDate(date) {
+      if (!date) return "";
+      const d = new Date(date);
+      const year = d.getFullYear();
+      const month = String(d.getMonth() + 1).padStart(2, "0");
+      const day = String(d.getDate()).padStart(2, "0");
+      return `${year}-${month}-${day}`;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.check-dialog {
+  :deep(.el-dialog__body) {
+    padding: 20px 20px 10px 20px;
+  }
+
+  .upload-container {
+    width: 100%;
+
+    .upload-area {
+      width: 100%;
+      height: 148px;
+      border: 1px dashed #d9d9d9;
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      &:hover {
+        border-color: #409eff;
+      }
+
+      .el-icon-plus {
+        font-size: 28px;
+        color: #8c939d;
+        margin-bottom: 8px;
+      }
+
+      .upload-text {
+        font-size: 14px;
+        color: #606266;
+      }
+    }
+
+    .image-preview {
+      width: 100%;
+      height: 148px;
+      position: relative;
+      border: 1px solid #d9d9d9;
+      border-radius: 6px;
+      overflow: hidden;
+
+      .preview-img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      .image-actions {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background: rgba(0, 0, 0, 0.5);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        opacity: 0;
+        transition: opacity 0.3s;
+
+        i {
+          color: #fff;
+          font-size: 20px;
+          margin: 0 10px;
+          cursor: pointer;
+
+          &:hover {
+            transform: scale(1.1);
+          }
+        }
+      }
+
+      &:hover .image-actions {
+        opacity: 1;
+      }
+    }
+  }
+
+  .dialog-footer {
+    text-align: right;
+    padding-top: 10px;
+
+    .submit-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      margin-left: 10px;
+      transition: all 0.3s;
+
+      &:hover {
+        opacity: 0.8;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+
+    .cancel-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      transition: all 0.3s;
+      border: 1px solid #dcdfe6;
+
+      &:hover {
+        color: #409eff;
+        border-color: #c6e2ff;
+        background-color: #ecf5ff;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/DailyWriteDialog.vue

@@ -0,0 +1,511 @@
+<!-- 每日填写弹窗 -->
+<template>
+  <el-dialog
+    title="服务填写"
+    :visible.sync="visible"
+    width="1000px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    @close="handleDialogClose"
+    custom-class="daily-write-dialog"
+  >
+    <div class="service-info">
+      <div class="info-item">
+        <span class="label">客户：</span>
+        <span class="value">{{ rowData.customerName }}</span>
+      </div>
+      <div class="info-item">
+        <span class="label">预计完成时间：</span>
+        <span class="value">{{ rowData.estimatedCompleteTime }}</span>
+      </div>
+      <div class="info-item">
+        <span class="label">服务人员：</span>
+        <span class="value">{{ rowData.serviceStaffNames }}</span>
+      </div>
+      <div class="info-item">
+        <span class="label">项目名称：</span>
+        <span class="value">{{ rowData.projectName }}</span>
+      </div>
+    </div>
+
+    <div class="table-header">
+      <div class="date-select">
+        <span class="label">日期（日期可多选，最多可选择三天）：</span>
+        <el-date-picker
+          v-model="selectedDates"
+          type="dates"
+          placeholder="选择日期（最多可选3天）"
+          format="yyyy-MM-dd"
+          value-format="yyyy-MM-dd"
+          :style="{ width: '400px' }"
+          :picker-options="{
+            disabledDate(time) {
+              return time.getTime() > Date.now();
+            },
+          }"
+          @change="handleDateChange"
+        />
+      </div>
+      <el-button
+        type="primary"
+        size="small"
+        icon="el-icon-refresh-right"
+        @click="resetTable"
+        >重置</el-button
+      >
+    </div>
+
+    <el-table :data="tableData" border style="width: 100%; margin-top: 15px">
+      <el-table-column prop="date" label="日期" width="100" align="center">
+      </el-table-column>
+      <el-table-column prop="goodsName" label="货品" width="150" align="center">
+        <template slot-scope="scope">
+          {{ scope.row.goodsName }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="isWrite"
+        label="是否填写"
+        width="80"
+        align="center"
+      >
+        <template slot-scope="scope">
+          <el-tag
+            :type="scope.row.isWrite === '已填写' ? 'success' : 'warning'"
+          >
+            {{ scope.row.isWrite }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="orderQuantity"
+        label="计划总量"
+        width="100"
+        align="center"
+      />
+      <el-table-column
+        prop="installQuantity"
+        label="累计完成量"
+        width="100"
+        align="center"
+      />
+
+      <el-table-column
+        prop="todayQuantity"
+        label="当日完成量"
+        width="120"
+        align="center"
+      >
+        <template slot-scope="scope">
+          <el-input
+            v-model.number="scope.row.todayQuantity"
+            size="small"
+            type="number"
+            min="0"
+            :max="scope.row.unshippedQuantity"
+            @input="handleTodayQuantityChange(scope.row)"
+            style="width: 80px"
+            placeholder="必填"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="unshippedQuantity"
+        label="剩余量"
+        width="100"
+        align="center"
+      />
+      <el-table-column prop="installRemark" label="备注" align="center">
+        <template slot-scope="scope">
+          <el-input
+            v-model="scope.row.installRemark"
+            type="text"
+            size="small"
+            placeholder="请输入备注"
+            maxlength="200"
+            show-word-limit
+          />
+        </template>
+      </el-table-column>
+
+      <el-table-column label="操作" width="80" align="center" fixed="right">
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="mini"
+            class="delete-btn"
+            @click="handleDelete(scope.$index)"
+          >
+            <i class="el-icon-delete" />
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button
+        type="primary"
+        @click="handleSubmit"
+        :loading="submitting"
+        class="submit-btn"
+      >
+        保存
+      </el-button>
+      <el-button @click="handleCancel" class="cancel-btn"> 取消 </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import {
+  GetDataByName,
+  GetDataByNames,
+  PostDataByName,
+  ExecDataByConfig,
+} from "@/api/common";
+export default {
+  name: "DailyWriteDialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    rowData: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      submitting: false,
+      tableData: [],
+      selectedDates: [new Date().toISOString().split("T")[0]],
+      form: {
+        date: new Date(),
+        goods: "",
+        totalQuantity: 0,
+        completedQuantity: 0,
+        todayQuantity: 0,
+        remainingQuantity: 0,
+        remark: "",
+      },
+    };
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.selectedDates = [new Date().toISOString().split("T")[0]];
+        this.handleDateChange(this.selectedDates);
+        this.tableData = [];
+      }
+    },
+  },
+  methods: {
+    // 处理日期选择变化
+    async handleDateChange(dates) {
+      if (!dates) {
+        this.selectedDates = [];
+        this.tableData = [];
+        return;
+      }
+
+      // 限制最多选择3天
+      if (dates.length > 3) {
+        this.$message.warning("最多只能选择3天");
+        this.selectedDates = dates.slice(0, 3);
+        dates = this.selectedDates;
+      }
+
+      // 这里添加加载状态
+      this.$set(this, "loading", true);
+      console.log("选择的日期：", dates);
+
+      // 调用后端接口获取数据
+      const params = {
+        name: "getInstallationDailyData",
+        returntype: "Map",
+        parammaps: {
+          orderId: this.rowData.id,
+          dates: dates.join(","),
+        },
+      };
+
+      try {
+        const response = await GetDataByName(params).catch((error) => {
+          console.error("API调用出错：", error);
+          throw error;
+        });
+
+        if (!response) {
+          throw new Error("接口返回数据为空");
+        }
+
+        if (response.msg === "ok") {
+          if (response.data.list && response.data.list.length > 0) {
+            await this.initTableDataWithResponse(response.data.list);
+          } else {
+            console.warn("返回数据列表为空");
+            this.tableData = [];
+            this.$message.warning("暂无数据");
+          }
+        } else {
+          console.error("接口返回错误：", response.msg);
+          this.$message.error(response?.msg || "获取数据失败");
+          this.tableData = [];
+        }
+      } catch (error) {
+        console.error("数据处理失败:", error);
+        this.$message.error(error.message || "获取数据失败");
+        this.tableData = [];
+      } finally {
+        this.$set(this, "loading", false);
+      }
+    },
+
+    // 根据返回数据初始化表格
+    async initTableDataWithResponse(responseData) {
+      if (!Array.isArray(responseData)) {
+        console.error("返回数据格式错误:", responseData);
+        this.$message.error("数据格式错误");
+        return;
+      }
+
+      try {
+        console.log("开始处理表格数据:", responseData);
+        this.tableData = responseData.map((item) => {
+          const processedItem = {
+            date: item.date,
+            goodsName: item.goodsName,
+            goodsId: item.goodsId,
+            orderQuantity: item.orderQuantity || 0,
+            installQuantity: item.installQuantity || 0,
+            todayQuantity: item.todayQuantity || 0,
+            unshippedQuantity: item.unshippedQuantity || 0,
+            installRemark: item.installRemark || "",
+            isWrite: item.isWrite || "未填写",
+            orderId: item.orderId,
+          };
+          return processedItem;
+        });
+      } catch (error) {
+        console.error("初始化表格数据失败:", error);
+        this.$message.error("初始化数据失败");
+        this.tableData = [];
+      }
+    },
+
+    // 重置表格
+    resetTable() {
+      this.selectedDates = [];
+      this.tableData = [];
+    },
+
+    // 处理今日完成量变化
+    handleTodayQuantityChange(row) {
+      // 确保输入的是非负整数
+      row.todayQuantity = Math.floor(Math.max(0, row.todayQuantity));
+
+      if (row.todayQuantity > row.unshippedQuantity) {
+        row.todayQuantity = row.unshippedQuantity;
+        this.$message.warning("当日完成量不能超过剩余量");
+      }
+    },
+
+    // 验证表格数据
+    validateTableData() {
+      const invalidRows = this.tableData.filter(
+        (row) => !row.todayQuantity || row.todayQuantity <= 0
+      );
+
+      if (invalidRows.length > 0) {
+        const dates = invalidRows.map((row) => row.date).join("、");
+        this.$message.error(`${dates} 的当日完成量必须大于0`);
+        return false;
+      }
+      return true;
+    },
+
+    // 删除行
+    handleDelete(index) {
+      this.tableData.splice(index, 1);
+    },
+    // 提交表单
+    async handleSubmit() {
+      if (!this.tableData.length) {
+        this.$message.warning("请至少填写一条记录");
+        return;
+      }
+
+      // 验证当日完成量
+      if (!this.validateTableData()) {
+        return;
+      }
+
+      this.submitting = true;
+      try {
+        await this.$emit("confirm", {
+          records: this.tableData,
+          dates: this.selectedDates,
+        });
+      } finally {
+        this.submitting = false;
+      }
+    },
+    // 取消
+    handleCancel() {
+      this.$emit("update:visible", false);
+    },
+    // 关闭弹窗
+    handleDialogClose() {
+      this.tableData = [];
+      this.handleCancel();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.daily-write-dialog {
+  :deep(.el-dialog__body) {
+    padding: 20px 20px 10px 20px;
+  }
+
+  .service-info {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 20px;
+    padding: 15px;
+    background-color: #f5f7fa;
+    border-radius: 4px;
+
+    .info-item {
+      display: flex;
+      align-items: center;
+
+      .label {
+        color: #606266;
+        margin-right: 8px;
+        font-size: 14px;
+      }
+
+      .value {
+        color: #333;
+        font-weight: 500;
+        font-size: 14px;
+      }
+    }
+  }
+
+  .table-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 20px;
+    padding: 0 5px;
+
+    .date-select {
+      display: flex;
+      align-items: center;
+
+      .label {
+        margin-right: 10px;
+        font-size: 14px;
+        color: #606266;
+      }
+    }
+
+    .el-button {
+      margin-left: 15px;
+    }
+  }
+
+  :deep(.el-table) {
+    margin-top: 15px;
+
+    th {
+      background-color: #f5f7fa;
+      color: #333;
+      font-weight: 500;
+      height: 44px;
+      padding: 8px 0;
+      text-align: center;
+    }
+
+    td {
+      padding: 4px 0;
+    }
+
+    .delete-btn {
+      color: #f56c6c;
+      font-size: 16px;
+      padding: 0;
+      margin: 0;
+
+      &:hover {
+        color: #ff7875;
+        transform: scale(1.1);
+      }
+
+      &:active {
+        transform: scale(0.9);
+      }
+    }
+
+    .el-input-number {
+      width: 100px;
+    }
+
+    .el-date-editor {
+      .el-input__inner {
+        font-size: 12px;
+        padding-left: 25px;
+      }
+    }
+
+    .el-input__inner {
+      text-align: center;
+    }
+  }
+
+  .dialog-footer {
+    text-align: right;
+    padding-top: 10px;
+
+    .submit-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      margin-left: 10px;
+      transition: all 0.3s;
+
+      &:hover {
+        opacity: 0.8;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+
+    .cancel-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      transition: all 0.3s;
+      border: 1px solid #dcdfe6;
+
+      &:hover {
+        color: #409eff;
+        border-color: #c6e2ff;
+        background-color: #ecf5ff;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/DispatchDialog.vue

@@ -0,0 +1,239 @@
+<!-- 派单弹窗 -->
+<template>
+  <el-dialog
+    title="派单"
+    :visible.sync="visible"
+    width="500px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    @close="handleDialogClose"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item label="服务人员" prop="serviceStaffIds">
+        <el-select
+          v-model="form.serviceStaffIds"
+          multiple
+          placeholder="请选择服务人员"
+          style="width: 100%"
+          filterable
+        >
+          <el-option
+            v-for="item in installerOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="派单人" prop="dispatcherId">
+        <el-select
+          v-model="form.dispatcherId"
+          placeholder="请选择派单人"
+          style="width: 100%"
+          filterable
+        >
+          <el-option
+            v-for="item in installerOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="派单日期" prop="dispatcherDate">
+        <el-date-picker
+          v-model="form.dispatcherDate"
+          type="date"
+          placeholder="选择派单日期"
+          style="width: 100%"
+        />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="handleSubmit">确 定</el-button>
+      <el-button @click="handleCancel">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { ExecDataByConfig } from "@/api/common";
+
+export default {
+  name: "DispatchDialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    installerOptions: {
+      type: Array,
+      default: () => [],
+    },
+    currentUser: {
+      type: Object,
+      default: () => ({
+        id: "",
+        name: "",
+      }),
+    },
+    rowData: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      form: {
+        serviceStaffIds: [],
+        dispatcherId: "",
+        dispatcherDate: new Date(),
+      },
+      rules: {
+        serviceStaffIds: [
+          { required: true, message: "请选择服务人员", trigger: "change" },
+        ],
+        dispatcherId: [
+          { required: true, message: "请选择派单人", trigger: "change" },
+        ],
+        dispatcherDate: [
+          { required: true, message: "请选择派单日期", trigger: "change" },
+        ],
+      },
+    };
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        // 弹窗打开时设置默认值
+        this.$nextTick(() => {
+          this.form.dispatcherId = parseInt(this.currentUser.id);
+          this.form.dispatcherDate = new Date();
+        });
+      }
+    },
+  },
+  methods: {
+    // 关闭弹窗
+    handleDialogClose() {
+      this.$emit("update:visible", false);
+      this.$refs.form && this.$refs.form.resetFields();
+    },
+
+    // 取消
+    handleCancel() {
+      this.handleDialogClose();
+    },
+
+    // 提交表单
+    handleSubmit() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          try {
+            const params = {
+              common: {
+                returnmap: "0",
+              },
+              data: [
+                {
+                  name: "dispatchInstallationOrder",
+                  type: "e",
+                  parammaps: {
+                    orderId: this.rowData.id,
+                    serviceStaffIds: this.form.serviceStaffIds.join(","),
+                    serviceStaffNames: this.installerOptions
+                      .filter((item) =>
+                        this.form.serviceStaffIds.includes(item.value)
+                      )
+                      .map((item) => item.label)
+                      .join(","),
+                    dispatcherId: this.form.dispatcherId,
+                    dispatcherName:
+                      this.installerOptions.find(
+                        (item) => item.value === this.form.dispatcherId
+                      )?.label || "",
+                    dispatcherDate: this.formatDate(this.form.dispatcherDate),
+                  },
+                },
+              ],
+            };
+
+            const response = await ExecDataByConfig(params);
+            if (response.msg === "ok") {
+              this.$message.success("派单成功");
+              this.handleDialogClose();
+              this.$emit("success");
+            } else {
+              this.$message.error(response.msg || "派单失败");
+            }
+          } catch (error) {
+            console.error("派单失败:", error);
+            this.$message.error("派单失败");
+          }
+        }
+      });
+    },
+
+    // 格式化日期
+    formatDate(date) {
+      if (!date) return "";
+      const d = new Date(date);
+      const year = d.getFullYear();
+      const month = String(d.getMonth() + 1).padStart(2, "0");
+      const day = String(d.getDate()).padStart(2, "0");
+      return `${year}-${month}-${day}`;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-dialog) {
+  border-radius: 8px;
+
+  .el-dialog__header {
+    padding: 20px;
+    border-bottom: 1px solid #ebeef5;
+    margin-right: 0;
+
+    .el-dialog__title {
+      font-size: 16px;
+      font-weight: 500;
+      color: #333;
+    }
+  }
+
+  .el-dialog__body {
+    padding: 20px;
+
+    .el-form {
+      .el-form-item {
+        margin-bottom: 18px;
+
+        .el-form-item__label {
+          font-weight: normal;
+          color: #606266;
+        }
+      }
+    }
+  }
+
+  .el-dialog__footer {
+    padding: 15px 20px;
+    border-top: 1px solid #ebeef5;
+    text-align: right;
+
+    .el-button {
+      padding: 9px 20px;
+      font-size: 13px;
+      border-radius: 4px;
+
+      & + .el-button {
+        margin-left: 10px;
+      }
+    }
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/EditDialog.vue

@@ -16,8 +16,13 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="下单人" prop="orderer">
-            <el-select v-model="form.orderer" placeholder="请选择下单人" style="width: 100%" filterable>
+          <el-form-item label="下单人" prop="createId">
+            <el-select
+              v-model="form.createId"
+              placeholder="请选择下单人"
+              style="width: 100%"
+              filterable
+            >
               <el-option
                 v-for="item in installerOptions"
                 :key="item.value"
@@ -43,19 +48,28 @@
       <el-row :gutter="10">
         <el-col :span="8">
           <el-form-item label="服务项目" prop="serviceProject">
-            <el-select v-model="form.serviceProject" placeholder="请选择服务项目" style="width: 100%">
+            <el-select
+              v-model="form.serviceProject"
+              placeholder="请选择服务项目"
+              style="width: 100%"
+            >
               <el-option
                 v-for="item in projectOptions"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
               />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="服务人员" prop="serviceStaffIds">
-            <el-select v-model="form.serviceStaffIds" placeholder="请选择服务人员" style="width: 100%">
+            <el-select
+              v-model="form.serviceStaffIds"
+              multiple
+              placeholder="请选择服务人员"
+              style="width: 100%"
+            >
               <el-option
                 v-for="item in installerOptions"
                 :key="item.value"
@@ -136,19 +150,55 @@
                   <div class="product-option">
                     <div class="option-item">
                       <span class="label">编号</span>
-                      <span class="value">{{item.goodsCode}}</span>
+                      <span class="value">{{ item.goodsCode }}</span>
                     </div>
                     <div class="option-item">
                       <span class="label">名称</span>
-                      <span class="value">{{item.goodsName}}</span>
+                      <el-tooltip
+                        :content="item.goodsName"
+                        placement="top"
+                        :disabled="item.goodsName.length <= 10"
+                        effect="light"
+                      >
+                        <span class="value">{{ item.goodsName }}</span>
+                      </el-tooltip>
                     </div>
                     <div class="option-item">
                       <span class="label">规格</span>
-                      <span class="value">{{item.goodsSpecification || '-'}}</span>
+                      <el-tooltip
+                        :content="item.goodsSpecification"
+                        placement="top"
+                        :disabled="
+                          !item.goodsSpecification ||
+                          item.goodsSpecification.length <= 5
+                        "
+                        effect="light"
+                      >
+                        <span class="value">{{
+                          item.goodsSpecification || "-"
+                        }}</span>
+                      </el-tooltip>
+                    </div>
+                    <div class="option-item">
+                      <span class="label">型号</span>
+                      <el-tooltip
+                        :content="item.goodsModel"
+                        placement="top"
+                        :disabled="
+                          !item.goodsModel || item.goodsModel.length <= 5
+                        "
+                        effect="light"
+                      >
+                        <span class="value">{{ item.goodsModel || "-" }}</span>
+                      </el-tooltip>
+                    </div>
+                    <div class="option-item">
+                      <span class="label">单位</span>
+                      <span class="value">{{ item.goodsUnit || "-" }}</span>
                     </div>
                     <div class="option-item">
                       <span class="label">库存</span>
-                      <span class="value">{{item.stock || 0}}</span>
+                      <span class="value">{{ item.stock || 0 }}</span>
                     </div>
                   </div>
                 </template>
@@ -159,14 +209,38 @@
       </el-row>
 
       <el-form-item label-width="120px">
-        <el-table :data="form.products" border style="width: calc(100% - 20px); ">
-          <el-table-column type="index" label="序号" width="50" align="center" />
-          <el-table-column prop="goodsCode" label="货品编号" align="center" />
-          <el-table-column prop="goodsName" label="货品名称" align="center" />
-          <el-table-column prop="goodsSpecification" label="货品规格" align="center" width="50"/>
-          <el-table-column prop="goodsImagePath" label="货品图片" align="center">
+        <el-table :data="form.products" border style="width: calc(100% - 20px)">
+          <el-table-column
+            type="index"
+            label="序号"
+            width="50"
+            align="center"
+          />
+          <el-table-column
+            prop="goodsCode"
+            label="货品编号"
+            align="center"
+            width="100"
+          />
+          <el-table-column
+            prop="goodsName"
+            label="货品名称"
+            align="center"
+            width="150"
+          />
+          <el-table-column
+            prop="goodsSpecification"
+            label="货品规格"
+            align="center"
+            width="100"
+          />
+          <el-table-column
+            prop="goodsImagePath"
+            label="货品图片"
+            align="center"
+          >
             <template slot-scope="scope">
-              <el-image 
+              <el-image
                 v-if="scope.row.goodsImagePath"
                 :src="baseApi + scope.row.goodsImagePath"
                 style="width: 50px; height: 50px"
@@ -177,16 +251,46 @@
                   <i class="el-icon-picture-outline"></i>
                 </div>
               </el-image>
-              <div v-else class="image-slot" style="width: 50px; height: 50px; display: inline-flex; justify-content: center; align-items: center; background: #f5f7fa; border-radius: 4px;">
-                <i class="el-icon-picture-outline" style="font-size: 20px; color: #909399;"></i>
+              <div
+                v-else
+                class="image-slot"
+                style="
+                  width: 50px;
+                  height: 50px;
+                  display: inline-flex;
+                  justify-content: center;
+                  align-items: center;
+                  background: #f5f7fa;
+                  border-radius: 4px;
+                "
+              >
+                <i
+                  class="el-icon-picture-outline"
+                  style="font-size: 20px; color: #909399"
+                ></i>
               </div>
             </template>
           </el-table-column>
-          <el-table-column prop="goodsUnit" label="计量单位" align="center" width="50"/>
-          <el-table-column prop="stock" label="现有库存" align="center" width="60"/>
-          <el-table-column prop="orderQuantity" label="订单数量" align="center" width="110">
+          <el-table-column
+            prop="goodsUnit"
+            label="计量单位"
+            align="center"
+            width="50"
+          />
+          <el-table-column
+            prop="stock"
+            label="现有库存"
+            align="center"
+            width="60"
+          />
+          <el-table-column
+            prop="orderQuantity"
+            label="订单数量"
+            align="center"
+            width="110"
+          >
             <template slot-scope="scope">
-              <el-input 
+              <el-input
                 v-model="scope.row.orderQuantity"
                 size="mini"
                 style="width: 70px"
@@ -194,27 +298,47 @@
               />
             </template>
           </el-table-column>
-          <el-table-column prop="shippedQuantity" label="已发货数量" align="center" width="70"/>
-          <el-table-column prop="unshippedQuantity" label="未发货数量" align="center" width="70"/>
-          <el-table-column prop="remark" label="备注" align="center" width="100">
+          <el-table-column
+            prop="shippedQuantity"
+            label="服务数量"
+            align="center"
+            width="70"
+          />
+          <el-table-column
+            prop="unshippedQuantity"
+            label="未服务数量"
+            align="center"
+            width="70"
+          />
+          <el-table-column
+            prop="remark"
+            label="备注"
+            align="center"
+            width="100"
+          >
             <template slot-scope="scope">
-              <el-input 
-                v-model="scope.row.remark" 
+              <el-input
+                v-model="scope.row.remark"
                 size="mini"
                 placeholder="备注"
               />
             </template>
           </el-table-column>
-          <el-table-column label="操作" align="center" width="100" fixed="right">
+          <el-table-column
+            label="操作"
+            align="center"
+            width="100"
+            fixed="right"
+          >
             <template slot-scope="scope">
               <el-button
                 size="mini"
                 type="danger"
                 plain
                 @click="handleRemoveProduct(scope.$index)"
-                style="padding: 4px 8px; border-radius: 4px;"
+                style="padding: 4px 8px; border-radius: 4px"
               >
-                <i class="el-icon-delete" style="margin-right: 2px;" />
+                <i class="el-icon-delete" style="margin-right: 2px" />
                 删除
               </el-button>
             </template>
@@ -230,78 +354,79 @@
 </template>
 
 <script>
-import { GetDataByName, GetDataByNames, ExecDataByConfig } from '@/api/common'
+import { GetDataByName, GetDataByNames, ExecDataByConfig } from "@/api/common";
 
 export default {
-  name: 'EditDialog',
+  name: "EditDialog",
   props: {
     visible: {
       type: Boolean,
-      default: false
+      default: false,
     },
     installerOptions: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     projectOptions: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     currentUser: {
       type: Object,
       default: () => ({
-        id: '',
-        name: ''
-      })
+        id: "",
+        name: "",
+      }),
     },
     rowData: {
       type: Object,
-      default: () => ({})
-    }
+      default: () => ({}),
+    },
   },
   computed: {
     baseApi() {
-      return process.env.VUE_APP_BASE_API
-    }
+      return process.env.VUE_APP_BASE_API;
+    },
   },
   watch: {
     visible(val) {
       if (val) {
         // 弹窗打开时初始化数据
         this.$nextTick(async () => {
-          await this.getOrderData()
-          this.getInitialData()
-        })
+          await this.getOrderData();
+          this.getInitialData();
+        });
       }
-    }
+    },
   },
   data() {
     return {
       form: {
-        products: []  // 只保留 products 数组，因为表格初始化需要它
+        products: [], // 只保留 products 数组，因为表格初始化需要它
+        serviceStaffIds: [], // 改为数组类型
       },
       customerOptions: [], // 客户选项
       loading: false, // 客户加载状态
-      selectedProduct: '', // 当前选中的货品
+      selectedProduct: "", // 当前选中的货品
       productOptions: [], // 货品选项
       productLoading: false, // 货品加载状态
-      
+
       // 表单校验规则
       rules: {
-        orderer: [
-          { required: true, message: '请选择下单人', trigger: 'change' }
+        createId: [
+          { required: true, message: "请选择下单人", trigger: "change" },
         ],
         serviceProject: [
-          { required: true, message: '请选择服务项目', trigger: 'change' }
+          { required: true, message: "请选择服务项目", trigger: "change" },
         ],
         serviceStaffIds: [
-          { required: true, message: '请选择服务人员', trigger: 'change' }
+          { required: true, message: "请选择服务人员", trigger: "change" },
         ],
         estimatedCompleteTime: [
-          { required: true, message: '请选择预计完成时间', trigger: 'change' }
-        ]
-      }
-    }
+          { required: true, message: "请选择预计完成时间", trigger: "change" },
+        ],
+      },
+    };
   },
   methods: {
     // 获取订单数据
@@ -312,120 +437,139 @@ export default {
             name: "getInstallationOrderById",
             returntype: "Map",
             parammaps: {
-              id: this.rowData.id
-            }
+              id: this.rowData.id,
+            },
           },
           {
             name: "getInstallationOrderDetail",
             returntype: "Map",
             parammaps: {
-              orderId: this.rowData.id
-            }
-          }
-        ]
+              orderId: this.rowData.id,
+            },
+          },
+        ];
 
-        const response = await GetDataByNames(params)
-        if (response.msg === 'ok') {
+        const response = await GetDataByNames(params);
+        if (response.msg === "ok") {
           // 获取主表数据
-          const mainData = response.data.getInstallationOrderById.list[0] || {}
+          const mainData = response.data.getInstallationOrderById.list[0] || {};
           // 获取明细表数据
-          const detailData = response.data.getInstallationOrderDetail.list || []
+          const detailData =
+            response.data.getInstallationOrderDetail.list || [];
 
           // 初始化表单数据
           this.form = {
-            orderNo: mainData.orderNo || '',
-            orderTime: mainData.orderTime ? new Date(mainData.orderTime) : '',
-            orderer: parseInt(mainData.dispatcherId),
+            orderNo: mainData.orderNo || "",
+            orderTime: mainData.orderTime ? new Date(mainData.orderTime) : "",
             serviceProject: parseInt(mainData.projectId),
-            serviceStaffIds: parseInt(mainData.serviceStaffIds),
-            estimatedCompleteTime: mainData.estimatedCompleteTime ? new Date(mainData.estimatedCompleteTime) : '',
-            deliveryNo: mainData.deliveryNo || '',
-            contractNo: mainData.contractNo || '',
-            customerName: mainData.customerName || '',
-            remark: mainData.remark || '',
-            products: detailData.map(item => ({
+            orderer: parseInt(mainData.dispatcherId)
+              ? parseInt(mainData.dispatcherId)
+              : null,
+            createId: parseInt(mainData.createId)
+              ? parseInt(mainData.createId)
+              : null,
+            createName: mainData.createName || "",
+            serviceStaffIds: mainData.serviceStaffIds
+              ? mainData.serviceStaffIds.split(",").map((id) => parseInt(id))
+              : [],
+            estimatedCompleteTime: mainData.estimatedCompleteTime
+              ? new Date(mainData.estimatedCompleteTime)
+              : "",
+            deliveryNo: mainData.deliveryNo || "",
+            contractNo: mainData.contractNo || "",
+            customerName: mainData.customerName || "",
+            remark: mainData.remark || "",
+            products: detailData.map((item) => ({
               goodsId: item.goodsId,
-              goodsCode: item.goodsCode || '',
-              goodsName: item.goodsName || '',
-              goodsSpecification: item.goodsSpecification || '',
-              goodsImagePath: item.goodsImagePath || '',
-              goodsUnit: item.goodsUnit || '',
+              goodsCode: item.goodsCode || "",
+              goodsName: item.goodsName || "",
+              goodsSpecification: item.goodsSpecification || "",
+              goodsImagePath: item.goodsImagePath || "",
+              goodsUnit: item.goodsUnit || "",
               stock: item.stock || 0,
               orderQuantity: item.orderQuantity || 0,
               shippedQuantity: item.shippedQuantity || 0,
               unshippedQuantity: item.unshippedQuantity || 0,
-              remark: item.remark || ''
-            }))
-          }
-          console.log('form:', this.form)
+              remark: item.remark || "",
+            })),
+          };
+          console.log("form:", this.form);
+          console.log("projectOptions:", this.projectOptions);
+          console.log("mainData.projectId:", mainData.projectId);
+          console.log("parsed serviceProject:", parseInt(mainData.projectId));
         } else {
-          this.$message.error('获取数据失败')
+          this.$message.error("获取数据失败");
         }
       } catch (error) {
-        console.error('获取数据失败:', error)
-        this.$message.error('获取数据失败')
+        console.error("获取数据失败:", error);
+        this.$message.error("获取数据失败");
       }
     },
 
     // 获取客户信息
-    handleCustomerInput(value) {
-      
-    },
+    handleCustomerInput(value) {},
 
     // 关闭弹窗
     handleDialogClose() {
-      this.$emit('update:visible', false)
-      this.$refs.form && this.$refs.form.resetFields()
-      this.form.products = []
+      this.$emit("update:visible", false);
+      this.$refs.form && this.$refs.form.resetFields();
+      this.form.products = [];
     },
 
     // 取消
     handleCancel() {
-      this.handleDialogClose()
+      this.handleDialogClose();
     },
 
     getInitialData() {
       // 获取客户信息
-      this.handleCustomerInput('')
+      this.handleCustomerInput("");
     },
 
     // 移除货品
     handleRemoveProduct(index) {
-      this.form.products.splice(index, 1)
+      this.form.products.splice(index, 1);
     },
 
     // 处理货品输入搜索
     handleProductInput(value) {
-      this.productLoading = true
+      this.productLoading = true;
       const send_select_list = {
-        name: 'getGoodsListByCode',
-        returntype: 'Map',
+        name: "getGoodsListByCode",
+        returntype: "Map",
         parammaps: {
-          goodsCode: value || ''
-        }
-      }
+          goodsCode: value || "",
+        },
+      };
 
-      GetDataByName(send_select_list).then(response => {
-        this.productOptions = response.data.list || []
-      }).catch(error => {
-        console.error('搜索货品失败:', error)
-        this.$message.error('搜索货品失败')
-      }).finally(() => {
-        this.productLoading = false
-      })
+      GetDataByName(send_select_list)
+        .then((response) => {
+          this.productOptions = response.data.list || [];
+        })
+        .catch((error) => {
+          console.error("搜索货品失败:", error);
+          this.$message.error("搜索货品失败");
+        })
+        .finally(() => {
+          this.productLoading = false;
+        });
     },
 
     // 处理货品选择变化
     handleProductChange(value) {
-      console.log('value:', this.form.products, value)
-      const selectedProduct = this.productOptions.find(item => item.goodsId === value)
+      console.log("value:", this.form.products, value);
+      const selectedProduct = this.productOptions.find(
+        (item) => item.goodsId === value
+      );
       if (selectedProduct) {
         // 检查是否已经添加过该货品
-        const existingProduct = this.form.products.find(item => item.goodsId === selectedProduct.goodsId)
+        const existingProduct = this.form.products.find(
+          (item) => item.goodsId === selectedProduct.goodsId
+        );
         if (existingProduct) {
-          this.$message.warning('该货品已经添加过了')
-          this.selectedProduct = ''
-          return
+          this.$message.warning("该货品已经添加过了");
+          this.selectedProduct = "";
+          return;
         }
 
         // 添加新货品到表格
@@ -434,45 +578,45 @@ export default {
           goodsCode: selectedProduct.goodsCode,
           goodsName: selectedProduct.goodsName,
           goodsSpecification: selectedProduct.goodsSpecification,
-          goodsImagePath: selectedProduct.goodsImagePath || '',
+          goodsImagePath: selectedProduct.goodsImagePath || "",
           goodsUnit: selectedProduct.goodsUnit,
           stock: selectedProduct.stock || 0,
           orderQuantity: 1,
           shippedQuantity: 0,
           unshippedQuantity: 0,
-          remark: ''
-        })
+          remark: "",
+        });
       }
-      this.selectedProduct = '' // 清空选择
+      this.selectedProduct = ""; // 清空选择
     },
 
     // 处理订单数量输入
     handleOrderQuantityInput(value, row) {
       // 只允许输入正整数
-      value = value.replace(/[^\d]/g, '')
-      if (value === '') {
-        row.orderQuantity = 1
+      value = value.replace(/[^\d]/g, "");
+      if (value === "") {
+        row.orderQuantity = 1;
       } else {
-        const num = parseInt(value)
-        row.orderQuantity = num || 1
+        const num = parseInt(value);
+        row.orderQuantity = num || 1;
       }
     },
 
     // 提交表单
-    handleSubmit() {
-      this.$refs.form.validate(async (valid) => {
+    async handleSubmit() {
+      this.$refs.form.validate(async (valid, errorFields) => {
         if (valid) {
           try {
             // 检查是否添加了货品
             if (this.form.products.length === 0) {
-              this.$message.warning('请至少添加一个货品')
-              return
+              this.$message.warning("请至少添加一个货品");
+              return;
             }
 
             // 构建保存参数
             const params = {
               common: {
-                returnmap: "0"
+                returnmap: "0",
               },
               data: [
                 {
@@ -481,35 +625,57 @@ export default {
                   parammaps: {
                     id: this.rowData.id,
                     projectId: this.form.serviceProject,
-                    projectName: this.projectOptions.find(item => item.value === this.form.serviceProject)?.label || '',
-                    totalQuantity: this.form.products.reduce((sum, item) => sum + parseInt(item.orderQuantity || 0), 0),
-                    uninstalledQuantity: this.form.products.reduce((sum, item) => sum + parseInt(item.orderQuantity || 0), 0),
-                    dispatcherId: this.form.orderer,
-                    dispatcherName: this.installerOptions.find(item => item.value === this.form.orderer)?.label || '',
-                    serviceStaffNames: this.installerOptions.find(item => item.value === this.form.serviceStaffIds)?.label || '',
-                    serviceStaffIds: this.form.serviceStaffIds,
-                    estimatedCompleteTime: this.form.estimatedCompleteTime ? this.form.estimatedCompleteTime.toISOString().slice(0, 19).replace('T', ' ') : null,
-                    remark: this.form.remark || ''
-                  }
+                    projectName:
+                      this.projectOptions.find(
+                        (item) => item.id === this.form.serviceProject
+                      )?.name || "",
+                    totalQuantity: this.form.products.reduce(
+                      (sum, item) => sum + parseInt(item.orderQuantity || 0),
+                      0
+                    ),
+                    uninstalledQuantity: this.form.products.reduce(
+                      (sum, item) => sum + parseInt(item.orderQuantity || 0),
+                      0
+                    ),
+                    createId: this.form.createId,
+                    createName:
+                      this.installerOptions.find(
+                        (item) => item.value === this.form.createId
+                      )?.label || "",
+                    serviceStaffNames: this.installerOptions
+                      .filter((item) =>
+                        this.form.serviceStaffIds.includes(item.value)
+                      )
+                      .map((item) => item.label)
+                      .join(","),
+                    serviceStaffIds: this.form.serviceStaffIds.join(","),
+                    estimatedCompleteTime: this.form.estimatedCompleteTime
+                      ? this.form.estimatedCompleteTime
+                          .toISOString()
+                          .slice(0, 19)
+                          .replace("T", " ")
+                      : null,
+                    remark: this.form.remark || "",
+                  },
                 },
                 {
                   name: "deleteInstallationOrderDetailByOrderId",
                   type: "e",
                   parammaps: {
                     orderId: this.rowData.id,
-                  }
+                  },
                 },
                 {
                   name: "insertInstallationOrderDetail",
                   resultmaps: {
-                    list: this.form.products.map(item => ({
-                        goodsId: item.goodsId,
-                        goodsName: item.goodsName,
-                        orderQuantity: parseInt(item.orderQuantity || 0),
-                        shippedQuantity: 0,
-                        unshippedQuantity: parseInt(item.orderQuantity || 0),
-                        remark: item.remark || ''
-                    }))
+                    list: this.form.products.map((item) => ({
+                      goodsId: item.goodsId,
+                      goodsName: item.goodsName,
+                      orderQuantity: parseInt(item.orderQuantity || 0),
+                      shippedQuantity: 0,
+                      unshippedQuantity: parseInt(item.orderQuantity || 0),
+                      remark: item.remark || "",
+                    })),
                   },
                   children: [
                     {
@@ -518,47 +684,61 @@ export default {
                       parammaps: {
                         goodsId: "@insertInstallationOrderDetail.goodsId",
                         goodsName: "@insertInstallationOrderDetail.goodsName",
-                        orderQuantity: "@insertInstallationOrderDetail.orderQuantity",
+                        orderQuantity:
+                          "@insertInstallationOrderDetail.orderQuantity",
                         remark: "@insertInstallationOrderDetail.remark",
-                        shippedQuantity: "@insertInstallationOrderDetail.shippedQuantity",
-                        unshippedQuantity: "@insertInstallationOrderDetail.unshippedQuantity",
+                        shippedQuantity:
+                          "@insertInstallationOrderDetail.shippedQuantity",
+                        unshippedQuantity:
+                          "@insertInstallationOrderDetail.unshippedQuantity",
                         orderId: this.rowData.id,
-                      }
-                    }
-                  ]
-                }
-              ]
-            }
+                      },
+                    },
+                  ],
+                },
+              ],
+            };
 
             // 调用保存接口
-            const response = await ExecDataByConfig(params)
-            if (response.msg === 'ok') {
-              this.$message.success('保存成功')
-              this.handleDialogClose()
-              this.$emit('success')
+            const response = await ExecDataByConfig(params);
+            if (response.msg === "ok") {
+              this.$message.success("保存成功");
+              this.handleDialogClose();
+              this.$emit("success");
             } else {
-              this.$message.error(response.data || '保存失败')
+              this.$message.error(response.data || "保存失败");
             }
           } catch (error) {
-            console.error('保存失败:', error)
-            this.$message.error('保存失败')
+            console.error("保存失败:", error);
+            this.$message.error("保存失败");
           }
+        } else {
+          // 收集并显示验证错误信息
+          const errorMessages = [];
+          for (const field in errorFields) {
+            const errors = errorFields[field];
+            errors.forEach((error) => {
+              errorMessages.push(error.message);
+            });
+          }
+          this.$message.error(`表单验证失败：${errorMessages.join("、")}`);
+          return false;
         }
-      })
-    }
-  }
-}
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
 :deep(.el-dialog) {
   border-radius: 8px;
-  
+
   .el-dialog__header {
     padding: 20px;
     border-bottom: 1px solid #ebeef5;
     margin-right: 0;
-    
+
     .el-dialog__title {
       font-size: 16px;
       font-weight: 500;
@@ -568,31 +748,31 @@ export default {
 
   .el-dialog__body {
     padding: 20px;
-    
+
     .el-form {
       .el-form-item {
         margin-bottom: 18px;
-        
+
         .el-form-item__label {
           font-weight: normal;
           color: #606266;
         }
       }
-      
+
       .el-textarea {
         width: 100%;
       }
-      
+
       .el-table {
         margin-top: 8px;
-        
+
         th {
           background-color: #f5f7fa;
           color: #333;
           font-weight: 500;
           padding: 8px 0;
         }
-        
+
         td {
           padding: 8px 0;
         }
@@ -604,12 +784,12 @@ export default {
     padding: 15px 20px;
     border-top: 1px solid #ebeef5;
     text-align: right;
-    
+
     .el-button {
       padding: 9px 20px;
       font-size: 13px;
       border-radius: 4px;
-      
+
       & + .el-button {
         margin-left: 10px;
       }
@@ -644,30 +824,12 @@ export default {
     padding: 0 4px;
     box-sizing: border-box;
 
-    &:first-child {
-      width: 180px;
+    &:not(:last-child) {
       padding-right: 16px;
       margin-right: 4px;
-      
-      &::after {
-        content: '';
-        position: absolute;
-        right: 0;
-        top: 50%;
-        height: 14px;
-        width: 1px;
-        background-color: #dcdfe6;
-        transform: translateY(-50%);
-      }
-    }
 
-    &:nth-child(2) {
-      width: 160px;
-      padding-right: 16px;
-      margin-right: 4px;
-      
       &::after {
-        content: '';
+        content: "";
         position: absolute;
         right: 0;
         top: 50%;
@@ -678,34 +840,31 @@ export default {
       }
     }
 
+    &:nth-child(1) {
+      width: 120px;
+    } // 编号
+    &:nth-child(2) {
+      width: 250px;
+    } // 名称
     &:nth-child(3) {
-      width: 140px;
-      padding-right: 16px;
-      margin-right: 4px;
-      
-      &::after {
-        content: '';
-        position: absolute;
-        right: 0;
-        top: 50%;
-        height: 14px;
-        width: 1px;
-        background-color: #dcdfe6;
-        transform: translateY(-50%);
-      }
-    }
-
-    &:last-child {
-      flex: 1;
-      min-width: 80px;
-    }
+      width: 120px;
+    } // 规格
+    &:nth-child(4) {
+      width: 120px;
+    } // 型号
+    &:nth-child(5) {
+      width: 80px;
+    } // 单位
+    &:nth-child(6) {
+      width: 80px;
+    } // 库存
 
     .label {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       font-weight: 500;
-      color: #409EFF;
+      color: #409eff;
       background: rgba(64, 158, 255, 0.08);
       padding: 1px 6px;
       border-radius: 3px;
@@ -732,53 +891,17 @@ export default {
   }
 }
 
-:deep(.el-select-dropdown__item) {
-  padding: 0 !important;
-  height: auto !important;
-  margin: 1px;
-  line-height: normal;
-
-  &.hover, &:hover {
-    background-color: transparent;
-    
-    .product-option {
-      background-color: #f9fafc;
-      border-color: #e4e7ed;
-      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
-    }
+:deep(.el-tooltip__popper) {
+  max-width: 300px;
+  line-height: 1.4;
+  padding: 8px 12px;
+  font-size: 12px;
+  word-break: break-all;
+  white-space: pre-wrap;
+
+  &.is-light {
+    border: 1px solid #e4e7ed;
+    color: #606266;
   }
-
-  &.selected {
-    .product-option {
-      background-color: #f0f7ff;
-      border-color: rgba(64, 158, 255, 0.2);
-      
-      .label {
-        background: rgba(64, 158, 255, 0.12);
-        border-color: rgba(64, 158, 255, 0.3);
-      }
-      
-      .value {
-        color: #409EFF;
-      }
-
-      &::after {
-        content: '';
-        position: absolute;
-        right: 8px;
-        top: 50%;
-        transform: translateY(-50%);
-        width: 4px;
-        height: 4px;
-        border-radius: 50%;
-        background-color: #409EFF;
-      }
-    }
-  }
-}
-
-:deep(.el-select-dropdown__wrap) {
-  padding: 1px;
-  max-height: 280px;
 }
-</style>
+</style>

src/views/productManagement/installationOrder/components/RejectDialog.vue

@@ -0,0 +1,151 @@
+<!-- 驳回弹窗 -->
+<template>
+  <el-dialog
+    title="驳回"
+    :visible.sync="visible"
+    width="500px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    @close="handleDialogClose"
+    custom-class="reject-dialog"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item label="驳回原因" prop="rejectReason">
+        <el-input
+          v-model="form.rejectReason"
+          type="textarea"
+          :rows="4"
+          placeholder="请输入驳回原因"
+          resize="none"
+        />
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button
+        type="primary"
+        @click="handleSubmit"
+        :loading="submitting"
+        class="submit-btn"
+        >确 定</el-button
+      >
+      <el-button @click="handleCancel" class="cancel-btn">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "RejectDialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    rowData: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      submitting: false,
+      form: {
+        rejectReason: "",
+      },
+      rules: {
+        rejectReason: [
+          { required: true, message: "请输入驳回原因", trigger: "blur" },
+        ],
+      },
+    };
+  },
+  methods: {
+    // 提交表单
+    handleSubmit() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          this.submitting = true;
+          try {
+            await this.$emit("confirm", this.form);
+          } finally {
+            this.submitting = false;
+          }
+        }
+      });
+    },
+    // 取消
+    handleCancel() {
+      this.$emit("update:visible", false);
+    },
+    // 关闭弹窗
+    handleDialogClose() {
+      this.$refs.form.resetFields();
+      this.handleCancel();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.reject-dialog {
+  :deep(.el-dialog__body) {
+    padding: 20px 20px 10px 20px;
+  }
+
+  :deep(.el-textarea__inner) {
+    padding: 10px;
+    font-size: 14px;
+    border-radius: 4px;
+    border-color: #dcdfe6;
+
+    &:focus {
+      border-color: #409eff;
+    }
+
+    &:hover {
+      border-color: #c0c4cc;
+    }
+  }
+
+  .dialog-footer {
+    text-align: right;
+    padding-top: 10px;
+
+    .submit-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      margin-left: 10px;
+      transition: all 0.3s;
+
+      &:hover {
+        opacity: 0.8;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+
+    .cancel-btn {
+      padding: 9px 20px;
+      font-size: 14px;
+      border-radius: 4px;
+      transition: all 0.3s;
+      border: 1px solid #dcdfe6;
+
+      &:hover {
+        color: #409eff;
+        border-color: #c6e2ff;
+        background-color: #ecf5ff;
+        transform: translateY(-1px);
+      }
+
+      &:active {
+        transform: translateY(0);
+      }
+    }
+  }
+}
+</style>

src/views/productManagement/installationOrder/components/ViewDialog.vue

@@ -17,7 +17,7 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="下单人">
-            <el-input v-model="ordererName" readonly />
+            <el-input v-model="form.createName" readonly />
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -35,7 +35,7 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="服务人员">
-            <el-input v-model="serviceStaffName" readonly />
+            <el-input v-model="form.serviceStaffNames" readonly />
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -150,17 +150,19 @@
                 prop="goodsCode"
                 label="货品编号"
                 align="center"
+                width="100"
               />
               <el-table-column
                 prop="goodsName"
                 label="货品名称"
                 align="center"
+                width="150"
               />
               <el-table-column
                 prop="goodsSpecification"
                 label="货品规格"
                 align="center"
-                width="50"
+                width="100"
               />
               <el-table-column
                 prop="goodsImagePath"
@@ -375,13 +377,6 @@ export default {
         )?.label || ""
       );
     },
-    serviceStaffName() {
-      return (
-        this.installerOptions.find(
-          (item) => item.value === parseInt(this.form.serviceStaffIds)
-        )?.label || ""
-      );
-    },
     remainingTimeText() {
       if (
         this.form.remainingTime === null ||
@@ -414,7 +409,7 @@ export default {
         orderTime: "",
         orderer: "",
         serviceProject: "",
-        serviceStaffIds: "",
+        serviceStaffNames: "",
         estimatedCompleteTime: "",
         deliveryNo: "",
         contractNo: "",
@@ -434,6 +429,7 @@ export default {
         rejectReason: "xxxxxxx",
         startTime: "",
         acceptanceTime: "",
+        createName: "",
       },
     };
   },
@@ -473,7 +469,7 @@ export default {
             orderTime: mainData.orderTime || "",
             orderer: mainData.dispatcherId,
             serviceProject: mainData.projectId,
-            serviceStaffIds: mainData.serviceStaffIds,
+            serviceStaffNames: mainData.serviceStaffNames || "",
             estimatedCompleteTime: mainData.estimatedCompleteTime || "",
             deliveryNo: mainData.deliveryNo || "",
             contractNo: mainData.contractNo || "",
@@ -502,9 +498,10 @@ export default {
             acceptanceImagePath: mainData.acceptanceImagePath || "",
             currentStep: mainData.currentStep || 2,
             isRejected: mainData.isRejected || true,
-            rejectReason: mainData.rejectReason || "xxxxxxx",
+            rejectReason: mainData.rejectReason || "",
             startTime: mainData.startTime || "",
             acceptanceTime: mainData.acceptanceTime || "",
+            createName: mainData.createName || "",
           };
         } else {
           this.$message.error("获取数据失败");

src/views/productManagement/installationOrder/index.vue

@@ -60,9 +60,9 @@
         >
           <el-option
             v-for="dict in projectOptions"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
+            :key="dict.id"
+            :label="dict.name"
+            :value="dict.id"
           />
         </el-select>
       </el-form-item>
@@ -143,6 +143,7 @@
       :header-cell-style="{ background: '#f5f7fa' }"
       @row-dblclick="handleView"
       height="calc(100vh - 250px)"
+      :row-class-name="tableRowClassName"
     >
       <el-table-column label="序号" width="50" align="center">
         <template slot-scope="scope">
@@ -164,6 +165,18 @@
         </template>
       </el-table-column>
       <el-table-column prop="projectName" label="项目名称" align="center" />
+      <el-table-column
+        prop="statusName"
+        label="处理状态"
+        align="center"
+        width="100"
+      >
+        <template slot-scope="scope">
+          <el-tag :type="getStatusType(scope.row.statusName)">{{
+            scope.row.statusName
+          }}</el-tag>
+        </template>
+      </el-table-column>
       <el-table-column
         prop="customerName"
         label="客户名称"
@@ -188,24 +201,6 @@
           </div>
         </template>
       </el-table-column>
-      <el-table-column
-        prop="totalQuantity"
-        label="服务总数量"
-        align="center"
-        width="100"
-      />
-      <el-table-column
-        prop="installedQuantity"
-        label="已服务数量"
-        align="center"
-        width="100"
-      />
-      <el-table-column
-        prop="uninstalledQuantity"
-        label="未服务数量"
-        align="center"
-        width="100"
-      />
       <el-table-column
         prop="progress"
         label="服务进度"
@@ -241,6 +236,25 @@
           </div>
         </template>
       </el-table-column>
+      <el-table-column
+        prop="totalQuantity"
+        label="服务总数量"
+        align="center"
+        width="100"
+      />
+      <el-table-column
+        prop="installedQuantity"
+        label="已服务数量"
+        align="center"
+        width="100"
+      />
+      <el-table-column
+        prop="uninstalledQuantity"
+        label="未服务数量"
+        align="center"
+        width="100"
+      />
+
       <el-table-column
         prop="dispatcherName"
         label="派单人"
@@ -270,6 +284,12 @@
           </div>
         </template>
       </el-table-column>
+      <el-table-column
+        prop="createName"
+        label="下单人"
+        align="center"
+        width="100"
+      />
       <el-table-column
         prop="orderTime"
         label="下单时间"
@@ -323,18 +343,7 @@
         align="center"
         width="140"
       />
-      <el-table-column
-        prop="statusName"
-        label="处理状态"
-        align="center"
-        width="100"
-      >
-        <template slot-scope="scope">
-          <el-tag :type="getStatusType(scope.row.statusName)">{{
-            scope.row.statusName
-          }}</el-tag>
-        </template>
-      </el-table-column>
+
       <el-table-column
         prop="remark"
         label="备注"
@@ -426,12 +435,58 @@
       :project-options="projectOptions"
       :row-data="currentRow"
     />
+
+    <!-- 派单弹窗 -->
+    <dispatch-dialog
+      :visible.sync="dispatchDialogVisible"
+      :installer-options="installerOptions"
+      :current-user="currentUser"
+      :row-data="currentRow"
+      @success="getList"
+    />
+
+    <!-- 驳回弹窗 -->
+    <reject-dialog
+      :visible.sync="rejectDialogVisible"
+      :row-data="currentRow"
+      @confirm="handleRejectConfirm"
+    />
+
+    <!-- 填写弹窗 -->
+    <daily-write-dialog
+      :visible.sync="dailyWriteDialogVisible"
+      :row-data="currentRow"
+      @confirm="handleDailyWriteConfirm"
+    />
+
+    <!-- 接单弹窗 -->
+    <accept-dialog
+      :visible.sync="acceptDialogVisible"
+      :row-data="currentRow"
+      :current-user="currentUser"
+      @confirm="handleAcceptConfirm"
+    />
+
+    <!-- 验收弹窗 -->
+    <check-dialog
+      :visible.sync="checkDialogVisible"
+      :row-data="currentRow"
+      :installer-options="installerOptions"
+      @confirm="handleCheckConfirm"
+      :customer-contact-options="customerContactOptions"
+      :current-user="currentUser"
+    />
   </div>
 </template>
 
 <script>
 import Pagination from "@/components/Pagination";
-import { GetDataByName, GetDataByNames } from "@/api/common";
+import {
+  GetDataByName,
+  GetDataByNames,
+  PostDataByName,
+  ExecDataByConfig,
+} from "@/api/common";
 import AddDialog from "./components/AddDialog";
 import exportMixin from "@/mixins/exportMixin";
 import paramsMixin from "./mixins/paramsMixin";
@@ -439,6 +494,11 @@ import { exportInstallationOrder } from "@/api/productManagement/installation";
 import Cookies from "js-cookie";
 import EditDialog from "./components/EditDialog.vue";
 import ViewDialog from "./components/ViewDialog.vue";
+import DispatchDialog from "./components/DispatchDialog.vue";
+import RejectDialog from "./components/RejectDialog.vue";
+import DailyWriteDialog from "./components/DailyWriteDialog.vue";
+import AcceptDialog from "./components/AcceptDialog.vue";
+import CheckDialog from "./components/CheckDialog.vue";
 
 export default {
   name: "InstallationOrder",
@@ -447,6 +507,11 @@ export default {
     AddDialog,
     EditDialog,
     ViewDialog,
+    DispatchDialog,
+    RejectDialog,
+    DailyWriteDialog,
+    AcceptDialog,
+    CheckDialog,
   },
   mixins: [exportMixin, paramsMixin],
   data() {
@@ -461,6 +526,8 @@ export default {
       tableData: [],
       // 服务人员选项
       installerOptions: [],
+      // 客户联系人选项
+      customerContactOptions: [],
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -478,6 +545,7 @@ export default {
       statusOptions: [
         { label: "待处理", value: "待处理" },
         { label: "处理中", value: "处理中" },
+        { label: "已完成未验收", value: "已完成未验收" },
         { label: "已完成", value: "已完成" },
         { label: "已驳回", value: "已驳回" },
       ],
@@ -527,6 +595,11 @@ export default {
       viewDialogVisible: false,
       currentRow: null,
       progressTooltip: null,
+      dispatchDialogVisible: false,
+      rejectDialogVisible: false,
+      dailyWriteDialogVisible: false,
+      acceptDialogVisible: false,
+      checkDialogVisible: false,
     };
   },
   created() {
@@ -617,11 +690,8 @@ export default {
           console.log("服务人员下拉框", this.installerOptions);
 
           // 处理项目数据
-          const projectList = response.data.getDictListSelect.list || [];
-          this.projectOptions = projectList.map((item) => ({
-            value: item.id,
-            label: item.name,
-          }));
+          this.projectOptions = response.data.getDictListSelect.list || [];
+
           console.log("项目下拉框", this.projectOptions);
 
           // 获取处理工单数量
@@ -658,9 +728,10 @@ export default {
     },
     getStatusType(statusName) {
       const statusMap = {
-        待处理: "warning",
+        待处理: "info",
         处理中: "primary",
         已完成: "success",
+        已完成未验收: "warning",
         已驳回: "danger",
       };
       return statusMap[statusName] || "info";
@@ -676,12 +747,27 @@ export default {
     },
     // 删除
     async handleDelete(row) {
+      await this.$confirm("是否确认删除服务工单?", "警告", {
+        type: "warning",
+      });
       try {
-        await this.$confirm("是否确认删除服务工单?", "警告", {
-          type: "warning",
-        });
-        const response = await deleteInstallation(row.id);
-        if (response.code === 200) {
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "deleteInstallationOrderById",
+              type: "e",
+              parammaps: {
+                orderId: row.id,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
           this.$message.success("删除成功");
           this.getList();
         } else {
@@ -689,61 +775,127 @@ export default {
         }
       } catch (error) {
         console.error("删除失败:", error);
-        if (error !== "cancel") {
-          this.$message.error("删除失败");
-        }
+        this.$message.error("删除失败");
       }
     },
     // 派单
     async handleDispatch(row) {
-      try {
-        const response = await dispatchInstallation({ id: row.id });
-        if (response.code === 200) {
-          this.$message.success("派单成功");
-          this.getList();
-        } else {
-          this.$message.error(response.msg || "派单失败");
-        }
-      } catch (error) {
-        console.error("派单失败:", error);
-        this.$message.error("派单失败");
-      }
+      this.currentRow = row;
+      this.dispatchDialogVisible = true;
     },
-    // 接单驳回
+    // 驳回
     async handleReject(row) {
-      try {
-        const response = await rejectInstallation({ id: row.id });
-        if (response.code === 200) {
-          this.$message.success("驳回成功");
-          this.getList();
-        } else {
-          this.$message.error(response.msg || "驳回失败");
-        }
-      } catch (error) {
-        console.error("驳回失败:", error);
-        this.$message.error("驳回失败");
-      }
+      this.currentRow = row;
+      this.rejectDialogVisible = true;
+    },
+    // 接单
+    async handleAccept(row) {
+      this.currentRow = row;
+      this.acceptDialogVisible = true;
     },
     // 每日填写
     async handleDailyWrite(row) {
+      this.currentRow = row;
+      this.dailyWriteDialogVisible = true;
+    },
+    // 处理填写确认
+    async handleDailyWriteConfirm(formData) {
       try {
-        const response = await dailyWrite({ id: row.id });
-        if (response.code === 200) {
-          this.$message.success("填写成功");
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "deleteInstallationDailyWriteByDates",
+              type: "e",
+              parammaps: {
+                datas: formData.dates.join(","),
+                orderId: this.currentRow.id,
+              },
+            },
+            {
+              name: "submitInstallationDailyWrite",
+              resultmaps: {
+                list: formData.records.map((item) => ({
+                  installDate: this.formatDate(item.date),
+                  goodsName: item.goodsName,
+                  goodsId: item.goodsId,
+                  todayQuantity: item.todayQuantity || 0,
+                  remark: item.remark,
+                })),
+              },
+              children: [
+                {
+                  name: "insertInstallationDailyWrite",
+                  type: "e",
+                  parammaps: {
+                    orderId: this.currentRow.id,
+                    installUserId: this.currentUser.id,
+                    installUserName: this.currentUser.name,
+                    goodsName: "@submitInstallationDailyWrite.goodsName",
+                    installDate: "@submitInstallationDailyWrite.installDate",
+                    goodsId: "@submitInstallationDailyWrite.goodsId",
+                    todayQuantity:
+                      "@submitInstallationDailyWrite.todayQuantity",
+                    remark: "@submitInstallationDailyWrite.remark",
+                  },
+                },
+              ],
+            },
+            {
+              name: "refreshInstallationOrderDetailQuantity",
+              type: "e",
+              parammaps: {
+                orderId: this.currentRow.id,
+              },
+            },
+            {
+              name: "refreshInstallationOrderProcessByOrderId",
+              type: "e",
+              parammaps: {
+                orderId: this.currentRow.id,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
+          this.$message.success("提交成功");
+          this.dailyWriteDialogVisible = false;
           this.getList();
         } else {
-          this.$message.error(response.msg || "填写失败");
+          this.$message.error(response.msg || "提交失败");
         }
       } catch (error) {
-        console.error("填写失败:", error);
-        this.$message.error("填写失败");
+        console.error("提交失败:", error);
+        this.$message.error("提交失败");
       }
     },
     // 完成
     async handleComplete(row) {
+      await this.$confirm("是否确认完成当前服务工单?", "警告", {
+        type: "warning",
+      });
       try {
-        const response = await completeInstallation({ id: row.id });
-        if (response.code === 200) {
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "completeInstallationOrder",
+              type: "e",
+              parammaps: {
+                orderId: row.id,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
           this.$message.success("操作成功");
           this.getList();
         } else {
@@ -754,27 +906,62 @@ export default {
         this.$message.error("操作失败");
       }
     },
-    // 接单
-    async handleAccept(row) {
-      try {
-        const response = await acceptInstallation({ id: row.id });
-        if (response.code === 200) {
-          this.$message.success("接单成功");
-          this.getList();
-        } else {
-          this.$message.error(response.msg || "接单失败");
-        }
-      } catch (error) {
-        console.error("接单失败:", error);
-        this.$message.error("接单失败");
-      }
-    },
     // 验收
     async handleCheck(row) {
+      this.currentRow = row;
+      this.checkDialogVisible = true;
+
+      const send_data = {
+        name: "getContacts",
+        returntype: "Map",
+        parammaps: {
+          customerId: row.customerId,
+        },
+      };
+
+      GetDataByName(send_data)
+        .then((response) => {
+          this.customerContactOptions = response.data.list || [];
+          console.log("客户联系人选项", this.customerContactOptions);
+        })
+        .catch((error) => {
+          console.error("获取客户联系人选项失败:", error);
+        });
+    },
+    // 处理验收确认
+    async handleCheckConfirm(formData) {
       try {
-        const response = await checkInstallation({ id: row.id });
-        if (response.code === 200) {
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "checkInstallationOrder",
+              type: "e",
+              parammaps: {
+                orderId: formData.orderId,
+                checkUserId: formData.serviceStaffId,
+                checkUserName:
+                  this.installerOptions.find(
+                    (item) => item.id === formData.serviceStaffId
+                  )?.label || "",
+                contactId: formData.customerContactId,
+                contactName:
+                  this.customerContactOptions.find(
+                    (item) => item.id === formData.customerContactId
+                  )?.name || "",
+                checkDate: formData.checkDate,
+                contactImageId: formData.checkImage,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
           this.$message.success("验收成功");
+          this.checkDialogVisible = false;
           this.getList();
         } else {
           this.$message.error(response.msg || "验收失败");
@@ -832,7 +1019,13 @@ export default {
     showProgressTooltip(event, percentage) {
       this.progressTooltip = document.createElement("div");
       this.progressTooltip.className = "progress-tooltip";
-      this.progressTooltip.textContent = percentage.toFixed(1) + "%";
+      this.progressTooltip.textContent = (() => {
+        const num = parseFloat(percentage);
+        if (!Number.isFinite(num)) return "0.00%";
+        if (num < 0) return "0.00%";
+        if (num > 100) return "100.00%";
+        return num.toFixed(2) + "%";
+      })();
 
       document.body.appendChild(this.progressTooltip);
 
@@ -858,6 +1051,75 @@ export default {
         }, 200);
       }
     },
+    // 处理驳回确认
+    async handleRejectConfirm(formData) {
+      try {
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "rejectInstallationOrder",
+              type: "e",
+              parammaps: {
+                orderId: this.currentRow.id,
+                rejectReason: formData.rejectReason,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
+          this.$message.success("驳回成功");
+          this.rejectDialogVisible = false;
+          this.getList();
+        } else {
+          this.$message.error(response.msg || "驳回失败");
+        }
+      } catch (error) {
+        console.error("驳回失败:", error);
+        this.$message.error("驳回失败");
+      }
+    },
+    // 处理接单确认
+    async handleAcceptConfirm(formData) {
+      try {
+        const params = {
+          common: {
+            returnmap: "0",
+          },
+          data: [
+            {
+              name: "acceptInstallationOrder",
+              type: "e",
+              parammaps: {
+                orderId: formData.orderId,
+                acceptId: this.currentUser.id,
+                acceptName: this.currentUser.name,
+              },
+            },
+          ],
+        };
+
+        const response = await ExecDataByConfig(params);
+        if (response.msg === "ok") {
+          this.$message.success("接单成功");
+          this.acceptDialogVisible = false;
+          this.getList();
+        } else {
+          this.$message.error(response.msg || "接单失败");
+        }
+      } catch (error) {
+        console.error("接单失败:", error);
+        this.$message.error("接单失败");
+      }
+    },
+    // 设置行的class
+    tableRowClassName({ row }) {
+      return row.statusName === "已驳回" ? "rejected-row" : "";
+    },
   },
 };
 </script>
@@ -921,10 +1183,26 @@ export default {
       }
     }
 
-    // 斑马纹样式
-    :deep(.el-table__row--striped) {
-      td {
-        background-color: #fafafa;
+    // 重写表格行样式
+    ::v-deep(.el-table__body) {
+      tr.rejected-row {
+        background-color: rgba(245, 108, 108, 0.1) !important;
+      }
+
+      tr.rejected-row td {
+        background-color: rgba(245, 108, 108, 0.1) !important;
+      }
+
+      tr.rejected-row:hover td {
+        background-color: rgba(245, 108, 108, 0.15) !important;
+      }
+
+      tr.rejected-row.el-table__row--striped td {
+        background-color: rgba(245, 108, 108, 0.1) !important;
+      }
+
+      tr.rejected-row.current-row td {
+        background-color: rgba(245, 108, 108, 0.1) !important;
       }
     }
 
@@ -1080,6 +1358,41 @@ export default {
       padding: 0 8px;
       height: 24px;
       line-height: 22px;
+
+      // 已完成未验收状态特殊样式
+      &.el-tag--warning {
+        &:not(.is-hit) {
+          background-color: #fdf6ec;
+          border-color: #faecd8;
+          color: #e6a23c;
+
+          &[type="warning"] {
+            background-color: #fdf6ec;
+            border-color: #faecd8;
+            color: #e6a23c;
+          }
+        }
+      }
+
+      // 已驳回状态样式
+      &.el-tag--danger {
+        background-color: #fef0f0;
+        border-color: #fde2e2;
+        color: #f56c6c;
+      }
+
+      // 其他状态保持原样
+      &.el-tag--success {
+        background-color: #f0f9eb;
+        border-color: #e1f3d8;
+        color: #67c23a;
+      }
+
+      &.el-tag--primary {
+        background-color: #ecf5ff;
+        border-color: #d9ecff;
+        color: #409eff;
+      }
     }
 
     // 空数据样式
@@ -1365,4 +1678,20 @@ export default {
     transform: translateY(0);
   }
 }
+
+.el-table {
+  tbody {
+    tr.rejected-row {
+      background-color: rgba(245, 108, 108, 0.1) !important;
+
+      td {
+        background-color: rgba(245, 108, 108, 0.1) !important;
+      }
+
+      &:hover td {
+        background-color: rgba(245, 108, 108, 0.15) !important;
+      }
+    }
+  }
+}
 </style>

src/views/productManagement/productionSummary/components/ProductProductionTable.vue

@@ -175,32 +175,7 @@ export default {
     },
   },
   computed: {
-    tableData() {
-      let data = this.localTableData.length;
-
-      if (this.sortConfig.prop && this.sortConfig.order) {
-        const { prop, order } = this.sortConfig;
-        data = data.sort((a, b) => {
-          let aValue = a[prop];
-          let bValue = b[prop];
-
-          if (prop === "rate") {
-            aValue = (a.finished / a.total) * 100;
-            bValue = (b.finished / b.total) * 100;
-          }
-
-          return order === "ascending"
-            ? aValue > bValue
-              ? 1
-              : -1
-            : aValue < bValue
-            ? 1
-            : -1;
-        });
-      }
-
-      return data;
-    },
+    tableData() {},
   },
   created() {
     this.initData();
@@ -270,6 +245,26 @@ export default {
     },
     handleSortChange({ prop, order }) {
       this.sortConfig = { prop, order };
+      this.sortData();
+    },
+    sortData() {
+      const { prop, order } = this.sortConfig;
+      if (prop && order) {
+        this.localTableData.sort((a, b) => {
+          let aValue = a[prop];
+          let bValue = b[prop];
+
+          if (prop === "rate" || prop === "progress") {
+            aValue = (a.installedQuantity / a.totalQuantity) * 100;
+            bValue = (b.installedQuantity / b.totalQuantity) * 100;
+          } else if (prop === "goodsName" || prop === "orderStatus") {
+            aValue = aValue.toLowerCase();
+            bValue = bValue.toLowerCase();
+          }
+          console.log(prop, aValue, bValue);
+          return order === "ascending" ? aValue - bValue : bValue - aValue;
+        });
+      }
     },
     showTooltip(event, percentage) {
       // 创建tooltip元素