资产信息修改处理

src/store/modules/user.js

@@ -1,70 +1,78 @@
-import { login, logout, getInfo } from '@/api/login'
+import { login, logout, getInfo } from "@/api/login";
-import { getToken, setToken, removeToken } from '@/utils/auth'
+import { getToken, setToken, removeToken } from "@/utils/auth";
-import defAva from '@/assets/images/profile.jpg'
+import defAva from "@/assets/images/profile.jpg";
 
-const useUserStore = defineStore(
+const useUserStore = defineStore("user", {
-  'user',
-  {
   state: () => ({
     token: getToken(),
-      name: '',
+    name: "",
-      avatar: '',
+    avatar: "",
     roles: [],
-      permissions: []
+    permissions: [],
   }),
   actions: {
     // 登录
     login(userInfo) {
-        const username = userInfo.username.trim()
+      const username = userInfo.username.trim();
-        const password = userInfo.password
+      const password = userInfo.password;
-        const code = userInfo.code
+      const code = userInfo.code;
-        const uuid = userInfo.uuid
+      const uuid = userInfo.uuid;
       return new Promise((resolve, reject) => {
-          login(username, password, code, uuid).then(res => {
+        login(username, password, code, uuid)
-            setToken(res.token)
+          .then((res) => {
-            this.token = res.token
+            setToken(res.token);
-            resolve()
+            this.token = res.token;
-          }).catch(error => {
+            resolve();
-            reject(error)
-          })
           })
+          .catch((error) => {
+            reject(error);
+          });
+      });
     },
     // 获取用户信息
     getInfo() {
       return new Promise((resolve, reject) => {
-          getInfo().then(res => {
+        getInfo()
-            const user = res.user
+          .then((res) => {
-            const avatar = (user.avatar == "" || user.avatar == null) ? defAva : import.meta.env.VITE_APP_BASE_API + user.avatar;
+            const user = res.user;
+            const avatar =
+              user.avatar == "" || user.avatar == null
+                ? defAva
+                : import.meta.env.VITE_APP_BASE_API + user.avatar;
 
-            if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
+            if (res.roles && res.roles.length > 0) {
-              this.roles = res.roles
+              // 验证返回的roles是否是一个非空数组
-              this.permissions = res.permissions
+              this.roles = res.roles;
+              this.permissions = res.permissions;
             } else {
-              this.roles = ['ROLE_DEFAULT']
+              this.roles = ["ROLE_DEFAULT"];
             }
-            this.name = user.userName
+            this.name = user.userName;
             this.avatar = avatar;
-            resolve(res)
+            resolve(res);
-          }).catch(error => {
-            reject(error)
-          })
           })
+          .catch((error) => {
+            reject(error);
+          });
+      });
     },
     // 退出系统
     logOut() {
       return new Promise((resolve, reject) => {
-          logout(this.token).then(() => {
+        logout(this.token)
-            this.token = ''
+          .then(() => {
-            this.roles = []
+            this.token = "";
-            this.permissions = []
+            this.roles = [];
-            removeToken()
+            this.permissions = [];
-            resolve()
+            removeToken();
-          }).catch(error => {
+            resolve();
-            reject(error)
-          })
-        })
-      }
-    }
           })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+  },
+});
 
-export default useUserStore
+export default useUserStore;

src/views/model/asset/addParams.vue

@@ -3,10 +3,10 @@
     <div class="submitBtn">
       <el-button
         type="primary"
-        :icon="Check"
+        :icon="submitIcon"
         @click="paramSubmit(paramsFormRef)"
       >
-        提交
+        {{ paramsText }}
       </el-button>
     </div>
     <el-collapse class="paramsCollapse" v-model="activeNames">
@@ -16,11 +16,11 @@
           class="paramsForm"
           :rules="paramsRules"
           :inline="true"
-          :model="paramsForm"
+          :model="formData.paramsForm"
         >
           <el-form-item label="组织" prop="orgName">
             <el-tree-select
-              v-model="paramsForm.orgName"
+              v-model="formData.paramsForm.orgName"
               :data="deptOptions"
               :props="{
                 value: 'label',
@@ -34,16 +34,16 @@
               @node-click="selectDept"
             />
           </el-form-item>
-          <el-form-item label="编码">
+          <el-form-item label="编码" prop="assetCode">
             <el-input
-              v-model="paramsForm.assetCode"
+              v-model="formData.paramsForm.assetCode"
               placeholder="编码"
               clearable
             />
           </el-form-item>
           <el-form-item label="是否可用" prop="flagEnabled">
             <el-select
-              v-model="paramsForm.flagEnabled"
+              v-model="formData.paramsForm.flagEnabled"
               placeholder="请选择是否可用"
             >
               <el-option
@@ -56,14 +56,14 @@
           </el-form-item>
           <el-form-item label="名称" prop="assetName">
             <el-input
-              v-model="paramsForm.assetName"
+              v-model="formData.paramsForm.assetName"
               placeholder="名称"
               clearable
             />
           </el-form-item>
           <el-form-item label="类别" prop="assetType">
             <el-select
-              v-model="paramsForm.assetType"
+              v-model="formData.paramsForm.assetType"
               placeholder="请选择类别"
               clearable
             >
@@ -75,6 +75,7 @@
               />
             </el-select>
           </el-form-item>
+          <div>
             <el-form-item label="组成设备">
               <el-select
                 v-model="paramsDevice"
@@ -82,6 +83,9 @@
                 filterable
                 allow-create
                 default-first-option
+                collapse-tags
+                collapse-tags-tooltip
+                :max-collapse-tags="3"
                 :reserve-keyword="false"
                 placeholder="组成设备"
                 style="width: 240px"
@@ -95,11 +99,24 @@
               </el-select>
             </el-form-item>
             <el-form-item>
-            <el-button type="success" @click="selectParams">选择参数</el-button>
+              <el-button type="success" @click="selectParams"
+                >选择参数</el-button
+              >
             </el-form-item>
+          </div>
         </el-form>
       </el-collapse-item>
       <el-collapse-item title="参数列表" name="2">
+        <vxe-toolbar>
+          <template #buttons>
+            <vxe-button
+              status="danger"
+              content="删除"
+              icon="vxe-icon-delete"
+              @click="removeEvent()"
+            ></vxe-button>
+          </template>
+        </vxe-toolbar>
         <vxe-table
           class="tableCollapse"
           border
@@ -115,8 +132,8 @@
             field="paramName"
             title="参数名称"
             :filters="addressOptions"
-            :filter-method="filterAddressMethod"
+            :filter-method="filterParamName"
-            :filter-recover-method="filterAddressRecoverMethod"
+            :filter-recover-method="filterParamNameRecover"
           >
             <template #filter="{ $panel, column }">
               <vxe-input
@@ -141,6 +158,15 @@
               <vxe-checkbox v-model="row.contrlFlag"></vxe-checkbox>
             </template>
           </vxe-column>
+          <vxe-column title="操作" width="100" show-overflow>
+            <template #default="{ row }">
+              <vxe-button
+                type="text"
+                icon="vxe-icon-delete"
+                @click="removeEvent(row)"
+              ></vxe-button>
+            </template>
+          </vxe-column>
         </vxe-table>
       </el-collapse-item>
     </el-collapse>
@@ -167,8 +193,8 @@
           field="paramModelName"
           title="参数模版名称"
           :filters="ageOptions"
-          :filter-method="filterAgeMethod"
+          :filter-method="filterParamModel"
-          :filter-recover-method="filterAgeRecoverMethod"
+          :filter-recover-method="filterParamModelRecover"
         >
           <template #filter="{ $panel, column }">
             <vxe-input
@@ -187,8 +213,8 @@
           field="paramName"
           title="参数名称"
           :filters="addressOptions"
-          :filter-method="filterAddressMethod"
+          :filter-method="filterParamNameSel"
-          :filter-recover-method="filterAddressRecoverMethod"
+          :filter-recover-method="filterParamNameRecoverSel"
         >
           <template #filter="{ $panel, column }">
             <vxe-input
@@ -221,9 +247,13 @@
 </template>
 <script setup>
 import { ref, reactive, onMounted } from "vue";
-import { useRoute } from "vue-router";
+import { ElMessage } from "element-plus";
 import { deptTreeSelect } from "@/api/system/user";
-import { listByDeviceUuids } from "@/api/model/asset/params";
+import {
+  listByDeviceUuids,
+  listParams,
+  delParams,
+} from "@/api/model/asset/params";
 import { listDeviceNoPage } from "@/api/model/device";
 import {
   listInfo,
@@ -239,7 +269,11 @@ const { dc_asset_attr } = proxy.useDict("dc_asset_attr");
 
 const activeNames = ref(["1", "2"]);
 const route = useRoute();
+const router = useRouter();
 const id = route.query.id;
+const ids = ref();
+const submitIcon = ref("Plus");
+const paramsText = ref("新增");
 const paramsFormRef = ref();
 const dialogTableVisible = ref(false);
 const deptOptions = ref([]);
@@ -252,7 +286,8 @@ const enabledFlag = ref([
   { label: "可用", value: 1, elTagType: "default", elTagClass: null },
   { label: "不可用", value: 0, elTagType: "default", elTagClass: null },
 ]);
-const paramsForm = reactive({
+const formData = reactive({
+  paramsForm: {
     assetCode: "",
     flagEnabled: null,
     assetName: "",
@@ -266,41 +301,80 @@ const paramsForm = reactive({
         contrlFlag: false,
       },
     ],
+  },
 });
 const paramsTableRef = ref();
 const addTableRef = ref();
 const loading = ref(false);
 const sexOptions = ref([
-  { label: "高区", value: "高区" },
+  { label: "A", value: "A" },
-  { label: "中区", value: "中区" },
+  { label: "B", value: "B" },
-  { label: "低区", value: "低区" },
+  { label: "C", value: "C" },
+  { label: "D", value: "D" },
 ]);
 const ageOptions = ref([{ data: "" }]);
 const addressOptions = ref([{ data: "" }]);
 const paramsRules = reactive({
+  orgName: [{ required: true, message: "请选择组织", trigger: "change" }],
+  assetCode: [{ required: true, message: "请输入编码", trigger: "blur" }],
+  flagEnabled: [
+    { required: true, message: "请选择是否可用", trigger: "change" },
+  ],
   assetName: [{ required: true, message: "请输入资产名称", trigger: "blur" }],
+  assetType: [{ required: true, message: "请选择类别", trigger: "change" }],
 });
 
-const filterAgeMethod = ({ option, row }) => {
+const filterParamModel = ({ option, row }) => {
-  return row.age === Number(option.data);
+  //参数模板名称搜索
+  return row.paramModelName === option.data;
+};
+const filterParamModelRecover = ({ option }) => {
+  // 参数模板名称如果是自定义筛选模板，当为点击确认时，该选项将被恢复为默认值
+  option.data = "";
+};
+const filterParamName = ({ option, row }) => {
+  //参数名称搜索
+  return row.paramName === option.data;
 };
-const filterAgeRecoverMethod = ({ option }) => {
+const filterParamNameRecover = ({ option }) => {
-  // 如果是自定义筛选模板，当为点击确认时，该选项将被恢复为默认值
+  // 参数名称如果是自定义筛选模板，当为点击确认时，该选项将被恢复为默认值
   option.data = "";
 };
-const filterAddressMethod = ({ option, row }) => {
+const filterParamNameSel = ({ option, row }) => {
-  return row.address === option.data;
+  //选择参数名称搜索
+  return row.paramName === option.data;
 };
-const filterAddressRecoverMethod = ({ option }) => {
+const filterParamNameRecoverSel = ({ option }) => {
-  // 如果是自定义筛选模板，当为点击确认时，该选项将被恢复为默认值
+  // 参数名称如果是自定义筛选模板，当为点击确认时，该选项将被恢复为默认值
   option.data = "";
 };
 onMounted(() => {
-  const dsfsdf = route.query.id;
+  if (route.query.id != undefined) {
-  debugger;
+    getBasicInfo();
+    getParamsList();
+  }
   getDeptTree();
   getDevice();
 });
+function getBasicInfo() {
+  getInfo(route.query.id).then((response) => {
+    formData.paramsForm = response.data;
+    submitIcon.value = "Check";
+    paramsText.value = "修改";
+  });
+}
+function getParamsList() {
+  //获取参数列表
+  const params = {
+    assetCode: route.query.assetCode,
+  };
+  listParams(params).then((res) => {
+    if (res.code === 200) {
+      paramsList.value = res.rows;
+      paramsCode.value = paramsList.value.map((item) => item.paramCode);
+    }
+  });
+}
 function getDeptTree() {
   //获取部门树
   deptTreeSelect().then((response) => {
@@ -319,7 +393,7 @@ function selectParams() {
   if (paramsDevice.value.length != 0) {
     const params = {
       deviceUuids: paramsDevice.value,
-      excludeParamCodes: [],
+      excludeParamCodes: paramsCode.value,
     };
     listByDeviceUuids(params).then((res) => {
       if (res.code === 200) {
@@ -327,29 +401,73 @@ function selectParams() {
         dialogTableVisible.value = true;
       }
     });
+  } else {
+    ElMessage({
+      message: "请先选择组成设备！",
+      type: "warning",
+    });
   }
 }
 function selectDept(val) {
   //部门参数选择
-  paramsForm.orgCode = val.id;
+  formData.paramsForm.orgCode = val.id;
 }
 function addConfirm() {
   //选择参数确认
   const $addTable = addTableRef.value;
   if ($addTable) {
     const selectRecords = $addTable.getCheckboxRecords();
-    paramsList.value = selectRecords.map((item) => {
+    selectRecords.map((item) => {
-      return {
+      paramsList.value.push({
         ...item,
         flagEnabled: false,
         contrlFlag: false,
-      };
       });
-    paramsCode.value = selectRecords.map((item) => item.paramCode);
+    });
+    paramsCode.value = paramsList.value.map((item) => item.paramCode);
+    console.log(paramsList.value, paramsCode.value);
     dialogTableVisible.value = false;
   }
 }
 
+const removeEvent = async (row) => {
+  //删除
+  if (row) {
+    ids.value = row.id;
+  } else {
+    const $submitTable = paramsTableRef.value;
+    ids.value = $submitTable.getCheckboxRecords().map((item) => item.id);
+    if (ids.value.length === 0) {
+      ElMessage({
+        message: "请选择删除数据！",
+        type: "warning",
+      });
+      return;
+    }
+  }
+  if (route.query.id != undefined) {
+    proxy.$modal
+      .confirm("是否确认删除数据项？")
+      .then(function () {
+        return delParams(ids.value);
+      })
+      .then(() => {
+        getParamsList();
+        proxy.$modal.msgSuccess("删除成功");
+      })
+      .catch(() => {});
+  } else {
+    const $submitTable = paramsTableRef.value;
+    const selectParamsList = $submitTable.getCheckboxRecords();
+    if ($submitTable) {
+      $submitTable.remove(row || selectParamsList);
+      paramsList.value = $submitTable.getTableData().tableData;
+      paramsCode.value = paramsList.value.map((item) => item.paramCode);
+      console.log(paramsList.value);
+    }
+  }
+};
+
 const paramSubmit = async (formEl) => {
   //提交
   if (!formEl) return;
@@ -363,21 +481,22 @@ const paramSubmit = async (formEl) => {
           flagEnabled: item.flagEnabled,
           contrlFlag: item.contrlFlag,
         }));
-        paramsForm.assetParamsDtos = selectParamsListArr;
+        formData.paramsForm.assetParamsDtos = selectParamsListArr;
-        if (id.value != undefined) {
+        if (route.query.id != undefined) {
-          updateInfo(paramsForm).then((response) => {
+          updateInfo(formData.paramsForm).then((response) => {
             proxy.$modal.msgSuccess("修改成功");
             open.value = false;
-            getList();
           });
         } else {
-          addInfo(paramsForm).then((response) => {
+          addInfo(formData.paramsForm).then((response) => {
             proxy.$modal.msgSuccess("新增成功");
             open.value = false;
-            getList();
           });
         }
-        console.log(paramsForm);
+        router.push({
+          path: "AssetInfo",
+        });
+        console.log(formData.paramsForm);
       }
     } else {
       console.log("error submit!", fields);

src/views/model/asset/index.vue

@@ -377,11 +377,12 @@ function handleAdd() {
 function handleUpdate(row) {
   // reset();
   const id = row.id || ids.value;
-  debugger;
+  const assetCode = row.assetCode;
   router.push({
     path: "AddParams",
     query: {
       id,
+      assetCode,
     },
   });
   // getInfo(_id).then((response) => {