📖 CRM：【客户】微调客户列表界面

src/views/crm/customer/detail/CustomerDetailsHeader.vue

@@ -11,11 +11,19 @@
       </div>
       <div>
         <!-- 右上：按钮 -->
-        <el-button v-hasPermi="['crm:customer:update']" @click="openForm(customer.id)">
+        <el-button
+          type="primary"
+          v-hasPermi="['crm:customer:update']"
+          @click="openForm(customer.id)"
+        >
           编辑
         </el-button>
-        <el-button @click="transfer">转移</el-button>
+        <!-- TODO @puhui999：转移的操作接入 -->
+        <el-button type="primary" @click="transfer">转移</el-button>
+        <!-- TODO @puhui999：修改成交状态的接入 -->
         <el-button>更改成交状态</el-button>
+        <el-button v-if="customer.lockStatus" @click="handleUnlock(customer.id!)">解锁</el-button>
+        <el-button v-else @click="handleLock(customer.id!)">锁定</el-button>
       </div>
     </div>
   </div>
@@ -49,6 +57,7 @@ const { customer, loading } = defineProps<{
   customer: CustomerApi.CustomerVO // 客户信息
   loading: boolean // 加载中
 }>()
+const message = useMessage() // 消息弹窗
 
 /** 修改操作 */
 const formRef = ref()
@@ -56,5 +65,20 @@ const openForm = (id?: number) => {
   formRef.value.open('update', id)
 }
 
+/** 锁定操作 */
+const handleLock = async (id: number) => {
+  await CustomerApi.lockCustomer(id, true)
+  message.success('锁定成功')
+  emit('refresh')
+}
+
+/** 解锁操作 */
+const handleUnlock = async (id: number) => {
+  console.log(customer, '=======')
+  await CustomerApi.lockCustomer(id, false)
+  message.success('解锁成功')
+  emit('refresh')
+}
+
 const emit = defineEmits(['refresh']) // 定义 success 事件，用于操作成功后的回调
 </script>