From 2f3ed8493285728d0f83d50f3a342dbad5a06f9f Mon Sep 17 00:00:00 2001
From: hcong <1050828145@qq.com>
Date: 星期二, 22 十月 2024 10:38:27 +0800
Subject: [PATCH] 问题修改乱码bug
---
src/views/fysp/check/components/CompDeviceShowTest.vue | 391 +++++++++++++++++++++++++++++++++----------------------
1 files changed, 232 insertions(+), 159 deletions(-)
diff --git a/src/views/fysp/check/components/CompDeviceShowTest.vue b/src/views/fysp/check/components/CompDeviceShowTest.vue
index 4c0ee18..fa6b910 100644
--- a/src/views/fysp/check/components/CompDeviceShowTest.vue
+++ b/src/views/fysp/check/components/CompDeviceShowTest.vue
@@ -20,110 +20,124 @@
</el-tabs>
</el-col>
</el-row>
- <el-collapse style="height: 100%" v-model="activeNames">
- <el-collapse-item v-for="item in formInfo" :name="item" style="height: 100%">
+ <el-collapse v-model="activeNames" style="border: 4px">
+ <el-collapse-item v-for="item in formInfo" :name="item.id" class="collapse-item-class">
+ <!-- <div v-if="activeNames.indexOf(item) !== -1" class="centerDiv">
+ <el-button link type="primary" size="large">[鐐瑰嚮缂╂斁]</el-button>
+ </div> -->
<template #title>
- <!-- 鎽樿鍐呭寮�濮� -->
- <div class="abstract_main" v-if="activeNames.indexOf(item) === -1">
- <span class="abstract_main_title">{{ item.name }}</span>
- <div class="abstract_other_item_inner">
- <!-- 渚涘簲鍟� -->
- <div class="abstract_other_item">
- <span class="abstract_other_title">{{ `渚涘簲鍟哷 }}</span>
- <span class="abstract_main_text">{{ item.supplier || '鏃�' }}</span>
- </div>
- <!-- 杩愮淮鍟� -->
- <div class="abstract_other_item">
- <span class="abstract_other_title">{{ `杩愮淮鍟哷 }}</span>
- <span class="abstract_main_text">{{ item.maintainer || '鏃�' }}</span>
- </div>
- <!-- 杩愯鐘舵�� -->
- <div class="abstract_other_item">
- <span class="abstract_other_title">{{ `杩愯鐘舵�乣 }}</span>
- <span class="abstract_main_text">{{
- getRunStatusValueByRunStatusKey(item.runningStatus) || '鏃�'
- }}</span>
- </div>
+ <div style="display: flex; width: 100%; justify-content: space-between">
+ <div style="">
+ <el-descriptions style="" :column="3" size="small" border>
+ <el-descriptions-item width="64px" label="绔欑偣鍚嶇О" :span="3">{{
+ item.name || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="渚涘簲鍟�">{{
+ item.supplier || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杩愮淮鍟�">{{
+ item.maintainer || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杩愮淮棰戞">
+ <el-select
+ v-model="item.maintainFrequency"
+ :disabled="isDisabled"
+ style="width: 150px"
+ >
+ <el-option
+ v-for="frequency of maintainFrequencysArray"
+ :key="frequency.key"
+ :label="frequency.value"
+ :value="frequency.key"
+ ></el-option>
+ </el-select>
+ </el-descriptions-item>
+ <el-descriptions-item label="杩愮淮浜哄憳">{{
+ item.maintainStaff || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杩愮淮鑱旂郴鏂瑰紡">{{
+ item.maintainTel || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="鍝佺墝鍨嬪彿">{{
+ item.brandModel || '鏃�'
+ }}</el-descriptions-item>
+ <el-descriptions-item label="杩愯鐘舵��">
+ <el-select
+ v-model="item.runningStatus"
+ :disabled="isDisabled"
+ style="width: 150px"
+ >
+ <el-option
+ v-for="status of runStatusArray"
+ :key="status.key"
+ :label="status.value"
+ :value="status.key"
+ ></el-option>
+ </el-select>
+ </el-descriptions-item>
+ </el-descriptions>
+ <!-- <div style="display: block">
+ <span class="abstract_main_title">{{ `绔欑偣鍚嶇О ` }}</span>
+ <span class="abstract_main_text">{{ item.name || '鏃�' }}</span>
+ </div> -->
+ </div>
+
+ <div style="display: flex">
+ <!-- <div class="sub-title">{{ item.name }}</div> -->
<!-- 鍥剧墖 -->
<div class="image-container">
- <el-image
- v-for="status in item._statusList"
- fit="cover"
- class="pic-style"
- :src="status._picUrl"
- :preview-src-list="Array.of(status._picUrl)"
- />
+ <div
+ class="block-div"
+ @click="onClickPic($event)"
+ v-for="(status, index) in item._statusList"
+ >
+ <el-image
+ v-if="index == 0"
+ fit="cover"
+ class="pic-style"
+ :src="status._picUrl"
+ :preview-src-list="Array.of(status._picUrl)"
+ />
+ <span class="abstract_pic_text" v-if="index == 0">{{
+ `鏈�鏂扮姸鎬佸浘鐗� ${status.dlCreateTime.slice(0, 10)}`
+ }}</span>
+ </div>
</div>
</div>
</div>
- <div v-else class="centerDiv">
- <el-button link type="primary" size="large">[鐐瑰嚮缂╂斁]</el-button>
- </div>
+ <!-- <el-descriptions class="margin-top" :title="item.name" :column="3" :size="size" border>
+ <el-descriptions-item label="渚涘簲鍟�">
+ {{ item.supplier || '鏃�' }}
+ </el-descriptions-item>
+ <el-descriptions-item label="杩愮淮鍟�">
+ {{ item.maintainer || '鏃�' }}
+ </el-descriptions-item>
+ <el-descriptions-item label="杩愯鐘舵��">
+ {{ getRunStatusValueByRunStatusKey(item.runningStatus) || '鏃�' }}
+ </el-descriptions-item>
+ </el-descriptions> -->
+ <!-- 鎽樿鍐呭寮�濮� -->
<!-- 鎽樿鍐呭缁撴潫 -->
</template>
<!-- 璇︾粏鍐呭寮�濮� -->
- <div class="sub-title">{{ item.name }}</div>
<el-form :model="item" class="form_class">
- <!-- <el-form-item label="绔欑偣">
- <el-input v-model="item.name" :disabled="isDisabled"></el-input>
- </el-form-item> -->
- <el-form-item label="渚涘簲鍟�">
- <el-input v-model="item.supplier" :disabled="isDisabled"></el-input>
- </el-form-item>
- <el-form-item label="杩愮淮鍟�">
- <el-input v-model="item.maintainer" :disabled="isDisabled"></el-input>
- </el-form-item>
- <el-form-item label="杩愮淮棰戞">
- <el-select v-model="item.maintainFrequency" :disabled="isDisabled">
- <el-option
- v-for="frequency of maintainFrequencysArray"
- :key="frequency.key"
- :label="frequency.value"
- :value="frequency.key"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="杩愮淮浜哄憳">
- <el-input v-model="item.maintainStaff" :disabled="isDisabled"></el-input>
- </el-form-item>
- <el-form-item label="杩愮淮鑱旂郴鏂瑰紡">
- <el-input v-model="item.maintainTel" :disabled="isDisabled"></el-input>
- </el-form-item>
- <el-form-item label="鍝佺墝鍨嬪彿">
- <el-input v-model="item.brandModel" :disabled="isDisabled"></el-input>
- </el-form-item>
- <el-form-item label="杩愯鐘舵��">
- <el-select v-model="item.runningStatus" :disabled="isDisabled">
- <el-option
- v-for="status of runStatusArray"
- :key="status.key"
- :label="status.value"
- :value="status.key"
- ></el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="鎵�鏈夋潈">
- <el-select v-model="item.ownership" :disabled="isDisabled">
- <el-option
- v-for="ownership of ownershipArray"
- :key="ownership.key"
- :label="ownership.value"
- :value="ownership.key"
- ></el-option>
- </el-select>
- </el-form-item>
<el-form-item label="鐘舵��">
<el-tabs tab-position="top">
- <el-tab-pane v-for="(status, i) in item._statusList" :label="status.dlCreateTime.slice(0, 10)">
+ <el-tab-pane
+ v-for="(status, i) in item._statusList"
+ :label="status.dlCreateTime.slice(0, 10)"
+ >
<el-form :model="status" class="form-class">
- <el-form-item label="浣嶇疆">
- <el-input
+ <el-form-item label="浣嶇疆" style="margin-bottom: 10px">
+ <!-- <el-input
+ style="width: 250px;"
v-model="status.dlLocation"
:disabled="isDisabled"
class="form-item-class"
- ></el-input>
+ ></el-input> -->
+ {{ status.dlLocation }}
</el-form-item>
- <el-form-item label="缁忓害">
+ <!-- <el-form-item label="缁忓害">
<el-input
v-model="status.dlLongitude"
:disabled="isDisabled"
@@ -136,15 +150,21 @@
:disabled="isDisabled"
class="form-item-class"
></el-input>
- </el-form-item>
- <el-form-item>
+ </el-form-item> -->
+ <el-form-item label="鍥剧墖">
<!-- 鍥剧墖 -->
- <el-image
- fit="cover"
- class="pic-style"
- :src="status._picUrl"
- :preview-src-list="Array.of(status._picUrl)"
- />
+ <el-space>
+ <div v-if="status._paths && status._paths.length > 0">
+ <el-image
+ v-for="path in status._paths"
+ fit="cover"
+ class="pic-style"
+ :src="path"
+ :preview-src-list="Array.of(path)"
+ />
+ </div>
+ <el-empty v-else></el-empty>
+ </el-space>
</el-form-item>
</el-form>
</el-tab-pane>
@@ -161,6 +181,9 @@
</template>
<script>
+import dataMonitorDeviceTypeJs from './js/dataMonitorDeviceType.js';
+import dataProductionDeviceTypeJs from './js/dataProductionDeviceType.js';
+import dataTreatmentDeviceTypeJs from './js/dataTreatmentDeviceType.js';
import deviceApi from '@/api/fysp/deviceApi';
import { $fysp } from '@/api/index';
export default {
@@ -315,9 +338,6 @@
// 灞曠ず琛ㄥ崟鐨勮鎯呯殑鐐瑰嚮浜嬩欢
showDetail(item) {
item._isDetail = !item._isDetail;
- if (item._isDetail) {
- } else {
- }
},
init(scene) {
// 鐖剁粍浠朵富鍔ㄨ皟鐢ㄥ垵濮嬪寲瀛愮粍浠剁殑鏂规硶
@@ -336,18 +356,16 @@
// 灏嗕竴涓猨s瀵硅薄涓墍鏈塪i锛寃i锛宲i寮�澶寸殑灞炴�у叏閮ㄦ敼鎴愬幓鎺夎繖浜涘墠缂�骞朵笖閲嶆柊鍙樹负椹煎嘲寮忓懡鍚�
const newObj = {};
for (const key in obj) {
- if (obj.hasOwnProperty(key)) {
- let newKey = key;
- if (key.startsWith('di')) {
- newKey = key.substring(2);
- } else if (key.startsWith('wi')) {
- newKey = key.substring(2);
- } else if (key.startsWith('pi')) {
- newKey = key.substring(2);
- }
- newKey = newKey.charAt(0).toLowerCase() + newKey.slice(1);
- newObj[newKey] = obj[key];
+ let newKey = key;
+ if (key.startsWith('di')) {
+ newKey = key.substring(2);
+ } else if (key.startsWith('wi')) {
+ newKey = key.substring(2);
+ } else if (key.startsWith('pi')) {
+ newKey = key.substring(2);
}
+ newKey = newKey.charAt(0).toLowerCase() + newKey.slice(1);
+ newObj[newKey] = obj[key];
}
return newObj;
},
@@ -383,6 +401,7 @@
return;
}
element = this.convertKeys(result.data[index]);
+ element = this.setDeviceType(element);
element._picUrls = imgPaths;
for (let index = 0; index < statusData.length; index++) {
const statusItem = statusData[index];
@@ -397,10 +416,36 @@
}
});
},
+ setDeviceType(element) {
+ var type = [];
+ switch (this.currSelect.topDeviceTypeId) {
+ case 0:
+ type = dataMonitorDeviceTypeJs.toLabel(element.sceneTypeId, Array.of(element.subtypeId));
+ break;
+ case 1:
+ type = dataTreatmentDeviceTypeJs.toLabel(
+ element.sceneTypeId,
+ Array.of(element.subtypeId)
+ );
+ break;
+ case 2:
+ type = dataProductionDeviceTypeJs.toLabel(
+ element.sceneTypeId,
+ Array.of(element.subtypeId)
+ );
+ break;
+ }
+ if (type.length > 0) {
+ element._typename = type[0];
+ }
+ return element;
+ },
// 淇濆瓨鐘舵�佷俊鎭�
saveStatus(device, status) {
var _picUrl = $fysp.imgUrl + status.dlPicUrl;
status._picUrl = _picUrl;
+ status._paths = _picUrl.split(';');
+ device._picUrls.push(_picUrl);
if ('_statusList' in device) {
device._statusList.push(status);
} else {
@@ -416,34 +461,32 @@
modifyObjectKeys(obj) {
const newObj = {};
for (const key in obj) {
- if (obj.hasOwnProperty(key)) {
- // 璺宠繃浠� 'dl' 鎴� '_' 寮�澶寸殑灞炴��
- if (key.startsWith('dl') || key.startsWith('_')) {
+ // 璺宠繃浠� 'dl' 鎴� '_' 寮�澶寸殑灞炴��
+ if (key.startsWith('dl') || key.startsWith('_')) {
+ newObj[key] = obj[key];
+ continue;
+ }
+ // 鏍规嵁 topDeviceTypeId 娣诲姞鍓嶇紑
+ let prefix = '';
+ switch (this.currSelect.topDeviceTypeId) {
+ case 0:
+ prefix = 'di';
+ break;
+ case 1:
+ prefix = 'pi';
+ break;
+ case 2:
+ prefix = 'wi';
+ break;
+ default:
+ // 濡傛灉 topDeviceTypeId 涓嶆槸 0, 1, 鎴� 2锛屼笉娣诲姞鍓嶇紑
newObj[key] = obj[key];
continue;
- }
- // 鏍规嵁 topDeviceTypeId 娣诲姞鍓嶇紑
- let prefix = '';
- switch (this.currSelect.topDeviceTypeId) {
- case 0:
- prefix = 'di';
- break;
- case 1:
- prefix = 'pi';
- break;
- case 2:
- prefix = 'wi';
- break;
- default:
- // 濡傛灉 topDeviceTypeId 涓嶆槸 0, 1, 鎴� 2锛屼笉娣诲姞鍓嶇紑
- newObj[key] = obj[key];
- continue;
- }
-
- // 娣诲姞鍓嶇紑骞惰浆鎹负椹煎嘲寮忓懡鍚�
- const newKey = `${prefix}${key.charAt(0).toUpperCase() + key.slice(1)}`;
- newObj[newKey] = obj[key];
}
+
+ // 娣诲姞鍓嶇紑骞惰浆鎹负椹煎嘲寮忓懡鍚�
+ const newKey = `${prefix}${key.charAt(0).toUpperCase() + key.slice(1)}`;
+ newObj[newKey] = obj[key];
}
return newObj;
},
@@ -457,14 +500,10 @@
generateIDeviceTypesMap() {},
// 鑾峰彇褰撳墠topType锛屽綋鍓峴ceneTypeId涓嬫墍鏈夌埗绫诲瀷
getAlliDeviceParentTypeArray() {
- console.log('topDeviceTypeId', this.currSelect.topDeviceTypeId);
-
var sceneTypeAndIDeviceTypesMap = this.iDeviceTypesMap.get(this.currSelect.topDeviceTypeId);
if (!sceneTypeAndIDeviceTypesMap) {
return '';
}
- console.log('sceneTypeId', this.scene.typeid);
- console.log('scene', this.scene);
var iDeviceTypesArray = sceneTypeAndIDeviceTypesMap.get(this.scene.typeid);
if (!iDeviceTypesArray) {
@@ -475,7 +514,6 @@
// 鑾峰彇璁惧绫诲瀷 topDeviceTypeId, sceneTypeId 鍜� 鑷韩鐨勪竴浜涘弬鏁�
getIDeviceParentTypeObj(device) {
var iDeviceTypesArray = this.getAlliDeviceParentTypeArray();
- console.log('iDeviceTypesArray', this.getAlliDeviceParentTypeArray());
var result;
iDeviceTypesArray.forEach((e) => {
if (e.value == device.typeId) {
@@ -486,10 +524,7 @@
},
// 鑾峰彇璁惧瀛愮被鍨� topDeviceTypeId, sceneTypeId 鍜� 鑷韩鐨勪竴浜涘弬鏁�
getIDeviceChildrenTypeObj(device) {
- console.log('device', device);
-
var parentType = this.getIDeviceParentTypeObj(device);
- console.log('parentType', this.getIDeviceParentTypeObj(device));
if (parentType == null || parentType == '' || !('children' in parentType)) {
return '';
@@ -499,12 +534,15 @@
return '';
}
let result;
- iDeviceTypesArray.forEach((e) => {
- if (e.value == device.typeId) {
- result = e;
- }
- });
+ // iDeviceTypesArray.forEach((e) => {
+ // if (e.value == device.typeId) {
+ // result = e;
+ // }
+ // });
return result;
+ },
+ onClickPic(e, item) {
+ e.stopPropagation();
}
}
};
@@ -512,16 +550,17 @@
<style scoped>
.image-container {
+ justify-content: flex-end;
display: flex;
- flex-direction: row-reverse;
- width: 100%;
- height: 200px;
- overflow: hidden; /* 纭繚鍥剧墖涓嶄細瓒呭嚭瀹瑰櫒 */
+ /* width: 300px; */
+ /* flex-direction: row-reverse; */
+ /* height: 225px; */
+ /* overflow: hidden; 纭繚鍥剧墖涓嶄細瓒呭嚭瀹瑰櫒 */
}
.pic-style {
- width: 180px;
- height: 180px;
- margin-right: 5%;
+ width: 150px;
+ height: 150px;
+ border-radius: 4px;
}
.card-style {
height: 400px;
@@ -541,35 +580,61 @@
border-radius: 50%;
}
.abstract_main {
- width: 100%;
+ width: 98%;
}
-.abstract_other_item {
+.abstract_main_item {
display: flex;
flex-direction: column;
margin-right: 50px;
margin-top: 10px;
- width: 20%;
+ /* width: 20%; */
+}
+.abstract_other_item {
+ /* display: flex;
+ flex-direction: column; */
+ /* margin-left: 50px; */
+ /* margin-top: 10px;
+ width: 100vh; */
+}
+.abstract_main_item_inner {
+ display: flex;
+ justify-content: center;
}
.abstract_other_item_inner {
margin-left: 10px;
display: flex;
}
.abstract_main_title {
- margin-left: -400px;
+ /* margin-left: -400px; */
color: #303133;
font-size: 16px;
+}
+.abstract_main_title {
+ color: #606266;
+ font-size: 13px;
+ margin-top: 10px;
}
.abstract_other_title {
color: #606266;
font-size: 13px;
+ margin-top: 45px;
}
.abstract_main_text {
color: #303133;
font-size: 17px;
margin-top: 5px;
}
+.abstract_pic_text {
+ display: block;
+ color: var(--el-text-color-secondary);
+ font-size: 14px;
+ /* margin-top: 20px; */
+}
+.block-div {
+ display: block;
+}
.form_class {
- margin-left: 10px;
+ /* margin-left: 10px; */
}
.el-collapse {
@@ -590,4 +655,12 @@
margin-bottom: 30px;
margin-left: 20px;
}
+.collapse-item-class {
+ height: 100%;
+ border: 5px;
+}
+
+::-webkit-scrollbar {
+ height: 0;
+}
</style>
--
Gitblit v1.9.3