修改测试用例
This commit is contained in:
@@ -89,39 +89,18 @@
|
||||
</vxe-column>
|
||||
<vxe-column field="version" title="版本信息"></vxe-column>
|
||||
<vxe-column field="ip" title="网络参数"></vxe-column>
|
||||
<!-- <vxe-column field="baseFlowMeal" title="基础套餐(MB)"></vxe-column>
|
||||
<vxe-column field="reamFlowMeal" title="扩展套餐(MB)"></vxe-column>
|
||||
<vxe-column title="剩余流量(MB)">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.level === 4" type="primary">
|
||||
{{
|
||||
row.level === 4
|
||||
? (row.baseFlowMeal + row.reamFlowMeal - row.statisValue).toFixed(2)
|
||||
: ''
|
||||
}}
|
||||
</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column title="流量使用占比(%)">
|
||||
<template #default="{ row }">
|
||||
{{
|
||||
row.level === 4
|
||||
? ((row.statisValue / (row.baseFlowMeal + row.reamFlowMeal)) * 100).toFixed(2)
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
</vxe-column> -->
|
||||
|
||||
<vxe-column field="runFlag" title="终端状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.runFlag === 0" type="success" size="small">投运</el-tag>
|
||||
<el-tag v-if="row.runFlag === 1" type="warning" size="small">检修</el-tag>
|
||||
<el-tag v-if="row.runFlag === 2" type="danger" size="small">停运</el-tag>
|
||||
<el-tag v-if="row.runFlag === 0" type="success" :disable-transitions="true" size="small">投运</el-tag>
|
||||
<el-tag v-if="row.runFlag === 1" type="warning" :disable-transitions="true" size="small">检修</el-tag>
|
||||
<el-tag v-if="row.runFlag === 2" type="danger" :disable-transitions="true" size="small">停运</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="comFlag" title="通讯状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.comFlag === 0" type="danger" size="small">中断</el-tag>
|
||||
<el-tag v-if="row.comFlag === 1" type="success" size="small">正常</el-tag>
|
||||
<el-tag v-if="row.comFlag === 0" type="danger" :disable-transitions="true" size="small">中断</el-tag>
|
||||
<el-tag v-if="row.comFlag === 1" type="success" :disable-transitions="true" size="small">正常</el-tag>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="160">
|
||||
|
||||
@@ -53,23 +53,15 @@
|
||||
修改提交
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item style="right: 500px; position: absolute; overflow: hidden">
|
||||
<LocationInformation style="width: 16px; margin-right: 8px; color: #396" />
|
||||
<span style="font-size: 16px; font-weight: bold; color: #396">当前操作节点:</span>
|
||||
</el-form-item>
|
||||
<el-form-item style="right: 0; position: absolute; overflow: hidden">
|
||||
|
||||
<div class="title">
|
||||
<LocationInformation style="width: 16px; margin-right: 8px; color: #396" />
|
||||
<span style="font-size: 16px; font-weight: bold; color: #396">当前操作节点:</span>
|
||||
|
||||
<div class="title" :class="titleList.length > 5 ? 'titleScroll' : ''">
|
||||
<span v-for="(item, index) in titleList">{{ index == 0 ? '' : ' > ' }}{{ item }}</span>
|
||||
</div>
|
||||
<!-- <i style="font-size: 20px; color: #396" icon="el-icon-LocationInformation"></i> -->
|
||||
|
||||
<!-- <div style="float: right">
|
||||
<el-breadcrumb separator-icon="el-icon-ArrowRightBold" style="font-weight: bold">
|
||||
<el-breadcrumb-item v-for="item in titleList" :key="item">
|
||||
{{ item }}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div> -->
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div id="scrollBox" :style="{ height: Height.height }" style="overflow-y: auto">
|
||||
@@ -1609,13 +1601,12 @@
|
||||
placeholder="请输入电网侧变电站"
|
||||
></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item class="form-item" label="实际安裝粒置:">
|
||||
|
||||
<el-form-item class="form-item" label="实际安装位置:">
|
||||
<el-select
|
||||
filterable
|
||||
v-model="lineItem.actualArea"
|
||||
placeholder="请选择实际安裝粒置"
|
||||
:disabled="pageStatus == 1"
|
||||
placeholder="请选择实际安装位置"
|
||||
:disabled="pageStatus == 1"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
@@ -2033,7 +2024,11 @@ const latff: any = ref((rule: any, value: any, callback: any) => {
|
||||
}
|
||||
})
|
||||
const plevel = ref(0)
|
||||
const nodeDataList=ref()
|
||||
const nodeEventList=ref()
|
||||
const nodeClick = (e: anyObj, data: any) => {
|
||||
nodeDataList.value = data
|
||||
nodeEventList.value = e
|
||||
plevel.value = data.data.plevel
|
||||
treeClickCount.value++
|
||||
if (treeClickCount.value > 2) return
|
||||
@@ -2355,8 +2350,10 @@ const next = async () => {
|
||||
const black = () => {
|
||||
pageStatus.value = 1
|
||||
busBarIndex.value = '0'
|
||||
deviceIndex.value = '0';
|
||||
lineIndex.value = '0';
|
||||
deviceIndex.value = '0'
|
||||
lineIndex.value = '0'
|
||||
nodeClick(nodeEventList.value,nodeDataList.value)
|
||||
|
||||
}
|
||||
// 确认提交
|
||||
const onsubmit = () => {
|
||||
@@ -2880,58 +2877,107 @@ const evaluate = (node: any) => {
|
||||
evaluate(node.parent)
|
||||
}
|
||||
}
|
||||
const selectChanged = (value: any) => {
|
||||
if (value === '3d68ceef26a579efe2fe0cdc654911b7') {
|
||||
setTheDefaultValue(10, 0.38 * 1000, 0.38 * 100)
|
||||
|
||||
//750kv
|
||||
} else if (value === '4cf2d844c47a15a1c16a65b4bbfd1b0e') {
|
||||
setTheDefaultValue(7000, 750 * 1000, 750 * 100)
|
||||
|
||||
//6kv
|
||||
} else if (value === '37b81bf8aa0fd54098716da3fc0ee433') {
|
||||
setTheDefaultValue(100, 6 * 1000, 6 * 100)
|
||||
|
||||
//10kv
|
||||
} else if (value === 'e3da890104e3c4ae1f005021411a1fd7') {
|
||||
setTheDefaultValue(100, 10 * 1000, 10 * 100)
|
||||
|
||||
//20kv
|
||||
} else if (value === '87065e15765e5899114a6d6b9e4fb3cb') {
|
||||
setTheDefaultValue(200, 20 * 1000, 20 * 100)
|
||||
|
||||
//35kv
|
||||
} else if (value === '8529cfa11356a0666afd3f9fa4da09a4') {
|
||||
setTheDefaultValue(250, 35 * 1000, 35 * 100)
|
||||
|
||||
//66kv
|
||||
} else if (value === '9ce75596a3368da4adf3374b4fc3b619') {
|
||||
setTheDefaultValue(500, 66 * 1000, 66 * 100)
|
||||
|
||||
//110kv
|
||||
} else if (value === 'e96d74b79bd50ad0bc00a405246f1e1f') {
|
||||
setTheDefaultValue(750, 110 * 1000, 110 * 100)
|
||||
|
||||
//220kv
|
||||
} else if (value === '1b7b58ed8fcc2992b95334eaa9010c41') {
|
||||
setTheDefaultValue(2000, 220 * 1000, 220 * 100)
|
||||
|
||||
//330kv
|
||||
} else if (value === 'c1b37350a67f5e229a1f96ace0ad04dc') {
|
||||
setTheDefaultValue(3000, 330 * 1000, 330 * 100)
|
||||
|
||||
//500kv
|
||||
} else if (value === '1fa650685c77db1656c70f9db4a2edc6') {
|
||||
setTheDefaultValue(4500, 500 * 1000, 500 * 100)
|
||||
|
||||
//1000kv
|
||||
} else if (value === '674cf02fb3fcfd9f99fd786cfca090df') {
|
||||
setTheDefaultValue(9000, 1000 * 1000, 1000 * 100)
|
||||
} else {
|
||||
setTheDefaultValue(10, 10, 10)
|
||||
const selectChanged = async (value: any) => {
|
||||
let num: any = voltageLevelArr.filter(item => item.id == value)[0].value
|
||||
let capacity = 10
|
||||
switch (num) {
|
||||
case '500':
|
||||
capacity = 4500
|
||||
break
|
||||
case '330':
|
||||
capacity = 3000
|
||||
break
|
||||
case '220':
|
||||
capacity = 2000
|
||||
break
|
||||
case '110':
|
||||
capacity = 750
|
||||
break
|
||||
case '35':
|
||||
capacity = 259
|
||||
break
|
||||
case '10':
|
||||
capacity = 100
|
||||
break
|
||||
case '6':
|
||||
capacity = 100
|
||||
break
|
||||
case '0.38':
|
||||
capacity = 10
|
||||
break
|
||||
case '20':
|
||||
capacity = 200
|
||||
break
|
||||
case '66':
|
||||
capacity = 500
|
||||
break
|
||||
case '750':
|
||||
capacity = 7000
|
||||
break
|
||||
case '800':
|
||||
capacity = 7000
|
||||
break
|
||||
case '1000':
|
||||
capacity = 9000
|
||||
break
|
||||
}
|
||||
|
||||
setvoltageDev(voltageLevelArr.filter(item => item.id == value)[0].value)
|
||||
setTimeout(() => {
|
||||
setTheDefaultValue(capacity, num * 1000, num < 1 ? num * 1000 : 100)
|
||||
setvoltageDev(num)
|
||||
}, 0)
|
||||
|
||||
// // 0.38
|
||||
// if (value === '3d68ceef26a579efe2fe0cdc654911b7') {
|
||||
// setTheDefaultValue(10, 0.38 * 1000, 0.38 * 1000)
|
||||
|
||||
// //750kv
|
||||
// } else if (value === '4cf2d844c47a15a1c16a65b4bbfd1b0e') {
|
||||
// setTheDefaultValue(7000, 750 * 1000, 100)
|
||||
|
||||
// //6kv
|
||||
// } else if (value === '37b81bf8aa0fd54098716da3fc0ee433') {
|
||||
// setTheDefaultValue(100, 6 * 1000, 100)
|
||||
|
||||
// //10kv
|
||||
// } else if (value === 'e3da890104e3c4ae1f005021411a1fd7') {
|
||||
// setTheDefaultValue(100, 10 * 1000, 100)
|
||||
|
||||
// //20kv
|
||||
// } else if (value === '87065e15765e5899114a6d6b9e4fb3cb') {
|
||||
// setTheDefaultValue(200, 20 * 1000, 100)
|
||||
|
||||
// //35kv
|
||||
// } else if (value === '8529cfa11356a0666afd3f9fa4da09a4') {
|
||||
// setTheDefaultValue(250, 35 * 1000, 100)
|
||||
|
||||
// //66kv
|
||||
// } else if (value === '9ce75596a3368da4adf3374b4fc3b619') {
|
||||
// setTheDefaultValue(500, 66 * 1000, 100)
|
||||
|
||||
// //110kv
|
||||
// } else if (value === 'e96d74b79bd50ad0bc00a405246f1e1f') {
|
||||
// setTheDefaultValue(750, 110 * 1000, 100)
|
||||
|
||||
// //220kv
|
||||
// } else if (value === '1b7b58ed8fcc2992b95334eaa9010c41') {
|
||||
// setTheDefaultValue(2000, 220 * 1000, 100)
|
||||
|
||||
// //330kv
|
||||
// } else if (value === 'c1b37350a67f5e229a1f96ace0ad04dc') {
|
||||
// setTheDefaultValue(3000, 330 * 1000, 100)
|
||||
|
||||
// //500kv
|
||||
// } else if (value === '1fa650685c77db1656c70f9db4a2edc6') {
|
||||
// setTheDefaultValue(4500, 500 * 1000, 100)
|
||||
|
||||
// //1000kv
|
||||
// } else if (value === '674cf02fb3fcfd9f99fd786cfca090df') {
|
||||
// setTheDefaultValue(9000, 1000 * 1000, 100)
|
||||
// } else {
|
||||
// setTheDefaultValue(10, 1, 1)
|
||||
// }
|
||||
// setvoltageDev(voltageLevelArr.filter(item => item.id == value)[0].value)
|
||||
}
|
||||
|
||||
const setTheDefaultValue = (capacity: number, pt1: number, pt2: number) => {
|
||||
@@ -3005,10 +3051,10 @@ const area = () => {
|
||||
month = '0' + (month + 1)
|
||||
}
|
||||
let day: any = data.getDate()
|
||||
if (day >= 10) {
|
||||
day = day
|
||||
if (day >= 10) {
|
||||
day = day
|
||||
} else {
|
||||
day = '0' + (day )
|
||||
day = '0' + day
|
||||
}
|
||||
deviceBODetail.value.thisTimeCheck = year + '-' + month + '-' + day
|
||||
deviceBODetail.value.loginTime = year + '-' + month + '-' + day
|
||||
@@ -3087,9 +3133,12 @@ area()
|
||||
}
|
||||
.title {
|
||||
width: 500px;
|
||||
overflow: hidden;
|
||||
// display: flex;
|
||||
white-space: nowrap;
|
||||
font-weight: bold;
|
||||
}
|
||||
.titleScroll {
|
||||
animation: scroll 10s linear infinite; /* 滚动动画 */
|
||||
}
|
||||
@keyframes scroll {
|
||||
|
||||
@@ -114,7 +114,7 @@
|
||||
label="装机容量(MW)"
|
||||
|
||||
>
|
||||
{{ proviteData.ratePower }}
|
||||
{{ proviteData?.ratePower }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item
|
||||
label="PCC供电设备容量(MVA)"
|
||||
|
||||
@@ -26,10 +26,10 @@
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Plus" type="primary" @click="addFormModel">新增</el-button>
|
||||
<el-button icon="el-icon-Delete" type="primary" @click="deleteEven">删除</el-button>
|
||||
<el-button icon="el-icon-Download" type="primary" @click="exportExcelTemplate" :loading="loading">
|
||||
<!-- <el-button icon="el-icon-Download" type="primary" @click="exportExcelTemplate" :loading="loading">
|
||||
模板下载
|
||||
</el-button>
|
||||
<el-button icon="el-icon-Upload" type="primary" @click="importUserData">批量导入</el-button>
|
||||
<el-button icon="el-icon-Upload" type="primary" @click="importUserData">批量导入</el-button> -->
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" />
|
||||
|
||||
@@ -3,12 +3,12 @@
|
||||
|
||||
<TableHeader datePicker area showExport>
|
||||
<template #select>
|
||||
<el-form-item label="统计类型:">
|
||||
<!-- <el-form-item label="统计类型:">
|
||||
<el-select v-model="tableStore.table.params.statisticalType" placeholder="请选择统计类型" value-key="id">
|
||||
<el-option v-for="item in classificationData" :key="item.id" :label="item.name" :value="item">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="电压等级:">
|
||||
<el-select v-model="tableStore.table.params.scale" filterable multiple collapse-tags clearable
|
||||
placeholder="请选择电压等级" value-key="id">
|
||||
|
||||
@@ -91,7 +91,6 @@ onMounted(() => {
|
||||
})
|
||||
const handleNodeClick = (data: any, node: any) => {
|
||||
if (data.level === 6) {
|
||||
console.log('🚀 ~ handleNodeClick ~ data:', data)
|
||||
monitoringPoint.setValue('lineId', data.id)
|
||||
monitoringPoint.setValue('pid', data.pids)
|
||||
monitoringPoint.setValue('lineName', data.alias)
|
||||
|
||||
@@ -167,14 +167,14 @@ const init = () => {
|
||||
if (formData.condition.length == 0) {
|
||||
return ElMessage.warning('请选择指标类型')
|
||||
}
|
||||
loading.value = true
|
||||
|
||||
formData.lineId = checked.value ? monitoringPoint.state.lineIds : [monitoringPoint.state.lineId]
|
||||
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||
|
||||
if (formData.lineId.length > 3) {
|
||||
return ElMessage.warning('最多只能选择3个监测点')
|
||||
}
|
||||
loading.value = true
|
||||
let directionValue = formData.condition.findIndex(item => {
|
||||
if (item === '39') {
|
||||
item = '50'
|
||||
@@ -1695,6 +1695,8 @@ const getEcharts = () => {
|
||||
echarts.connect('group')
|
||||
}
|
||||
const conditionChange = () => {
|
||||
console.log(123)
|
||||
|
||||
//判断一个指标时
|
||||
if (formData.condition.length == 1) {
|
||||
if (
|
||||
|
||||
@@ -15,12 +15,7 @@
|
||||
<el-col :span="12">
|
||||
<my-echart class="tall pt10" :options="echartList" />
|
||||
<div class="tall">
|
||||
<vxe-table
|
||||
height="auto"
|
||||
auto-resize
|
||||
:data="list"
|
||||
v-bind="defaultAttribute"
|
||||
>
|
||||
<vxe-table height="auto" auto-resize :data="list" v-bind="defaultAttribute">
|
||||
<vxe-column field="gdName" title="供电公司"></vxe-column>
|
||||
<vxe-column field="subName" title="变电站"></vxe-column>
|
||||
<vxe-column field="lineName" title="监测点"></vxe-column>
|
||||
@@ -125,11 +120,11 @@ const map = (res: any) => {
|
||||
visualMap: {
|
||||
left: 26,
|
||||
bottom: 40,
|
||||
|
||||
show: true,
|
||||
color: ['#ff0000', '#37b70c'],
|
||||
min: minNum,
|
||||
color: ['#A52a2a', '#DAA520'],
|
||||
min: 0,
|
||||
max: maxNum,
|
||||
calculable: true,
|
||||
textStyle: {
|
||||
color: '#000',
|
||||
fontSize: 12
|
||||
@@ -140,13 +135,14 @@ const map = (res: any) => {
|
||||
series: [
|
||||
{
|
||||
mapType: 'nanshan',
|
||||
type: 'heatmap',
|
||||
top: 'center',
|
||||
left: 'center',
|
||||
width: '65%',
|
||||
height: '95%',
|
||||
|
||||
// name: 'AQI',
|
||||
type: 'heatmap',
|
||||
|
||||
coordinateSystem: 'geo',
|
||||
blurSize: 40,
|
||||
data: areaData
|
||||
@@ -159,6 +155,7 @@ const map = (res: any) => {
|
||||
|
||||
// 柱状图数据处理
|
||||
const histogram = (res: any) => {
|
||||
echartMapList.value.visualMap.max = Math.max(...res.map((item: any) => item.count)) || 1
|
||||
echartList.value = {
|
||||
title: {
|
||||
text: '区域暂降次数'
|
||||
|
||||
@@ -32,7 +32,7 @@ import router from '@/router'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
defineOptions({
|
||||
// name: 'Descentsystem/monitoringpoint'
|
||||
name: 'Descentsystem/monitoringpoint'
|
||||
})
|
||||
const isReload = ref(false)
|
||||
const navigationRef = ref()
|
||||
|
||||
@@ -37,9 +37,10 @@
|
||||
<span>无暂降</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- v-if="hackReset" -->
|
||||
<baidu-map
|
||||
class="bm-view"
|
||||
v-if="hackReset"
|
||||
|
||||
:zoom="zoom"
|
||||
:map-click="false"
|
||||
:scroll-wheel-zoom="true"
|
||||
|
||||
@@ -42,7 +42,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="selectBox">
|
||||
<el-select @change="pointChange" filterable clearable v-model="lineId" placeholder="输入监测点名称查询">
|
||||
<el-select @change="pointChange" filterable clearable v-model="lineId" placeholder="输入监测点名称查询">
|
||||
<el-option
|
||||
v-for="item in areaLineInfo"
|
||||
:key="item.lineId"
|
||||
@@ -51,9 +51,10 @@
|
||||
></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<!-- v-if="hackReset" -->
|
||||
<baidu-map
|
||||
class="bm-view"
|
||||
v-if="hackReset"
|
||||
|
||||
:zoom="zoom"
|
||||
:map-click="false"
|
||||
:scroll-wheel-zoom="true"
|
||||
@@ -158,7 +159,7 @@ import PopupEvent from './popupEvent.vue'
|
||||
import router from '@/router'
|
||||
|
||||
defineOptions({
|
||||
// name: 'Descentsystem/overview'
|
||||
name: 'Descentsystem/overview'
|
||||
}) // 添加响应式变量
|
||||
|
||||
const height = mainHeight(20)
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<el-dialog draggable v-model="dialogVisible" :title="title" :before-close="Cancel">
|
||||
<el-form :inline="false" :model="configStore" label-width="auto">
|
||||
<el-dialog draggable v-model="dialogVisible" :title="title" :before-close="Cancel">
|
||||
<el-form :inline="false" :model="configStore" label-width="auto" ref="formRef" :rules="rules">
|
||||
<el-divider border-style="dashed">全局</el-divider>
|
||||
<div class="layout-config-global form-two">
|
||||
<el-form-item label="组件主名称">
|
||||
<el-input v-model="configStore.name" placeholder="请输入主题名称" />
|
||||
<el-form-item label="组件主名称" prop="name">
|
||||
<el-input v-model.trim="configStore.name" placeholder="请输入主题名称" maxlength="32" show-word-limit />
|
||||
</el-form-item>
|
||||
<el-form-item label="后台页面切换动画">
|
||||
<el-form-item label="后台页面切换动画" prop="mainAnimation">
|
||||
<el-select v-model="configStore.mainAnimation">
|
||||
<el-option label="slide-right" value="slide-right"></el-option>
|
||||
<el-option label="slide-left" value="slide-left"></el-option>
|
||||
@@ -17,22 +17,23 @@
|
||||
<el-option label="el-zoom-in-bottom" value="el-zoom-in-bottom"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="组件主题色">
|
||||
<el-form-item label="组件主题色" prop="elementUiPrimary">
|
||||
<el-color-picker v-model="configStore.elementUiPrimary[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="表格标题栏背景颜色">
|
||||
<el-form-item label="表格标题栏背景颜色" prop="tableHeaderBackground">
|
||||
<el-color-picker v-model="configStore.tableHeaderBackground[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="表格标题栏文字颜色">
|
||||
<el-form-item label="表格标题栏文字颜色" prop="tableHeaderColor">
|
||||
<el-color-picker v-model="configStore.tableHeaderColor[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="表格激活栏颜色">
|
||||
<el-form-item label="表格激活栏颜色" prop="tableCurrent">
|
||||
<el-color-picker v-model="configStore.tableCurrent[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="组件主描述">
|
||||
<el-form-item label="组件主描述" prop="remark">
|
||||
<el-input
|
||||
v-model="configStore.remark"
|
||||
v-model.trim="configStore.remark"
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
maxlength="300" show-word-limit
|
||||
type="textarea"
|
||||
placeholder="请输入描述"
|
||||
/>
|
||||
@@ -40,32 +41,32 @@
|
||||
</div>
|
||||
<el-divider border-style="dashed">侧边栏</el-divider>
|
||||
<div class="layout-config-aside form-two">
|
||||
<el-form-item label="侧边菜单栏背景色">
|
||||
<el-form-item label="侧边菜单栏背景色" prop="menuBackground">
|
||||
<el-color-picker v-model="configStore.menuBackground[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="侧边菜单文字颜色">
|
||||
<el-form-item label="侧边菜单文字颜色" prop="menuColor">
|
||||
<el-color-picker v-model="configStore.menuColor[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="侧边菜单激活项背景色">
|
||||
<el-form-item label="侧边菜单激活项背景色" prop="menuActiveBackground">
|
||||
<el-color-picker v-model="configStore.menuActiveBackground[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="侧边菜单激活项文字色">
|
||||
<el-form-item label="侧边菜单激活项文字色" prop="menuActiveColor">
|
||||
<el-color-picker v-model="configStore.menuActiveColor[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="侧边菜单顶栏背景色">
|
||||
<el-form-item label="侧边菜单顶栏背景色" prop="menuTopBarBackground">
|
||||
<el-color-picker v-model="configStore.menuTopBarBackground[0]" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
<el-divider border-style="dashed">顶栏</el-divider>
|
||||
<div class="layout-config-aside form-two">
|
||||
<el-form-item label="顶栏背景色">
|
||||
<el-form-item label="顶栏背景色" prop="headerBarBackground">
|
||||
<el-color-picker v-model="configStore.headerBarBackground[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="顶栏文字色">
|
||||
<el-form-item label="顶栏文字色" prop="headerBarTabColor">
|
||||
<el-color-picker v-model="configStore.headerBarTabColor[0]" />
|
||||
</el-form-item>
|
||||
<el-form-item label="顶栏logo">
|
||||
<el-form-item label="顶栏logo" prop="logoFile">
|
||||
<el-image
|
||||
style="height: 50px"
|
||||
:src="logoFile.url"
|
||||
@@ -133,11 +134,176 @@ const configStore = ref({
|
||||
faviconFile: '',
|
||||
remark: ''
|
||||
})
|
||||
|
||||
// 完善校验规则
|
||||
const rules = reactive({
|
||||
name: [{ required: true, message: '请输入组件主名称', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '请输入组件备注', trigger: 'blur' }],
|
||||
mainAnimation: [{ required: true, message: '请选择页面切换动画', trigger: 'change' }],
|
||||
elementUiPrimary: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择组件主题色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
tableHeaderBackground: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择表格标题栏背景颜色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
tableHeaderColor: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择表格标题栏文字颜色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
tableCurrent: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择表格激活栏颜色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
menuBackground: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择侧边菜单栏背景色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
menuColor: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择侧边菜单文字颜色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
menuActiveBackground: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择侧边菜单激活项背景色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
menuActiveColor: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择侧边菜单激活项文字色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
menuTopBarBackground: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择侧边菜单顶栏背景色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
headerBarBackground: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择顶栏背景色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
headerBarTabColor: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!value || !value[0]) {
|
||||
callback(new Error('请选择顶栏文字色'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
logoFile: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
// 编辑时如果已有图片则不校验
|
||||
if (title.value === '修改主题' && logoFile.url) {
|
||||
callback()
|
||||
} else if (!value && !logoFile.url) {
|
||||
callback(new Error('请上传顶栏logo'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
})
|
||||
const logoFile = reactive({
|
||||
url: '',
|
||||
raw: ''
|
||||
})
|
||||
const formRef = ref()
|
||||
|
||||
const open = (e: any) => {
|
||||
title.value = e.text
|
||||
@@ -167,50 +333,54 @@ const open = (e: any) => {
|
||||
}
|
||||
// 确定主题
|
||||
const onSubmit = () => {
|
||||
configStore.value.faviconFile = configStore.value.logoFile
|
||||
configStore.value.color = configStore.value.elementUiPrimary[0]
|
||||
let form = new FormData()
|
||||
for (let k in configStore.value) {
|
||||
if (
|
||||
k == 'logoFile' ||
|
||||
k == 'faviconFile' ||
|
||||
k == 'name' ||
|
||||
k == 'color' ||
|
||||
k == 'remark' ||
|
||||
k == 'mainAnimation' ||
|
||||
k == 'id'
|
||||
) {
|
||||
form.append(k, configStore.value[k])
|
||||
} else if (k == 'logoUrl' || k == 'faviconUrl') {
|
||||
if (configStore.value.logoFile == null) {
|
||||
let str = configStore.value[k].match(/base64,([^"]+)/)[1]
|
||||
let bin = atob(str)
|
||||
let arr = new Array(bin.length)
|
||||
for (let i = 0; i < bin.length; i++) {
|
||||
arr[i] = bin.charCodeAt(i)
|
||||
formRef.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
configStore.value.faviconFile = configStore.value.logoFile
|
||||
configStore.value.color = configStore.value.elementUiPrimary[0]
|
||||
let form = new FormData()
|
||||
for (let k in configStore.value) {
|
||||
if (
|
||||
k == 'logoFile' ||
|
||||
k == 'faviconFile' ||
|
||||
k == 'name' ||
|
||||
k == 'color' ||
|
||||
k == 'remark' ||
|
||||
k == 'mainAnimation' ||
|
||||
k == 'id'
|
||||
) {
|
||||
form.append(k, configStore.value[k])
|
||||
} else if (k == 'logoUrl' || k == 'faviconUrl') {
|
||||
if (configStore.value.logoFile == null) {
|
||||
let str = configStore.value[k].match(/base64,([^"]+)/)[1]
|
||||
let bin = atob(str)
|
||||
let arr = new Array(bin.length)
|
||||
for (let i = 0; i < bin.length; i++) {
|
||||
arr[i] = bin.charCodeAt(i)
|
||||
}
|
||||
let b = new Uint8Array(arr)
|
||||
const blob = new Blob([b], { type: 'image/jpeg' })
|
||||
form.append('faviconFile', blob)
|
||||
form.append('logoFile', blob)
|
||||
}
|
||||
} else {
|
||||
form.append(k, JSON.stringify(configStore.value[k]))
|
||||
}
|
||||
let b = new Uint8Array(arr)
|
||||
const blob = new Blob([b], { type: 'image/jpeg' })
|
||||
form.append('faviconFile', blob)
|
||||
form.append('logoFile', blob)
|
||||
}
|
||||
} else {
|
||||
form.append(k, JSON.stringify(configStore.value[k]))
|
||||
}
|
||||
}
|
||||
|
||||
if (title.value == '新增主题') {
|
||||
addTheme(form).then(res => {
|
||||
ElMessage.success('新增成功')
|
||||
Cancel()
|
||||
})
|
||||
}
|
||||
if (title.value == '修改主题') {
|
||||
updateTheme(form).then(res => {
|
||||
ElMessage.success('修改成功')
|
||||
Cancel()
|
||||
})
|
||||
}
|
||||
if (title.value == '新增主题') {
|
||||
addTheme(form).then(res => {
|
||||
ElMessage.success('新增成功')
|
||||
Cancel()
|
||||
})
|
||||
}
|
||||
if (title.value == '修改主题') {
|
||||
updateTheme(form).then(res => {
|
||||
ElMessage.success('修改成功')
|
||||
Cancel()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// 取消
|
||||
const Cancel = () => {
|
||||
|
||||
Reference in New Issue
Block a user