AI工作流绑定销售

src/api/his/aiWorkflow.js

@@ -75,3 +75,36 @@ export function exportWorkflow(query) {
     params: query
   })
 }
+
+// 根据workflowId获取绑定的销售列表
+export function getBindCompanyUserByWorkflowId(workflowId) {
+  return request({
+    url: '/his/aiWorkflow/getBindCompanyUserByWorkflowId/' + workflowId,
+    method: 'get'
+  })
+}
+
+// 获取销售列表
+export function listCompanyUser() {
+  return request({
+    url: '/his/aiWorkflow/listCompanyUser',
+    method: 'get'
+  })
+}
+
+// 检查销售是否已被绑定
+export function checkCompanyUserBeUsed(companyUserId) {
+  return request({
+    url: '/his/aiWorkflow/checkCompanyUserBeUsed/' + companyUserId,
+    method: 'get'
+  })
+}
+
+// 更新工作流绑定销售
+export function updateWorkflowBindCompanyUser(data) {
+  return request({
+    url: '/his/aiWorkflow/updateWorkflowBindCompanyUser',
+    method: 'post',
+    data: data
+  })
+}

src/views/his/aiWorkflow/design.scss

@@ -104,38 +104,24 @@
         .node-content {
           display: flex;
           align-items: center;
-          justify-content: center;
           height: 100%;
-          padding: 0 12px;
+          padding: 0 10px;
+          overflow: hidden;
 
           i {
-            font-size: 18px;
+            font-size: 16px;
             margin-right: 6px;
             flex-shrink: 0;
           }
 
-          .node-name-input {
-            border: none;
-            background: transparent;
-            outline: none;
-            font-size: 13px;
-            color: #333;
-            text-align: center;
-            min-width: 40px;
-            padding: 2px 4px;
-            
-            &:focus {
-              background: rgba(255, 255, 255, 0.8);
-              border-radius: 2px;
-            }
-          }
-
           .node-name {
-            font-size: 13px;
+            font-size: 12px;
             color: #333;
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
+            flex: 1;
+            min-width: 0;
           }
         }
 

src/views/his/aiWorkflow/design.vue

@@ -124,8 +124,8 @@
               @click.stop="selectNode(node)"
             >
               <rect
-                :width="getNodeWidth(node)"
-                :height="node.height || 40"
+                :width="nodeWidth"
+                :height="node.height || 36"
                 rx="6"
                 ry="6"
                 :fill="getNodeBgColor(node)"
@@ -133,27 +133,20 @@
                 stroke-width="2"
                 :class="{ selected: selectedNode === node }"
               />
-              <foreignObject :width="getNodeWidth(node)" :height="node.height || 40">
-                <div class="node-content" xmlns="http://www.w3.org/1999/xhtml">
+              <foreignObject :width="nodeWidth" :height="node.height || 36">
+                <div class="node-content" xmlns="http://www.w3.org/1999/xhtml" :title="node.nodeName">
                   <i :class="node.nodeIcon" :style="{ color: node.nodeColor }"></i>
-                  <input
-                    type="text"
-                    class="node-name-input"
-                    v-model="node.nodeName"
-                    @mousedown.stop
-                    @input="onNodeNameInput(node)"
-                    :style="{ width: getInputWidth(node) + 'px' }"
-                  />
+                  <span class="node-name">{{ node.nodeName }}</span>
                 </div>
               </foreignObject>
               <!-- 连接点 -->
-              <circle :cx="getNodeWidth(node) / 2" cy="0" r="6" fill="#fff" stroke="#1890ff" stroke-width="2"
+              <circle :cx="nodeWidth / 2" cy="0" r="5" fill="#fff" stroke="#1890ff" stroke-width="2"
                 class="anchor top" @mousedown.stop="startConnect($event, node, 'top')" />
-              <circle :cx="getNodeWidth(node) / 2" :cy="node.height || 40" r="6" fill="#fff" stroke="#1890ff" stroke-width="2"
+              <circle :cx="nodeWidth / 2" :cy="node.height || 36" r="5" fill="#fff" stroke="#1890ff" stroke-width="2"
                 class="anchor bottom" @mousedown.stop="startConnect($event, node, 'bottom')" />
-              <circle cx="0" :cy="(node.height || 40) / 2" r="6" fill="#fff" stroke="#1890ff" stroke-width="2"
+              <circle cx="0" :cy="(node.height || 36) / 2" r="5" fill="#fff" stroke="#1890ff" stroke-width="2"
                 class="anchor left" @mousedown.stop="startConnect($event, node, 'left')" />
-              <circle :cx="getNodeWidth(node)" :cy="(node.height || 40) / 2" r="6" fill="#fff" stroke="#1890ff" stroke-width="2"
+              <circle :cx="nodeWidth" :cy="(node.height || 36) / 2" r="5" fill="#fff" stroke="#1890ff" stroke-width="2"
                 class="anchor right" @mousedown.stop="startConnect($event, node, 'right')" />
             </g>
           </g>
@@ -170,7 +163,11 @@
         <!-- 节点属性 -->
         <el-form v-if="selectedNode" label-width="80px" size="small">
           <el-form-item label="节点内容">
-            <el-input v-model="selectedNode.nodeName" />
+            <el-input 
+              v-model="selectedNode.nodeName" 
+              type="textarea"
+              :autosize="{ minRows: 1, maxRows: 6 }"
+            />
           </el-form-item>
           <el-form-item label="节点类型">
             <el-input :value="getNodeTypeName(selectedNode.nodeType)" disabled />
@@ -253,6 +250,8 @@ export default {
       tempEdge: null,
       // 画布尺寸
       canvasSize: { width: 2000, height: 2000 },
+      // 节点固定宽度
+      nodeWidth: 120,
       // 是否正在拖动画布
       isDraggingCanvas: false,
       // 画布拖动起始点
@@ -551,12 +550,11 @@ export default {
     },
     /** 检测并扩展画布 */
     checkAndExpandCanvas(node) {
-      const nodeWidth = this.getNodeWidth(node)
-      const nodeHeight = node.height || 40
+      const nodeHeight = node.height || 36
       const padding = 200 // 边缘预留空间
       const expandStep = 500 // 每次扩展的大小
       
-      const nodeRight = node.posX + nodeWidth
+      const nodeRight = node.posX + this.nodeWidth
       const nodeBottom = node.posY + nodeHeight
       
       // 检测右边缘
@@ -603,8 +601,8 @@ export default {
     },
     /** 获取锚点位置 */
     getAnchorPos(node, anchor) {
-      const w = this.getNodeWidth(node)
-      const h = node.height || 40
+      const w = this.nodeWidth
+      const h = node.height || 36
       switch (anchor) {
         case 'top': return { x: node.posX + w / 2, y: node.posY }
         case 'bottom': return { x: node.posX + w / 2, y: node.posY + h }
@@ -621,8 +619,8 @@ export default {
       const x = (clientX - rect.left + scrollLeft - this.canvasOffset.x) / this.scale
       const y = (clientY - rect.top + scrollTop - this.canvasOffset.y) / this.scale
       return this.nodes.find(n => {
-        const w = this.getNodeWidth(n)
-        const h = n.height || 40
+        const w = this.nodeWidth
+        const h = n.height || 36
         return x >= n.posX && x <= n.posX + w && y >= n.posY && y <= n.posY + h
       })
     },
@@ -671,26 +669,7 @@ export default {
       const color = node.nodeColor || '#1890ff'
       return color + '15'
     },
-    /** 计算节点宽度 */
-    getNodeWidth(node) {
-      const minWidth = 80
-      const padding = 50 // 图标 + 左右padding
-      const charWidth = 14 // 每个字符大约宽度
-      const textWidth = (node.nodeName || '').length * charWidth
-      return Math.max(minWidth, textWidth + padding)
-    },
-    /** 计算输入框宽度 */
-    getInputWidth(node) {
-      const minWidth = 40
-      const charWidth = 14
-      const textWidth = (node.nodeName || '').length * charWidth
-      return Math.max(minWidth, textWidth + 10)
-    },
-    /** 节点名称输入事件 */
-    onNodeNameInput(node) {
-      // 触发视图更新
-      this.$forceUpdate()
-    },
+
     /** 获取节点类型名称 */
     getNodeTypeName(typeCode) {
       const t = this.nodeTypes.find(n => n.typeCode === typeCode)

src/views/his/aiWorkflow/index.vue

@@ -107,6 +107,12 @@
             @click="handleEdit(scope.row)"
             v-hasPermi="['his:aiWorkflow:edit']"
           >设计</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-user"
+            @click="handleBindSales(scope.row)"
+          >绑定销售</el-button>
           <el-button
             size="mini"
             type="text"
@@ -132,11 +138,64 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
+
+    <!-- 绑定销售弹窗 -->
+    <el-dialog title="绑定销售" :visible.sync="bindSalesOpen" width="500px" append-to-body>
+      <!-- 当前绑定的销售 -->
+      <div class="current-sales">
+        <div class="section-title">当前绑定销售</div>
+        <div v-if="currentBindUserList && currentBindUserList.length > 0" class="bind-info">
+          <el-tag 
+            v-for="(user, index) in currentBindUserList" 
+            :key="index" 
+            type="success"
+            style="margin-right: 8px; margin-bottom: 8px;"
+          >
+            {{ user.userName || user.user_name }}（{{ user.nickName || user.nick_name }}）
+          </el-tag>
+        </div>
+        <div v-else class="no-bind">
+          <el-tag type="info">暂未绑定销售</el-tag>
+        </div>
+      </div>
+
+      <!-- 可选销售列表 -->
+      <div class="sales-list">
+        <div class="section-title">选择销售</div>
+        <el-input
+          v-model="salesSearchKey"
+          placeholder="搜索昵称"
+          size="small"
+          prefix-icon="el-icon-search"
+          clearable
+          style="margin-bottom: 10px"
+        />
+        <el-table
+          :data="filteredCompanyUserList"
+          v-loading="salesLoading"
+          border
+          height="300"
+          :row-key="getSalesRowKey"
+          :row-class-name="salesRowClassName"
+          @selection-change="handleSalesSelectionChange"
+          ref="salesTable"
+        >
+          <el-table-column type="selection" width="55" align="center" :selectable="checkSelectable" :reserve-selection="true" />
+          <el-table-column label="用户名" align="center" prop="userName" />
+          <el-table-column label="昵称" align="center" prop="nickName" />
+        </el-table>
+      </div>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="handleBindSalesCancel">取 消</el-button>
+        <el-button type="primary" :disabled="selectedSalesList.length === 0" @click="confirmBindSales">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listWorkflow, delWorkflow, updateWorkflowStatus, copyWorkflow, exportWorkflow } from '@/api/his/aiWorkflow'
+import { listWorkflow, delWorkflow, updateWorkflowStatus, copyWorkflow, exportWorkflow, getBindCompanyUserByWorkflowId, listCompanyUser, updateWorkflowBindCompanyUser } from '@/api/his/aiWorkflow'
 
 export default {
   name: 'AiWorkflow',
@@ -176,7 +235,33 @@ export default {
         workflowName: null,
         workflowType: null,
         status: null
+      },
+      // 绑定销售弹窗
+      bindSalesOpen: false,
+      // 销售列表加载
+      salesLoading: false,
+      // 当前操作的工作流
+      currentWorkflow: null,
+      // 当前绑定的用户列表
+      currentBindUserList: [],
+      // 销售列表
+      companyUserList: [],
+      // 选中的销售列表
+      selectedSalesList: [],
+      // 销售搜索关键字
+      salesSearchKey: ''
+    }
+  },
+  computed: {
+    // 过滤后的销售列表
+    filteredCompanyUserList() {
+      if (!this.salesSearchKey) {
+        return this.companyUserList
       }
+      const key = this.salesSearchKey.toLowerCase()
+      return this.companyUserList.filter(item => {
+        return (item.nickName && item.nickName.toLowerCase().includes(key))
+      })
     }
   },
   created() {
@@ -276,7 +361,139 @@ export default {
         this.download(response.msg)
         this.exportLoading = false
       }).catch(() => {})
+    },
+    /** 绑定销售按钮操作 */
+    handleBindSales(row) {
+      this.currentWorkflow = row
+      this.currentBindUserList = []
+      this.selectedSalesList = []
+      this.salesSearchKey = ''
+      this.bindSalesOpen = true
+      this.salesLoading = true
+      console.log(11111)
+      // 获取当前绑定的销售列表
+      getBindCompanyUserByWorkflowId(row.workflowId).then(res => {
+        this.currentBindUserList = res.data.data || []
+      }).catch(() => {})
+      console.log(this.currentBindUserList)
+      // 获取销售列表
+      listCompanyUser().then(res => {
+        this.companyUserList = res.data || res.rows || []
+        this.salesLoading = false
+      }).catch(() => {
+        this.salesLoading = false
+      })
+    },
+    /** 销售勾选变化 */
+    handleSalesSelectionChange(selection) {
+      this.selectedSalesList = selection
+    },
+    /** 获取销售行key */
+    getSalesRowKey(row) {
+      return row.userId || row.companyUserId || row.id
+    },
+    /** 取消绑定销售弹窗 */
+    handleBindSalesCancel() {
+      this.bindSalesOpen = false
+      this.selectedSalesList = []
+      this.$refs.salesTable && this.$refs.salesTable.clearSelection()
+    },
+    /** 销售行样式 */
+    salesRowClassName({ row }) {
+      if (this.isCurrentBindUser(row)) {
+        return 'disabled-row'
+      }
+      return ''
+    },
+    /** 判断是否为当前绑定用户 */
+    isCurrentBindUser(row) {
+      if (!this.currentBindUserList || this.currentBindUserList.length === 0) {
+        return false
+      }
+      const rowUserId = row.userId || row.companyUserId || row.user_id
+      return this.currentBindUserList.some(user => {
+        const bindUserId = user.userId || user.companyUserId || user.user_id
+        return bindUserId == rowUserId
+      })
+    },
+    /** 检查是否可选 */
+    checkSelectable(row) {
+      return !this.isCurrentBindUser(row)
+    },
+    /** 确认绑定销售 */
+    confirmBindSales() {
+      if (this.selectedSalesList.length === 0) {
+        this.msgWarning('请选择要绑定的销售')
+        return
+      }
+
+      const workflowId = this.currentWorkflow.workflowId
+      const companyUserIds = this.selectedSalesList.map(item => item.userId || item.companyUserId)
+      
+      this.doBindSales(workflowId, companyUserIds)
+    },
+    /** 执行绑定销售 */
+    doBindSales(workflowId, companyUserIds) {
+      updateWorkflowBindCompanyUser({
+        workflowId: workflowId,
+        companyUserIds: companyUserIds
+      }).then(() => {
+        this.msgSuccess('绑定成功')
+        this.bindSalesOpen = false
+        this.getList()
+      })
     }
   }
 }
 </script>
+
+<style lang="scss" scoped>
+.current-sales {
+  margin-bottom: 20px;
+  padding-bottom: 15px;
+  border-bottom: 1px solid #eee;
+
+  .section-title {
+    font-weight: 600;
+    margin-bottom: 10px;
+    color: #333;
+  }
+
+  .bind-info {
+    .el-tag {
+      font-size: 14px;
+      padding: 8px 15px;
+      height: auto;
+      line-height: 1.5;
+      white-space: normal;
+    }
+  }
+
+  .no-bind {
+    .el-tag {
+      font-size: 14px;
+      padding: 8px 15px;
+      height: auto;
+    }
+  }
+}
+
+.sales-list {
+  .section-title {
+    font-weight: 600;
+    margin-bottom: 10px;
+    color: #333;
+  }
+}
+</style>
+
+<style lang="scss">
+.el-table .disabled-row {
+  background-color: #f5f5f5;
+  color: #999;
+  
+  &:hover > td {
+    background-color: #f5f5f5 !important;
+  }
+}
+</style>