Compare commits
2 Commits
3231df14d9
...
1307e1bddf
| Author | SHA1 | Date | |
|---|---|---|---|
| 1307e1bddf | |||
| 0ff3e4b1bc |
@ -2,13 +2,13 @@
|
||||
VITE_APP_TITLE = 云平台管理系统
|
||||
|
||||
# 生产环境配置 晶全1
|
||||
VITE_APP_ENV = 'https://www.cnxhyc.com'
|
||||
VITE_APP_ENV = 'production'
|
||||
|
||||
# 生产环境配置 富源晟2
|
||||
# VITE_APP_ENV = 'https://fuyuanshen.com/backend-fys'
|
||||
|
||||
# 应用访问路径 晶全1
|
||||
VITE_APP_CONTEXT_PATH = '/'
|
||||
VITE_APP_CONTEXT_PATH = '/PC/'
|
||||
|
||||
# 高德地图Key
|
||||
VITE_AMAP_KEY='84a12a692ae378effdf741e16d584cd3'
|
||||
@ -25,6 +25,8 @@ VITE_APP_SNAILJOB_ADMIN = '/snail-job'
|
||||
# 生产环境 晶全3 代理访问
|
||||
VITE_APP_BASE_API = 'https://www.cnxhyc.com/jq'
|
||||
|
||||
# VITE_APP_BASE_API = 'http://139.224.253.23:8000'
|
||||
|
||||
# 生产环境 富源晟3
|
||||
#VITE_APP_BASE_API = '/backend-fys'
|
||||
|
||||
|
||||
@ -59,7 +59,7 @@ const props = defineProps({
|
||||
// 大小限制(MB)
|
||||
fileSize: propTypes.number.def(200),
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf','apk','wgt']),
|
||||
fileType: propTypes.array.def(['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf','apk','wgt','html','mp3','mp4']),
|
||||
// 是否显示提示
|
||||
isShowTip: propTypes.bool.def(true),
|
||||
// 禁用组件（仅查看文件）
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
<el-collapse-item name="1">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" class="queryFormRef">
|
||||
<el-form-item label="设备类型" prop="deviceType">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型">
|
||||
<el-select v-model="queryParams.deviceType" placeholder="设备类型" clearable filterable>
|
||||
<el-option v-for="item in deviceTypeOptions" :key="item.value" :label="item.typeName" :value="item.deviceTypeId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@ -69,7 +69,7 @@
|
||||
:data="List"
|
||||
:height="Status.showSearch.length > 0 ? 'calc(100vh - 355px)' : 'calc(100vh - 255px)'"
|
||||
>
|
||||
<el-table-column type="selection" width="50" align="center" :selectable="isSelectable"/>
|
||||
<el-table-column type="selection" width="50" align="center" :selectable="isSelectable" />
|
||||
<el-table-column label="设备名称" align="center" prop="deviceName" />
|
||||
<el-table-column label="设备图片" align="center" prop="devicePic">
|
||||
<template #default="scope">
|
||||
@ -189,7 +189,7 @@
|
||||
<div class="Preview">
|
||||
<div class="imgContent" v-for="(item, index) in cEdit.fileParam">
|
||||
<img class="img" :src="item.src" />
|
||||
<div class="opt" @click.stop="DelImg(item,index,'fileParam')">
|
||||
<div class="opt" @click.stop="DelImg(item, index, 'fileParam')">
|
||||
<el-icon>
|
||||
<Delete />
|
||||
</el-icon>
|
||||
@ -207,7 +207,14 @@
|
||||
<div class="title">操作说明</div>
|
||||
<div class="imgs">
|
||||
<div class="Preview">
|
||||
<img onerror="this.style.display='none'" v-for="(item, index) in cEdit.fileOprat" class="img" :src="item.src" />
|
||||
<div class="imgContent" v-for="(item, index) in cEdit.fileOprat">
|
||||
<img class="img" :src="item.src" />
|
||||
<div class="opt" @click.stop="DelImg(item, index, 'fileOprat')">
|
||||
<el-icon>
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option center" @click.stop="showCheckFile('fileOprat')">添加</div>
|
||||
@ -231,8 +238,8 @@
|
||||
|
||||
<!-- 提示框 -->
|
||||
<el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
|
||||
<span>
|
||||
{{ Status.confirm.text }}
|
||||
<span v-html="Status.confirm.text">
|
||||
|
||||
</span>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
@ -248,7 +255,7 @@
|
||||
import api from '@/api/debugCenter/debugCenter';
|
||||
import common from '@/utils/common';
|
||||
import apiTypeAll from '@/api/equipmentManagement/device/index';
|
||||
import uploadHelper from '@/api/debugCenter/deviceApi';
|
||||
import uploadHelper from '@/api/debugCenter/deviceApi';
|
||||
|
||||
var fileInput = document.getElementById('fileInput');
|
||||
var fileInputs = {
|
||||
@ -293,7 +300,7 @@ var cEdit = reactive({
|
||||
fileParam: [],
|
||||
fileOprat: [],
|
||||
Video: '',
|
||||
fileIds:[]
|
||||
fileIds: []
|
||||
});
|
||||
//页码控件数据
|
||||
var pagin = reactive({
|
||||
@ -340,8 +347,7 @@ function handleQuery() {
|
||||
const isSelectable = (row: any) => {
|
||||
// 仅当在线状态（onlineStatus == 1）时允许选中
|
||||
return row.onlineStatus === 1;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function getList() {
|
||||
Status.loading = true;
|
||||
@ -425,10 +431,11 @@ function ShowMultiEdit(type: MideaType) {
|
||||
|
||||
setTimeout(dragImgAddEvt, 500);
|
||||
}
|
||||
|
||||
function ShowSingleEdit(item) {
|
||||
Status.ShowEditPop = true;
|
||||
//期待接口返回以下4个字段
|
||||
|
||||
|
||||
cEdit.deviceId = item.id;
|
||||
cEdit.deviceImei = item.deviceImei;
|
||||
cEdit.Video = item.Video;
|
||||
@ -454,7 +461,7 @@ function ShowSingleEdit(item) {
|
||||
return v.fileType == 1;
|
||||
})
|
||||
.map((v) => {
|
||||
return {id:v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
});
|
||||
|
||||
cEdit.fileParam = arr
|
||||
@ -462,7 +469,7 @@ function ShowSingleEdit(item) {
|
||||
return v.fileType == 2;
|
||||
})
|
||||
.map((v) => {
|
||||
return {id:v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
});
|
||||
|
||||
cEdit.fileBoot.src = '';
|
||||
@ -478,7 +485,7 @@ function CloseSingleEdit() {
|
||||
cEdit.fileBoot = { name: '', type: '', size: '', src: '', file: null };
|
||||
cEdit.fileOprat = [];
|
||||
cEdit.fileParam = [];
|
||||
cEdit.fileIds=[];
|
||||
cEdit.fileIds = [];
|
||||
}
|
||||
|
||||
//关闭上传框
|
||||
@ -575,7 +582,7 @@ function updaeLogo(ids, file, deviceType?: number) {
|
||||
}
|
||||
const finalDeviceType = deviceType || realDeviceType;
|
||||
const finalIds = Array.isArray(ids) ? ids : [ids];
|
||||
const finalFile = file || checkFile.file || cEdit.fileBoot.file;
|
||||
const finalFile = file || checkFile.file || cEdit.fileBoot.file;
|
||||
if (!finalFile || finalIds.length === 0) {
|
||||
return Promise.resolve({ code: 200, msg: '成功' });
|
||||
}
|
||||
@ -591,7 +598,7 @@ function SaveItemData() {
|
||||
var formData = new FormData();
|
||||
formData.append('deviceId', cEdit.deviceId);
|
||||
formData.append('deviceImei', cEdit.deviceImei);
|
||||
formData.append("fileIds",cEdit.fileIds);
|
||||
formData.append('fileIds', cEdit.fileIds);
|
||||
|
||||
cEdit.fileParam.forEach((v) => {
|
||||
if (v.file) {
|
||||
@ -615,11 +622,20 @@ function SaveItemData() {
|
||||
if (res[0].status == 'fulfilled' && res[1].status == 'fulfilled') {
|
||||
if (res[0].value.code == 200 && res[1].value.code == 200) {
|
||||
CloseSingleEdit();
|
||||
alert('操作成功');
|
||||
alert('<span class="green">操作成功</span>');
|
||||
return;
|
||||
}
|
||||
}
|
||||
alert('全部失败或部分失败');
|
||||
if(res[0].status == 'fulfilled' && res[0].value.code == 200){
|
||||
alert('<span class="green">产品参数、操作说明、操作视频保存成功</span>，<span class="red">开机画面保存失败</span>');
|
||||
return;
|
||||
}
|
||||
|
||||
if(res[1].status == 'fulfilled' && res[1].value.code == 200){
|
||||
alert('<span class="red">产品参数、操作说明、操作视频保存失败</span>，<span class="green">开机画面保存成功</span>');
|
||||
return;
|
||||
}
|
||||
alert('<span class="red">操作失败</span>');
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
@ -822,17 +838,15 @@ var hideConfirm = function () {
|
||||
};
|
||||
|
||||
//删除某个图片
|
||||
function DelImg(item,index,type){
|
||||
|
||||
if(item.id){
|
||||
confirm('您确认删除吗?',()=>{
|
||||
cEdit.fileIds.push(item.id);
|
||||
cEdit[type].splice(index,1);
|
||||
|
||||
});
|
||||
}else{
|
||||
cEdit[type].splice(index,1);
|
||||
}
|
||||
function DelImg(item, index, type) {
|
||||
if (item.id) {
|
||||
confirm('您确认删除吗?', () => {
|
||||
cEdit.fileIds.push(item.id);
|
||||
cEdit[type].splice(index, 1);
|
||||
});
|
||||
} else {
|
||||
cEdit[type].splice(index, 1);
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
@ -1079,8 +1093,8 @@ onMounted(() => {
|
||||
cursor: pointer;
|
||||
color: #bd2b2b;
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
line-height: 90px;
|
||||
text-align: center;
|
||||
line-height: 90px;
|
||||
}
|
||||
.SingEditContent .item .imgContent:hover .opt {
|
||||
display: block !important;
|
||||
@ -1093,5 +1107,4 @@ onMounted(() => {
|
||||
.red {
|
||||
color: rgba(224, 52, 52, 1);
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -34,19 +34,22 @@
|
||||
|
||||
<el-table v-loading="loading" border :data="deviceTypeList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="devicePic" label="设备图片">
|
||||
<template #default="scope">
|
||||
<el-popover placement="right" trigger="click">
|
||||
<template #reference>
|
||||
<img v-if="scope.row.devicePic" :src="scope.row.devicePic"
|
||||
style="width: 50px; height: 50px; cursor: pointer; object-fit: contain"
|
||||
class="hover:opacity-80 transition-opacity" />
|
||||
<img v-else src="@/assets/index/IMG.png" alt="" style="width: 40px; height: 40px;">
|
||||
</template>
|
||||
<img :src="scope.row.devicePic" style="max-width: 600px; max-height: 600px; object-fit: contain" />
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="devicePic" label="设备图片">
|
||||
<template #default="scope">
|
||||
<el-popover placement="right" trigger="click">
|
||||
<template #reference>
|
||||
<img
|
||||
v-if="scope.row.devicePic"
|
||||
:src="scope.row.devicePic"
|
||||
style="width: 50px; height: 50px; cursor: pointer; object-fit: contain"
|
||||
class="hover:opacity-80 transition-opacity"
|
||||
/>
|
||||
<img v-else src="@/assets/index/IMG.png" alt="" style="width: 40px; height: 40px" />
|
||||
</template>
|
||||
<img :src="scope.row.devicePic" style="max-width: 600px; max-height: 600px; object-fit: contain" />
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="型号名称" align="center" prop="typeName" />
|
||||
<el-table-column label="类型code" align="center" prop="appModelDictionary">
|
||||
<template #default="scope">
|
||||
@ -85,6 +88,9 @@
|
||||
<el-tooltip v-if="scope.row.id !== 1" content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="更多" placement="top">
|
||||
<el-button link type="primary" icon="More" @click="ShowSingleEdit(scope.row)"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@ -173,6 +179,74 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="Status.ShowEditPop" title="编辑" :draggable="true" width="50%">
|
||||
<div class="SingEditContent" v-loading="Status.fullLoading">
|
||||
<div class="Param item">
|
||||
<div class="title">产品参数</div>
|
||||
<div class="imgs">
|
||||
<div class="Preview">
|
||||
<div class="imgContent" v-for="(item, index) in cEdit.fileParam">
|
||||
<img class="img" :src="item.src" />
|
||||
<div class="opt" @click.stop="DelImg(item, index, 'fileParam')">
|
||||
<el-icon>
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option center" @click.stop="showCheckFile('fileParam')">添加</div>
|
||||
<div class="clear">
|
||||
<input type="file" accept="image/*" id="fileParam" class="displayNone" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="Oprat item">
|
||||
<div class="title">操作说明</div>
|
||||
<div class="imgs">
|
||||
<div class="Preview">
|
||||
<div class="imgContent" v-for="(item, index) in cEdit.fileOprat">
|
||||
<img class="img" :src="item.src" />
|
||||
<div class="opt" @click.stop="DelImg(item, index, 'fileOprat')">
|
||||
<el-icon>
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option center" @click.stop="showCheckFile('fileOprat')">添加</div>
|
||||
<div class="clear">
|
||||
<input type="file" accept="image/*" id="fileOprat" class="displayNone" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="Video item">
|
||||
<div class="title">操作视频</div>
|
||||
<div class="img fleft" style="width: calc(100% - 80px)">
|
||||
<el-input v-model="cEdit.Video" placeholder="输入网址" />
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center" style="margin-top: 20px">
|
||||
<el-button type="primary" @click="SaveItemData"> 确定 </el-button>
|
||||
<el-button type="primary" plain @click="CloseSingleEdit"> 取消 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 提示框 -->
|
||||
<el-dialog :width="300" :draggable="true" v-model="Status.confirm.Visible" :title="Status.confirm.title" center>
|
||||
<span>
|
||||
{{ Status.confirm.text }}
|
||||
</span>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="Status.confirm.OkCallback"> 确定 </el-button>
|
||||
<el-button v-show="Status.confirm.showCancel" @click="Status.confirm.cancelCallback">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -181,6 +255,8 @@ import api from '@/api/equipmentManagement/deviceType/index';
|
||||
import { deviceTypeQuery } from '@/api/equipmentManagement/deviceType/types';
|
||||
import { getDicts } from '@/api/system/dict/data';
|
||||
import { to } from 'await-to-js';
|
||||
import debug from '@/api/debugCenter/debugCenter';
|
||||
import common from '@/utils/common';
|
||||
import { ComponentInternalInstance, getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue';
|
||||
import {
|
||||
ElDialog,
|
||||
@ -228,7 +304,37 @@ const loadingIng = ref(false);
|
||||
const appmodelDictionaryOptions = ref<any[]>([]);
|
||||
const pcmodelDictionaryOptions = ref<any[]>([]);
|
||||
var fileC = null;
|
||||
var uploadFile=false;
|
||||
var uploadFile = false;
|
||||
|
||||
const Status = reactive<any>({
|
||||
ShowEditPop: false,
|
||||
fullLoading: false,
|
||||
confirm: {
|
||||
//弹出框的配置
|
||||
Visible: false,
|
||||
title: '',
|
||||
text: '',
|
||||
cancelCallback: null,
|
||||
OkCallback: null,
|
||||
showCancel: true
|
||||
}
|
||||
});
|
||||
|
||||
var cEdit = reactive({
|
||||
deviceId: '',
|
||||
deviceImei: '',
|
||||
fileBoot: { name: '', type: '', size: '', src: '', file: null },
|
||||
fileParam: [],
|
||||
fileOprat: [],
|
||||
Video: '',
|
||||
fileIds: []
|
||||
});
|
||||
var fileInput = document.getElementById('fileInput');
|
||||
var fileInputs = {
|
||||
fileParam: null,
|
||||
fileOprat: null
|
||||
};
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
@ -384,25 +490,22 @@ const submitForm = () => {
|
||||
locateMode: Number(form.value.locateMode),
|
||||
communicationMode: Number(form.value.communicationMode)
|
||||
};
|
||||
|
||||
|
||||
|
||||
let formData = new FormData();
|
||||
let keys=Object.keys(payload);
|
||||
|
||||
keys.forEach(key=>{
|
||||
if(key!=='devicePic'){
|
||||
if(payload[key]!==null && payload[key]!==undefined){
|
||||
formData.append(key,payload[key]);
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
let formData = new FormData();
|
||||
let keys = Object.keys(payload);
|
||||
|
||||
if(uploadFile && fileC && fileC.files.length){
|
||||
formData.append('file',fileC.files[0]);
|
||||
keys.forEach((key) => {
|
||||
if (key !== 'devicePic') {
|
||||
if (payload[key] !== null && payload[key] !== undefined) {
|
||||
formData.append(key, payload[key]);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (uploadFile && fileC && fileC.files.length) {
|
||||
formData.append('file', fileC.files[0]);
|
||||
}
|
||||
|
||||
|
||||
//如果要上传文件就用formData,不上传使用payload
|
||||
form.value.id ? await api.updateDeviceType(formData) : await api.addDeviceType(formData);
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
@ -421,7 +524,8 @@ function DropImg(item) {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
})
|
||||
.then(() => {
|
||||
form.value.devicePic = null;
|
||||
})
|
||||
.catch(() => {});
|
||||
@ -429,10 +533,9 @@ function DropImg(item) {
|
||||
|
||||
//选择图片
|
||||
function AddImg(item) {
|
||||
uploadFile=false;
|
||||
uploadFile = false;
|
||||
initControl();
|
||||
fileC.click();
|
||||
|
||||
}
|
||||
/**
|
||||
* 关闭用户弹窗
|
||||
@ -453,7 +556,7 @@ const resetForm = () => {
|
||||
|
||||
function initControl() {
|
||||
if (fileC) {
|
||||
fileC.value="";
|
||||
fileC.value = '';
|
||||
return;
|
||||
}
|
||||
|
||||
@ -462,11 +565,10 @@ function initControl() {
|
||||
if (this.files.length) {
|
||||
let file = this.files[0];
|
||||
if (file.type.indexOf('image/') === 0) {
|
||||
|
||||
let reader = new FileReader();
|
||||
|
||||
reader.onload = function (e) {
|
||||
uploadFile=true;
|
||||
reader.onload = function (e) {
|
||||
uploadFile = true;
|
||||
form.value.devicePic = e.target.result;
|
||||
};
|
||||
|
||||
@ -484,6 +586,233 @@ function initControl() {
|
||||
});
|
||||
}
|
||||
|
||||
function ShowSingleEdit(item) {
|
||||
debugger;
|
||||
Status.ShowEditPop = true;
|
||||
//期待接口返回以下4个字段
|
||||
|
||||
cEdit.deviceId = item.deviceTypeId;
|
||||
|
||||
// cEdit.fileBoot.src=item.fileBoot;
|
||||
|
||||
// cEdit.fileOprat.src = item.fileOprat;
|
||||
// cEdit.fileParam.src =item.fileParam;
|
||||
|
||||
debug.getDeviceInfoById(item.deviceTypeId).then((res) => {
|
||||
if (res.code == 200) {
|
||||
let video = res.data.appOperationVideoVoList.find((v) => {
|
||||
return v.videoUrl;
|
||||
});
|
||||
|
||||
if (video) {
|
||||
cEdit.Video = video.videoUrl;
|
||||
}
|
||||
|
||||
let arr = res.data.appBusinessFileVoList;
|
||||
|
||||
cEdit.fileOprat = arr
|
||||
.filter((v) => {
|
||||
return v.fileType == 1;
|
||||
})
|
||||
.map((v) => {
|
||||
return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
});
|
||||
|
||||
cEdit.fileParam = arr
|
||||
.filter((v) => {
|
||||
return v.fileType == 2;
|
||||
})
|
||||
.map((v) => {
|
||||
return { id: v.id, name: v.fileName, type: '', size: '', src: v.fileUrl, file: null };
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
setTimeout(addFileEvt, 500);
|
||||
}
|
||||
|
||||
function addFileEvt() {
|
||||
var checkImgOver = function (res, type) {
|
||||
cEdit[type].push(res);
|
||||
};
|
||||
if (!fileInputs.fileOprat || !fileInputs.fileParam) {
|
||||
fileInputs.fileOprat = document.getElementById('fileOprat');
|
||||
fileInputs.fileParam = document.getElementById('fileParam');
|
||||
|
||||
let keys = Object.keys(fileInputs);
|
||||
keys.forEach((k) => {
|
||||
fileInputs[k].addEventListener('change', () => {
|
||||
handleFiles(fileInputs[k].files).then((res) => {
|
||||
checkImgOver(res, k);
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 处理选择的文件
|
||||
function handleFiles(files) {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
if (files.length === 0) {
|
||||
reject();
|
||||
return;
|
||||
}
|
||||
|
||||
let file = files[0];
|
||||
if (file.size > 10485760) {
|
||||
alert('请选择10M以内的文件');
|
||||
reject();
|
||||
return;
|
||||
}
|
||||
if (file.type.indexOf('image/') == -1) {
|
||||
alert('只能选择图片文件');
|
||||
reject();
|
||||
return;
|
||||
}
|
||||
let json = { file: '', name: '', type: '', size: '', src: null };
|
||||
json.file = file;
|
||||
json.name = file.name;
|
||||
json.type = file.type.replace('image/', '');
|
||||
json.size = common.formatBytes(file.size);
|
||||
|
||||
const reader = new FileReader();
|
||||
|
||||
// 读取完成后设置图片源
|
||||
reader.onload = function (e) {
|
||||
json.src = e.target.result; // 结果是DataURL
|
||||
resolve(json);
|
||||
};
|
||||
reader.onerror = function (ex) {
|
||||
resolve(json);
|
||||
};
|
||||
|
||||
// 读取图片文件
|
||||
reader.readAsDataURL(file);
|
||||
} catch (ex) {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function DelImg(item, index, type) {
|
||||
|
||||
confirm('您确认删除吗?', () => {
|
||||
if (item.id) {
|
||||
cEdit.fileIds.push(item.id);
|
||||
cEdit[type].splice(index, 1);
|
||||
} else {
|
||||
cEdit[type].splice(index, 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showCheckFile(type) {
|
||||
if (!type) {
|
||||
fileInput.click();
|
||||
} else {
|
||||
let dom = fileInputs[type];
|
||||
if (!dom) {
|
||||
dom = document.getElementById(type);
|
||||
}
|
||||
dom.click();
|
||||
}
|
||||
}
|
||||
|
||||
//保存单个设备的数据
|
||||
function SaveItemData() {
|
||||
// if (!cEdit.fileBoot.file && !cEdit.fileParam.length && !cEdit.fileOprat.length && !cEdit.Video) {
|
||||
// alert('开机画面、产品参数、操作说明、操作视频四个项至少填写一项。');
|
||||
// return;
|
||||
// }
|
||||
Status.fullLoading = true;
|
||||
var formData = new FormData();
|
||||
formData.append('deviceId', cEdit.deviceId);
|
||||
formData.append('deviceImei', cEdit.deviceImei);
|
||||
formData.append('fileIds', cEdit.fileIds);
|
||||
|
||||
cEdit.fileParam.forEach((v) => {
|
||||
if (v.file) {
|
||||
formData.append('parameterFiles', v.file); //产品参数
|
||||
}
|
||||
});
|
||||
|
||||
cEdit.fileOprat.forEach((v) => {
|
||||
if (v.file) {
|
||||
formData.append('explanationFiles', v.file); //操作说明
|
||||
}
|
||||
});
|
||||
|
||||
formData.append('videoUrl', cEdit.Video); //操作视频
|
||||
|
||||
let promise1 = debug.updateItem(formData);
|
||||
|
||||
Promise.allSettled([promise1])
|
||||
.then((res) => {
|
||||
if (res[0].status == 'fulfilled') {
|
||||
if (res[0].value.code == 200) {
|
||||
CloseSingleEdit();
|
||||
alert('操作成功');
|
||||
return;
|
||||
}
|
||||
}
|
||||
alert('全部失败或部分失败');
|
||||
})
|
||||
.finally(() => {
|
||||
Status.fullLoading = false;
|
||||
});
|
||||
}
|
||||
|
||||
function CloseSingleEdit() {
|
||||
Status.ShowEditPop = false;
|
||||
cEdit.Video = '';
|
||||
cEdit.fileBoot = { name: '', type: '', size: '', src: '', file: null };
|
||||
cEdit.fileOprat = [];
|
||||
cEdit.fileParam = [];
|
||||
cEdit.fileIds = [];
|
||||
}
|
||||
|
||||
window.confirm = function (text, OK, cancel, title) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '此操作不可逆，您确定这样做吗？',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: true,
|
||||
cancelCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (cancel) {
|
||||
cancel();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
window.alert = function (text, OK, title) {
|
||||
let Cfg = {
|
||||
Visible: true,
|
||||
title: title ? title : '提示',
|
||||
text: text ? text : '不符合规则',
|
||||
OkCallback: () => {
|
||||
Status.confirm.Visible = false;
|
||||
if (OK) {
|
||||
OK();
|
||||
}
|
||||
},
|
||||
showCancel: false,
|
||||
cancelCallback: null
|
||||
};
|
||||
|
||||
Status.confirm = Cfg;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList(); // 初始化列表数据
|
||||
getDict();
|
||||
@ -504,7 +833,6 @@ onMounted(() => {
|
||||
background-color: #ffffff;
|
||||
border: 1px solid rgb(220, 223, 230);
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
.typeImgContent .img {
|
||||
@ -553,4 +881,256 @@ onMounted(() => {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fleft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fright {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.displayNone {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
min-height: calc(100vh - 84px);
|
||||
height: calc(100vh - 84px);
|
||||
background: rgba(247, 248, 252, 1);
|
||||
font-size: 16px;
|
||||
box-sizing: border-box;
|
||||
padding: 8px 20px;
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
|
||||
.topTool {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e1e2e5f2;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.percent100 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 0px 6px 0px rgba(0, 34, 96, 0.1);
|
||||
background: rgba(255, 255, 255, 1);
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
:deep .el-collapse-item__header {
|
||||
display: none !important;
|
||||
}
|
||||
:deep .el-collapse,
|
||||
:deep .el-collapse-item__wrap {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.MultiEditContent {
|
||||
height: 230px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: 1px dashed rgba(56, 64, 79, 0.4);
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#MultiEditContent.active {
|
||||
border-color: #3498db;
|
||||
background-color: #f0f7ff;
|
||||
}
|
||||
|
||||
.txt1 {
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.txt2 {
|
||||
color: rgba(56, 64, 79, 0.6);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
.txt3 {
|
||||
color: rgba(2, 124, 251, 1);
|
||||
cursor: pointer;
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.SingEditContent .item {
|
||||
width: 100%;
|
||||
min-height: 90px;
|
||||
height: auto;
|
||||
border-bottom: 1px dashed #e7e7e7;
|
||||
|
||||
padding: 12px 0px;
|
||||
}
|
||||
|
||||
.Multi .item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
|
||||
.SingEditContent .item.Video {
|
||||
height: 32px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.SingEditContent .item .title {
|
||||
width: 80px;
|
||||
float: left;
|
||||
color: rgba(56, 64, 79, 1);
|
||||
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.SingEditContent .item .imgs {
|
||||
width: calc(100% - 110px);
|
||||
float: left;
|
||||
min-height: 90px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.SingEditContent .item .option {
|
||||
width: 30px;
|
||||
float: left;
|
||||
height: 100%;
|
||||
color: rgba(2, 124, 251, 1);
|
||||
cursor: pointer;
|
||||
font-family: Microsoft YaHei;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 18px;
|
||||
letter-spacing: 0px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#dropArea.active {
|
||||
border-color: #3498db;
|
||||
background-color: #f0f7ff;
|
||||
}
|
||||
.imgPreview {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
padding-left: 100px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.imgPreview .img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
object-fit: contain;
|
||||
}
|
||||
.imgPreview .txt {
|
||||
padding-left: 10px;
|
||||
width: calc(100% - 60px);
|
||||
box-sizing: border-box;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.SingEditContent .Preview {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.SingEditContent .Preview .img {
|
||||
height: 90px;
|
||||
width: 160px;
|
||||
object-fit: contain;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #d3d5d7;
|
||||
}
|
||||
|
||||
.SingEditContent .item .imgContent {
|
||||
height: 90px;
|
||||
width: 160px;
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.SingEditContent .item .imgContent .opt {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
background-color: #00000091;
|
||||
display: none;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
height: 90px;
|
||||
width: 160px;
|
||||
cursor: pointer;
|
||||
color: #bd2b2b;
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
line-height: 90px;
|
||||
}
|
||||
.SingEditContent .item .imgContent:hover .opt {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.green {
|
||||
color: rgba(0, 165, 82, 1);
|
||||
}
|
||||
|
||||
.red {
|
||||
color: rgba(224, 52, 52, 1);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -141,6 +141,7 @@
|
||||
import request from '@/utils/request';
|
||||
import common from '@/utils/common';
|
||||
import api from '@/api/equipmentManagement/device/shareManage';
|
||||
import { dataURLtoImage } from 'image-conversion';
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
@ -211,18 +212,172 @@ var dic = reactive({
|
||||
});
|
||||
|
||||
|
||||
var power = computed(() => {
|
||||
let arr = [];
|
||||
let keys = Object.keys(dic);
|
||||
keys.forEach((key) => {
|
||||
arr.push({ label: dic[key], value: key });
|
||||
});
|
||||
return arr;
|
||||
});
|
||||
var power =ref([]);
|
||||
|
||||
function calcPower() {
|
||||
|
||||
|
||||
let array = [{
|
||||
value: "1",
|
||||
label: "灯光模式",
|
||||
checked: false,
|
||||
type: ['BJQ6170', 'HBY670','HBY102','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "2",
|
||||
label: "激光模式",
|
||||
checked: false,
|
||||
type: ['BJQ6170']
|
||||
},
|
||||
{
|
||||
value: "3",
|
||||
label: "开机画面",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "4",
|
||||
label: "人员信息登记",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670','BJQ6155','HBY650','BJQ7305','61XH55']
|
||||
},
|
||||
{
|
||||
value: "5",
|
||||
label: "发送信息",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670']
|
||||
},
|
||||
{
|
||||
value: "6",
|
||||
label: "产品信息",
|
||||
checked: false,
|
||||
type: ['HBY210', 'BJQ6170', 'HBY670']
|
||||
}, {
|
||||
value: "41",
|
||||
label: "静电探测",
|
||||
checked: false,
|
||||
type: ['HBY670','HBY650']
|
||||
}, {
|
||||
value: "42",
|
||||
label: "SOS",
|
||||
checked: false,
|
||||
type: ['HBY670','BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "43",
|
||||
label: "联机设备",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "44",
|
||||
label: "报警声音",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "45",
|
||||
label: "自动报警",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "46",
|
||||
label: "手动报警",
|
||||
checked: false,
|
||||
type: ['HBY210','HBY102']
|
||||
},
|
||||
{
|
||||
value: "47",
|
||||
label: "报警时长",
|
||||
checked: false,
|
||||
type: ['HBY210']
|
||||
},
|
||||
{
|
||||
value: "48",
|
||||
label: "物体感应",
|
||||
checked: false,
|
||||
type: ['HBY102']
|
||||
},
|
||||
{
|
||||
value: "49",
|
||||
label: "联机模式",
|
||||
checked: false,
|
||||
type: ['HBY102']
|
||||
},
|
||||
|
||||
{
|
||||
value: "50",
|
||||
label: "报警模式",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "51",
|
||||
label: "警示灯",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "52",
|
||||
label: "语音管理",
|
||||
checked: false,
|
||||
type: ['HBY100','HBY100-J']
|
||||
},
|
||||
|
||||
{
|
||||
value: "53",
|
||||
label: "箭头模式",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "54",
|
||||
label: "配组设置",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "55",
|
||||
label: "修改信道",
|
||||
checked: false,
|
||||
type: ['BJQ4877']
|
||||
},
|
||||
{
|
||||
value: "56",
|
||||
label: "灯光类型设置",
|
||||
checked: false,
|
||||
type: ['HBY100-J']
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
let f=array.filter(v=>{
|
||||
if(v.type.indexOf(data.value.typeName)>-1){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
})
|
||||
|
||||
power.value=f;
|
||||
|
||||
// let arr = [];
|
||||
// let keys = Object.keys(dic);
|
||||
|
||||
// keys.forEach((key) => {
|
||||
// arr.push({ label: dic[key], value: key });
|
||||
// });
|
||||
// return arr;
|
||||
};
|
||||
|
||||
|
||||
//打开编辑
|
||||
function ShowEdit() {
|
||||
Status.ShowEditPop = true;
|
||||
getUsrs();
|
||||
calcPower();
|
||||
}
|
||||
//关闭编辑
|
||||
function CloseEdit() {
|
||||
@ -276,6 +431,7 @@ function SaveFormData(type) {
|
||||
}
|
||||
|
||||
function getPower(item) {
|
||||
|
||||
let str = [];
|
||||
if (item && item.permission) {
|
||||
let arr = item.permission.split(',');
|
||||
|
||||
@ -4,25 +4,25 @@
|
||||
<div>
|
||||
<h2>数据总览</h2>
|
||||
<div class="data-item">
|
||||
<div class="data_bck">
|
||||
<div class="data_bck data">
|
||||
<div class="number">
|
||||
<span>{{ DataOverview.devicesNumber }}</span> 个
|
||||
</div>
|
||||
<div class="title_number">设备数量</div>
|
||||
</div>
|
||||
<div class="data_green">
|
||||
<div class="data_green data">
|
||||
<div class="number">
|
||||
<span>{{ DataOverview.equipmentOnline }}</span> 个
|
||||
</div>
|
||||
<div class="title_number">在线设备</div>
|
||||
</div>
|
||||
<div class="data_orgine">
|
||||
<div class="data_orgine data">
|
||||
<div class="number">
|
||||
<span>{{ DataOverview.binding }}</span> 个
|
||||
</div>
|
||||
<div class="title_number">已绑定设备</div>
|
||||
</div>
|
||||
<div class="data_red">
|
||||
<div class="data_red data">
|
||||
<div class="number">
|
||||
<span>{{ DataOverview.equipmentAbnormal }}</span> 个
|
||||
</div>
|
||||
@ -501,6 +501,10 @@ onUnmounted(() => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.data,.content-row,.region-chart-card{
|
||||
box-shadow: 0px 0px 12px 0px #3c3c3c2b;
|
||||
}
|
||||
.home {
|
||||
padding: 10px 20px 10px 20px;
|
||||
background-color: #f5f7fa;
|
||||
|
||||
Reference in New Issue
Block a user