Przeglądaj źródła

pms 设备调拨 功能优化2

zhangcl 3 miesięcy temu
rodzic
commit
42e2e1ed6f

+ 1 - 3
src/views/pms/device/ConfigDeviceAllot.vue

@@ -56,7 +56,7 @@
         保 存
       </el-button>
       <div class="temp-list card" v-if="false">
-        <h3>待提交的关联关系</h3>
+        <h3>设备调拨记录</h3>
         <el-table :data="tempRelations" style="width: 100%">
           <el-table-column prop="deviceNames" label="设备" width="200" />
           <el-table-column prop="deptName" label="部门" />
@@ -326,14 +326,12 @@ h3 {
 .equal-height-row {
   display: flex;
   align-items: stretch; /* 关键:等高布局 */
-  /* height: 500px; */
 }
 
 .col-height {
   display: flex;
   flex-direction: column;
   min-height: 400px;/* 统一最小高度 */
-  /* height: 100% !important; */
 }
 
 </style>

+ 12 - 38
src/views/pms/device/ConfigDevicePerson.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <el-row :gutter="20">
+    <el-row :gutter="20" class="equal-height-row">
       <!-- 左侧设备列表 -->
       <el-col :span="12">
         <div class="card">
@@ -50,22 +50,9 @@
               placeholder="请选择人员所属部门"
               @node-click="handleDeptUserTreeNodeClick"
             />
-            <!--
-            <el-select
-              v-model="selectedDept"
-              placeholder="请选择部门"
-              @change="loadUsers"
-            >
-              <el-option
-                v-for="dept in departmentList"
-                :key="dept.id"
-                :label="dept.name"
-                :value="dept.id"
-              />
-            </el-select> -->
           </div>
 
-          <el-scrollbar height="300px" class="user-list">
+          <el-scrollbar height="400px">
             <el-checkbox-group v-model="selectedUsers" @change="handleUserSelectionChange">
               <div
                 v-for="user in simpleUsers"
@@ -78,25 +65,13 @@
               </div>
             </el-checkbox-group>
           </el-scrollbar>
-
-          <div class="action-bar">
-            <!--
-            <el-button
-              type="primary"
-              @click="saveTempRelation"
-              :disabled="!canSave"
-            >
-              确定关联
-            </el-button>
-            <el-button @click="clearSelection">清空选择</el-button> -->
-          </div>
         </div>
       </el-col>
     </el-row>
 
     <!-- 暂存关联列表 -->
     <div class="temp-list card">
-      <h3>待提交的关联关系</h3>
+      <h3>设备责任人调整记录</h3>
       <el-table :data="tempRelations" style="width: 100%">
         <el-table-column prop="deviceNames" label="设备" width="200" />
         <el-table-column prop="userNames" label="关联责任人" />
@@ -120,7 +95,7 @@
           @click="submitRelations"
           :disabled="tempRelations.length === 0"
         >
-          提交全部关联关系
+          保 存
         </el-button>
       </div>
     </div>
@@ -363,7 +338,7 @@ const submitRelations = async () => {
     await IotDevicePersonApi.saveDevicePersonRelation(submitData)
     // 模拟API调用
     console.log('提交数据:', submitData)
-    ElMessage.success('关联关系提交成功')
+    ElMessage.success('提交成功')
     tempRelations.value = []
   } catch (error) {
     ElMessage.error('提交失败,请重试')
@@ -374,12 +349,16 @@ const submitRelations = async () => {
 onMounted(async () => {
   // 初始化部门树 根据选择的部门 查询设备列表 部门人员列表
   deptList.value = handleTree(await DeptApi.getSimpleDeptList())
-  // getList()
 })
 
 </script>
 
 <style scoped>
+.equal-height-row {
+  display: flex;
+  align-items: stretch;
+}
+
 .container {
   padding: 20px;
 }
@@ -390,6 +369,8 @@ onMounted(async () => {
   padding: 20px;
   margin-bottom: 20px;
   background: white;
+  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
+  transition: box-shadow 0.2s;
 }
 
 .list-item {
@@ -401,13 +382,6 @@ onMounted(async () => {
   margin-bottom: 20px;
 }
 
-.user-list {
-  margin-bottom: 20px;
-  border: 1px solid #ebeef5;
-  border-radius: 4px;
-  padding: 10px;
-}
-
 .action-bar {
   text-align: right;
 }

+ 14 - 7
src/views/pms/device/ConfigDeviceStatus.vue

@@ -74,14 +74,18 @@
 
     <!-- 暂存关联列表 -->
     <div class="temp-list card">
-      <h3>待提交的关联关系</h3>
+      <h3>设备状态调整记录</h3>
       <el-table :data="tempRelations" style="width: 100%">
         <el-table-column prop="deviceNames" label="设备" width="200" >
           <template #default="{ row }">
             {{ row.deviceNames }}
           </template>
         </el-table-column>
-        <el-table-column prop="status" label="状态" />
+        <el-table-column prop="status" label="状态" >
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.PMS_DEVICE_STATUS" :value="scope.row.status" />
+          </template>
+        </el-table-column>
         <el-table-column prop="reason" label="调整原因" />
         <el-table-column label="操作" width="120">
           <template #default="{ row }">
@@ -103,7 +107,7 @@
           @click="submitRelations"
           :disabled="tempRelations.length === 0"
         >
-          提交全部关联关系
+          保 存
         </el-button>
       </div>
     </div>
@@ -116,15 +120,12 @@ import { ElMessage } from 'element-plus'
 import {defaultProps, handleTree} from "@/utils/tree";
 import * as DeptApi from "@/api/system/dept";
 import {IotDeviceApi, IotDeviceVO} from "@/api/pms/device";
-import {IotDevicePersonApi, IotDevicePersonVO} from "@/api/pms/iotdeviceperson";
-import * as UserApi from "@/api/system/user";
 import {simpleUserList, UserVO} from "@/api/system/user";
 import {DICT_TYPE, getStrDictOptions} from "@/utils/dict";
 
 defineOptions({ name: 'ConfigDeviceStatus' })
 
 const simpleDevices = ref<IotDeviceVO[]>([])
-const simpleUsers = ref<UserVO[]>([])
 const currentStatus = ref<string>('')
 const adjustReason = ref<string>('')
 const deptList = ref<Tree[]>([]) // 树形结构
@@ -158,7 +159,6 @@ const emit = defineEmits(['success', 'node-click']) // 定义 success 树点击
 // 响应式数据
 const selectedDevice = ref<number>(0)
 const selectedDept = ref('')
-const selectedUsers = ref<number[]>([])
 const tempRelations = ref<Array<{
   deviceId: number
   deviceNames: string
@@ -302,10 +302,17 @@ onMounted(async () => {
 }
 
 .card {
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  padding: 20px;
+  margin-bottom: 20px;
   flex: 1;
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: white;
+  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
+  transition: box-shadow 0.2s;
 }
 
 .list-item {

+ 4 - 4
src/views/pms/device/DevicePerson.vue

@@ -135,8 +135,8 @@
             :formatter="dateFormatter"
             width="180px"
           />
-          <el-table-column label="操作" align="center" min-width="120px">
-            <!-- <template #default="scope">
+          <!-- <el-table-column label="操作" align="center" min-width="120px">
+             <template #default="scope">
 
               <el-button
                 link
@@ -146,8 +146,8 @@
               >
                 编辑
               </el-button>
-            </template> -->
-          </el-table-column>
+            </template>
+          </el-table-column> -->
         </el-table>
         <!-- 分页 -->
         <Pagination