riku
2025-09-18 c1d2051abc8ca88cd07f0d7c56c0dbf8165d5c33
src/views/fysp/config/device/CompDeviceMatchEdit.vue
@@ -1,4 +1,9 @@
<template>
  <el-row justify="end">
    <el-button icon="check" type="success" @click="save" :loading="saveLoading"
      >保存</el-button
    >
  </el-row>
  <el-row :gutter="20">
    <el-col :span="8">
      <CompInfoSearch
@@ -11,12 +16,20 @@
          <div>
            <el-text>编号:{{ row.deviceCode }}</el-text>
          </div>
          <div>
          <el-space>
            <el-text>名称:{{ row.deviceName }}</el-text>
          </div>
            <el-button
              v-show="row.deviceName"
              type="primary"
              icon="DocumentCopy"
              text
              circle
              @click="copyDeviceName(row.deviceName)"
            />
          </el-space>
        </template>
        <template #default="{ row, click }">
          <el-text>deviceInfo</el-text>
          <ItemDevice :item="row" @add="selectDevice(row, click)" />
        </template>
      </CompInfoSearch>
    </el-col>
@@ -31,9 +44,17 @@
          <div>
            <el-text>编号:{{ row.svUserId }}</el-text>
          </div>
          <div>
          <el-space>
            <el-text>名称:{{ row.svUserName }}</el-text>
          </div>
            <el-button
              v-show="row.svUserName"
              type="primary"
              icon="DocumentCopy"
              text
              circle
              @click="copySVUser(row.svUserName)"
            />
          </el-space>
        </template>
        <template #default="{ row, click }">
          <ItemUser :item="row" @add="selectSVUser(row, click)" />
@@ -51,9 +72,17 @@
          <div>
            <el-text>编号:{{ row.tzUserId }}</el-text>
          </div>
          <div>
          <el-space>
            <el-text>名称:{{ row.tzUserName }}</el-text>
          </div>
            <el-button
              v-show="row.tzUserName"
              type="primary"
              icon="DocumentCopy"
              text
              circle
              @click="copyTZUser(row.tzUserName)"
            />
          </el-space>
        </template>
        <template #default="{ row, click }">
          <ItemUser :item="row" @add="selectTZUser(row, click)" />
@@ -65,10 +94,12 @@
<script>
import { useCloned } from '@vueuse/core';
import CompInfoSearch from './CompInfoSearch.vue';
import CompInfoSearch from '../components/CompInfoSearch.vue';
import tzUserApi from '@/api/fytz/userApi';
import svUserApi from '@/api/fysp/userApi';
import userMapApi from '@/api/fysp/userMapApi';
import { svToTz } from '@/enum/scene';
import { saveAs } from 'file-saver';
export default {
  components: { CompInfoSearch },
@@ -78,6 +109,7 @@
    // 检索范围(包含行政区划、场景类型)
    area: Object
  },
  emits: ['save'],
  data() {
    return {
      // 监测设备
@@ -85,7 +117,9 @@
      // 监管用户
      svUser: {},
      // 环境用户
      tzUser: {}
      tzUser: {},
      // 保存loading
      saveLoading: false
    };
  },
  watch: {
@@ -111,7 +145,27 @@
  },
  methods: {
    // 查询监测设备
    searchDevice() {},
    searchDevice(param, callback) {
      const { text, page, pageSize } = param;
      const { cloned: area } = useCloned(this.area);
      return userMapApi
        .searchThirdPartyDevice(area.value, text, page, pageSize)
        .then((res) => {
          if (res.success) {
            const l = res.data.map((value) => {
              return {
                deviceCode: value.mnCode,
                deviceName: value.name,
                district: area.value.districtname
              };
            });
            callback({
              data: l,
              total: res.head.totalCount
            });
          }
        });
    },
    // 查询监管用户
    searchSVUser(param, callback) {
      const { text, page, pageSize } = param;
@@ -153,7 +207,7 @@
      area.townCode = this.area.towncode;
      area.townName = this.area.townname;
      // 场景类型
      const tzSceneType = svToTz(this.area.scensetypeid)
      const tzSceneType = svToTz(this.area.scensetypeid);
      area.sceneTypes = [tzSceneType.value];
      // 上下线状态
      area.online = this.area.online;
@@ -182,7 +236,13 @@
          callback();
        });
    },
    selectDevice() {},
    selectDevice(row, click) {
      const p = {
        deviceCode: row.deviceCode,
        deviceName: row.deviceName
      };
      click(p);
    },
    selectSVUser(row, click) {
      const p = {
        svUserId: row.guid,
@@ -196,6 +256,87 @@
        tzUserName: row.realname
      };
      click(p);
    },
    // 复制监管用户
    copySVUser(svUserName) {
      // 使用Clipboard API将用户名称复制到剪贴板
      navigator.clipboard
        .writeText(svUserName)
        .then(() => {
          this.$message({
            message: '监管用户名称已复制到剪贴板',
            type: 'success'
          });
        })
        .catch((err) => {
          this.$message({
            message: '复制失败,请手动复制',
            type: 'error'
          });
          console.error('复制失败:', err);
        });
    },
    // 复制环境用户
    copyTZUser(tzUserName) {
      // 使用Clipboard API将用户名称复制到剪贴板
      navigator.clipboard
        .writeText(tzUserName)
        .then(() => {
          this.$message({
            message: '环境用户名称已复制到剪贴板',
            type: 'success'
          });
        })
        .catch((err) => {
          this.$message({
            message: '复制失败,请手动复制',
            type: 'error'
          });
          console.error('复制失败:', err);
        });
    },
    // 复制监测设备名称
    copyDeviceName(deviceName) {
      // 使用Clipboard API将用户名称复制到剪贴板
      navigator.clipboard
        .writeText(deviceName)
        .then(() => {
          this.$message({
            message: '监测设备名称已复制到剪贴板',
            type: 'success'
          });
        })
        .catch((err) => {
          this.$message({
            message: '复制失败,请手动复制',
            type: 'error'
          });
          console.error('复制失败:', err);
        });
    },
    // 保存
    save() {
      const deviceMap = {
        id: this.data.id,
        ...this.device,
        ...this.svUser,
        ...this.tzUser
      };
      this.saveLoading = true;
      userMapApi
        .insertOrUpdate(this.area, deviceMap)
        .then((res) => {
          if (res.success) {
            this.$message({
              message: '保存成功',
              type: 'success'
            });
            this.$emit('save', deviceMap);
          }
        })
        .finally(() => {
          this.saveLoading = false;
        });
    }
  }
};