| | |
| | | <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 |
| | |
| | | <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> |
| | |
| | | <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)" /> |
| | |
| | | <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)" /> |
| | |
| | | |
| | | <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 }, |
| | |
| | | // 检索范围(包含行政区划、场景类型) |
| | | area: Object |
| | | }, |
| | | emits: ['save'], |
| | | data() { |
| | | return { |
| | | // 监测设备 |
| | |
| | | // 监管用户 |
| | | svUser: {}, |
| | | // 环境用户 |
| | | tzUser: {} |
| | | tzUser: {}, |
| | | // 保存loading |
| | | saveLoading: false |
| | | }; |
| | | }, |
| | | watch: { |
| | |
| | | }, |
| | | 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; |
| | |
| | | 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; |
| | |
| | | callback(); |
| | | }); |
| | | }, |
| | | selectDevice() {}, |
| | | selectDevice(row, click) { |
| | | const p = { |
| | | deviceCode: row.deviceCode, |
| | | deviceName: row.deviceName |
| | | }; |
| | | click(p); |
| | | }, |
| | | selectSVUser(row, click) { |
| | | const p = { |
| | | svUserId: row.guid, |
| | |
| | | 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; |
| | | }); |
| | | } |
| | | } |
| | | }; |