会签管理，库管员多选

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',
   })
 }

src/views/material/countersign/process/index.vue

@@ -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">
@@ -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>
@@ -187,13 +203,19 @@
     </el-dialog>
   </div>
 </template>
-  
 <script>
-import { getProcessList, addProcess, getProcessDetail, editProcess, delProcess } from "@/api/countersign/countersignProcess";
+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"],
@@ -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",
           },
         ],
@@ -304,16 +327,28 @@ export default {
     /** 编辑按钮操作 */
     handleUpdate(row) {
       this.reset();
-      const id = row.id;
+      const ids = row.ids;
-      getProcessDetail(id).then((response) => {
+      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,17 +400,18 @@ 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(() => {
+        });
     },
 
   },
@@ -382,19 +424,34 @@ export default {
   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;
   }
 }
+
+// 多选组织显示样式
+::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>