From 29cbf02ac6eaca5f23d83b9f8120630b9a3dc7ae Mon Sep 17 00:00:00 2001
From: hayu <1604366271@qq.com>
Date: Mon, 26 May 2025 00:55:11 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=9A=E7=AD=BE=E7=AE=A1=E7=90=86=EF=BC=8C?=
 =?UTF-8?q?=E5=BA=93=E7=AE=A1=E5=91=98=E5=A4=9A=E9=80=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/countersign/countersignProcess.js     |   8 +-
 .../material/countersign/process/index.vue    | 151 ++++++++++++------
 2 files changed, 108 insertions(+), 51 deletions(-)

diff --git a/src/api/countersign/countersignProcess.js b/src/api/countersign/countersignProcess.js
index 5d6e9252..230ae9ef 100644
--- a/src/api/countersign/countersignProcess.js
+++ b/src/api/countersign/countersignProcess.js
@@ -20,9 +20,9 @@ export function addProcess(data) {
 
 
 //会签流程管理--详细信息
-export function getProcessDetail(id) {
+export function getProcessDetail(ids) {
   return request({
-      url: '/material/sign_process/'+ id,
+      url: '/material/sign_process/'+ ids,
       method: 'get',
   })
 }
@@ -38,9 +38,9 @@ export function editProcess(data) {
 
 
 // 会签配置管理--删除
-export function delProcess(id) {
+export function delProcess(ids) {
   return request({
-      url: '/material/sign_process/delProcess/' + id,
+      url: '/material/sign_process/delProcess/' + ids,
       method: 'post',
   })
 }
diff --git a/src/views/material/countersign/process/index.vue b/src/views/material/countersign/process/index.vue
index 2481e3c8..077ad0b3 100644
--- a/src/views/material/countersign/process/index.vue
+++ b/src/views/material/countersign/process/index.vue
@@ -24,10 +24,10 @@
           icon="el-icon-search"
           size="mini"
           @click="handleQuery"
-          >搜索</el-button
+        >搜索</el-button
         >
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-          >重置</el-button
+        >重置</el-button
         >
       </el-form-item>
     </el-form>
@@ -39,7 +39,7 @@
           icon="el-icon-plus"
           size="mini"
           @click="handleAdd"
-          >新增</el-button
+        >新增</el-button
         >
       </el-col>
       <right-toolbar
@@ -57,8 +57,8 @@
       <el-table-column label="序号" align="center" width="80" type="index">
         <template slot-scope="scope">
           <span>{{
-            (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
-          }}</span>
+              (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
+            }}</span>
         </template>
       </el-table-column>
       <el-table-column
@@ -81,7 +81,19 @@
         prop="orgName"
         sortable
         show-overflow-tooltip
-      />
+        min-width="150"
+      >
+        <template slot-scope="scope">
+          <el-tooltip
+            v-if="scope.row.orgName && scope.row.orgName.length > 20"
+            :content="scope.row.orgName"
+            placement="top"
+          >
+            <span>{{ scope.row.orgName.substring(0, 20) + '...' }}</span>
+          </el-tooltip>
+          <span v-else>{{ scope.row.orgName || '-' }}</span>
+        </template>
+      </el-table-column>
 
       <el-table-column label="操作" align="center" width="180">
         <template slot-scope="scope">
@@ -126,19 +138,19 @@
         <el-row :gutter="24">
           <el-col :span="20">
             <el-form-item label="流程名称" prop="processId">
-            <el-select
+              <el-select
                 v-model="form.processId"
                 placeholder="请选择流程名称"
                 style="width: 100%;"
                 filterable
                 clearable
               >
-              <el-option
-                v-for="dict in dict.type.countersign_process_config_name"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
-              ></el-option>
+                <el-option
+                  v-for="dict in dict.type.countersign_process_config_name"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
               </el-select>
             </el-form-item>
           </el-col>
@@ -147,19 +159,19 @@
         <el-row :gutter="24">
           <el-col :span="20">
             <el-form-item label="会签类型" prop="signType">
-            <el-select
+              <el-select
                 v-model="form.signType"
                 placeholder="请选择会签类型"
                 style="width: 100%;"
                 filterable
                 clearable
               >
-              <el-option
-                v-for="dict in dict.type.countersign_process_type_name"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
-              ></el-option>
+                <el-option
+                  v-for="dict in dict.type.countersign_process_type_name"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
               </el-select>
             </el-form-item>
           </el-col>
@@ -167,13 +179,17 @@
 
         <el-row :gutter="24">
           <el-col :span="20">
-            <el-form-item label="会签组织" prop="orgId">
+            <el-form-item label="会签组织" prop="orgIds">
               <treeselect
-                v-model="form.orgId"
+                v-model="form.orgIds"
+                :multiple="true"
                 :searchable="true"
                 :options="deptOptions"
                 :normalizer="normalizer"
                 placeholder="请选择会签组织"
+                :show-count="true"
+                :limit="10"
+                :limit-text="count => `还有 ${count} 个选项`"
               />
             </el-form-item>
           </el-col>
@@ -186,17 +202,23 @@
       </div>
     </el-dialog>
   </div>
-</template> 
-  
-  <script>
-import { getProcessList, addProcess, getProcessDetail, editProcess, delProcess } from "@/api/countersign/countersignProcess";
-import { listDept, } from "@/api/system/dept";
-import { deptTreeSelect } from "@/api/system/user";
+</template>
+<script>
+import {
+  getProcessList,
+  addProcess,
+  getProcessDetail,
+  editProcess,
+  delProcess
+} from "@/api/countersign/countersignProcess";
+import {listDept,} from "@/api/system/dept";
+import {deptTreeSelect} from "@/api/system/user";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+
 export default {
-    name: "Process",
-    dicts: ["countersign_process_config_name", "countersign_process_type_name"],
+  name: "Process",
+  dicts: ["countersign_process_config_name", "countersign_process_type_name"],
   data() {
     return {
       // 遮罩层
@@ -222,8 +244,7 @@ export default {
       },
 
       // 表单参数
-      form: {
-      },
+      form: {},
       // 表单校验
       rules: {
         processId: [
@@ -240,10 +261,12 @@ export default {
             trigger: "blur",
           },
         ],
-        orgId: [
+        orgIds: [
           {
             required: true,
-            message: "请选择会签组织",
+            type: 'array',
+            min: 1,
+            message: "请至少选择一个会签组织",
             trigger: "blur",
           },
         ],
@@ -254,7 +277,7 @@ export default {
     this.getDeptList()
     this.getList();
   },
-  components: { Treeselect },
+  components: {Treeselect},
   methods: {
     // /** 查询人员列表 */
     // getUserList() {
@@ -267,13 +290,13 @@ export default {
 
     /** 查询部门列表 */
     getDeptList() {
-      listDept({ userId:1}).then(response => {
+      listDept({userId: 1}).then(response => {
         this.deptOptions = this.handleTree(response.data, "deptId");
       });
     },
 
     /** 转换部门数据结构 */
-     normalizer(node) {
+    normalizer(node) {
       if (node.children && !node.children.length) {
         delete node.children;
       }
@@ -304,16 +327,28 @@ export default {
     /** 编辑按钮操作 */
     handleUpdate(row) {
       this.reset();
-      const id = row.id;
-      getProcessDetail(id).then((response) => {
+      const ids = row.ids;
+      getProcessDetail(ids).then((response) => {
         this.form = response.data;
+        // 确保 orgIds 是数组格式
+        if (this.form.orgIds && !Array.isArray(this.form.orgIds)) {
+          // 如果后端返回的是字符串（如逗号分隔），需要转换为数组
+          if (typeof this.form.orgIds === 'string') {
+            this.form.orgIds = this.form.orgIds.split(',').map(id => parseInt(id.trim()));
+          } else {
+            this.form.orgIds = [this.form.orgIds];
+          }
+        }
         this.showProcess = true;
         this.title = "编辑";
       });
     },
+
     // 表单重置
     reset() {
-      this.form = {};
+      this.form = {
+        orgIds: [] // 重置为空数组
+      };
       this.resetForm("form");
     },
 
@@ -334,14 +369,20 @@ export default {
     submitForm() {
       this.$refs["form"].validate((valid) => {
         if (valid) {
+          // 处理提交数据，确保 orgIds 格式正确
+          const submitData = { ...this.form };
+
+          // 如果后端需要字符串格式，可以转换
+          // submitData.orgIds = this.form.orgIds.join(',');
+
           if (this.form.id != undefined) {
-            editProcess(this.form).then((response) => {
+            editProcess(submitData).then((response) => {
               this.$modal.msgSuccess("修改成功");
               this.showProcess = false;
               this.getList();
             });
           } else {
-            addProcess(this.form).then((response) => {
+            addProcess(submitData).then((response) => {
               this.$modal.msgSuccess("新增成功");
               this.showProcess = false;
               this.getList();
@@ -359,42 +400,58 @@ export default {
 
     /** 删除按钮操作 */
     handleDelete(row) {
-      const id = row.id;
+      const ids = row.ids;
       this.$modal
         .confirm("是否确认删除数据项？")
         .then(function () {
-          return delProcess(id);
+          return delProcess(ids);
         })
         .then(() => {
           this.$modal.msgSuccess("删除成功");
           this.getList();
         })
-        .catch(() => {});
+        .catch(() => {
+        });
     },
 
   },
 };
 </script>
-  <style lang="scss" scoped>
+<style lang="scss" scoped>
 .uploadImg {
   padding-top: 20px;
   display: flex;
   align-items: center;
   justify-content: center;
 }
+
 .deviceCode {
   margin-top: 10px;
   padding-bottom: 20px;
   font-size: 18px;
 }
+
 ::v-deep.el-table .fixed-width .el-button--mini {
   width: 60px !important;
   margin-bottom: 10px;
 }
+
 //隐藏图片上传框的css
 ::v-deep.disabled {
   .el-upload--picture-card {
     display: none;
   }
 }
-</style>
\ No newline at end of file
+
+// 多选组织显示样式
+::v-deep .vue-treeselect__multi-value {
+  margin: 2px;
+  max-width: 150px;
+}
+
+::v-deep .vue-treeselect__multi-value-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>