xuziqiang
/
SaaS-lib
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix:根据ui修改样式

temp
zhaohy 3 months ago
parent
0e452ddef2
commit
ca7b5bbede
5 changed files with 93 additions and 77 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 58
      hx-ai-intelligent/src/view/alarmManagement/alarmOverview/index.vue
  2. 27
      hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editConfigureEnergyAlarm.vue
  3. 28
      hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editeEnergyAlarm.vue
  4. 29
      hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue
  5. 28
      hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editeEquipmentAlarm.vue

58
hx-ai-intelligent/src/view/alarmManagement/alarmOverview/index.vue
View File

@ -39,7 +39,7 @@
><span style="color: rgba(0, 0, 0, 1); font-size: 16px; font-weight: 700">{{ ><span style="color: rgba(0, 0, 0, 1); font-size: 16px; font-weight: 700">{{
item.title item.title
}}</span> }}</span>
<span style="margin-left: 6px; font-size: 13px"> 今日处理 / 总数</span> <span style="margin-left: 6px; font-size: 12px"> 今日处理 / 总数</span>
</div> </div>
</div> </div>
</div> </div>
@ -50,7 +50,7 @@
<div class="box-center-item-top"> <div class="box-center-item-top">
<img style="display: flex; position: absolute; top: 5px" :src="priority" /> <img style="display: flex; position: absolute; top: 5px" :src="priority" />
<div class="box-center-item-top-title"> <div class="box-center-item-top-title">
<span style="font-size: 18px">优先级</span> <span style="font-size: 20px">优先级</span>
</div> </div>
<div <div
style=" style="
@ -72,7 +72,7 @@
<div class="box-center-item-top"> <div class="box-center-item-top">
<img style="display: flex; position: absolute; top: 5px" :src="priority" /> <img style="display: flex; position: absolute; top: 5px" :src="priority" />
<div class="box-center-item-top-title"> <div class="box-center-item-top-title">
<span style="font-size: 18px">处理进度</span> <span style="font-size: 20px">处理进度</span>
</div> </div>
<div <div
style=" style="
@ -96,7 +96,7 @@
<div class="box-bottom-top"> <div class="box-bottom-top">
<img style="display: flex; position: absolute; top: 5px" :src="priority" /> <img style="display: flex; position: absolute; top: 5px" :src="priority" />
<div class="box-bottom-top-title"> <div class="box-bottom-top-title">
<span style="font-size: 18px">处理进度</span> <span style="font-size: 20px">处理进度</span>
</div> </div>
<div class="box-bottom-top-unit"> ( 近30天 ) </div> <div class="box-bottom-top-unit"> ( 近30天 ) </div>
</div> </div>
@ -150,12 +150,21 @@
}) })
.then((res) => { .then((res) => {
if (res.msg === 'success') { if (res.msg === 'success') {
res.data.forEach((item: any) => { // 从小 到 大 日期排序
const data = res.data.sort((a: any, b: any) => {
// 将 dayData 转换为日期对象
const dateA: any = new Date(a.createTime);
const dateB: any = new Date(b.createTime);
// 返回比较结果，升序排列
return dateA - dateB;
});
data.forEach((item: any) => {
energyAlarm.push(item.alarmEnergyConsumptionNum); energyAlarm.push(item.alarmEnergyConsumptionNum);
wgAlarm.push(item.alarmGatewayNum); wgAlarm.push(item.alarmGatewayNum);
equipmentAlarm.push(item.alarmEquipmentNum); equipmentAlarm.push(item.alarmEquipmentNum);
total.push(0); total.push(0);
dayData.push(item.createTime); item.createTime = item.createTime.substring(5, 10);
dayData.push(item.createTime.replace('-', '/'));
}); });
} }
}); });
@ -217,11 +226,13 @@
left: 'right', // 将图例居中显示 left: 'right', // 将图例居中显示
textStyle: { textStyle: {
color: 'rgb(89, 89, 89)', color: 'rgb(89, 89, 89)',
fontSize: '14', fontSize: 14,
fontWeight: 'normal', fontWeight: 'normal',
}, // 注意这里的颜色值要用引号括起来 }, // 注意这里的颜色值要用引号括起来
data: ['设备告警', '网关告警', '能源告警'], data: ['设备告警', '网关告警', '能源告警'],
itemGap: 30, // 这里可以调整图例项之间的间距，单位为像素 itemGap: 30, // 这里可以调整图例项之间的间距，单位为像素
itemWidth: 16, //图例宽度
itemHeight: 16, //图例高度
}, },
], ],
calculable: true, calculable: true,
@ -240,7 +251,7 @@
data: dayData, data: dayData,
axisLabel: { axisLabel: {
show: true, // 显示所有刻度值 show: true, // 显示所有刻度值
interval: 1, // 显示所有刻度，不跳过 // interval: 1, // 显示所有刻度，不跳过
// rotate: 45, // 可选：如果标签过长，可以旋转标签以避免重叠 // rotate: 45, // 可选：如果标签过长，可以旋转标签以避免重叠
}, },
}, },
@ -248,9 +259,14 @@
yAxis: [ yAxis: [
{ {
type: 'value', type: 'value',
shwo: false, show: true,
splitLine: { splitLine: {
show: true, show: true,
lineStyle: {
color: '#dae7ff', // 设置分隔线颜色
width: 1, // 设置分隔线宽度
type: 'dashed', // 设置分隔线类型，可选 'solid'、'dashed' 或 'dotted'
},
}, },
axisLine: { axisLine: {
show: false, show: false,
@ -262,7 +278,7 @@
show: false, show: false,
}, },
axisLabel: { axisLabel: {
show: false, // 不显示刻度值 show: true, // 不显示刻度值
}, },
}, },
], ],
@ -409,7 +425,7 @@
// icon: 'circle', // icon: 'circle',
itemWidth: 16, itemWidth: 16,
itemHeight: 16, itemHeight: 16,
itemGap: 16, itemGap: 30,
textStyle: { textStyle: {
fontSize: 14, fontSize: 14,
}, },
@ -432,7 +448,8 @@
fontWeight: 'bold', fontWeight: 'bold',
}, },
formatter: function (parms: any) { formatter: function (parms: any) {
return '[ ' + parms.data.name + ' ] : ' + parms.data.value; // return '[ ' + parms.data.name + ' ] : ' + parms.data.value;
return parms.data.name + ' : ' + parms.data.value;
}, },
}, },
// emphasis: { // emphasis: {
@ -521,7 +538,7 @@
orient: 'vertical', orient: 'vertical',
itemWidth: 16, itemWidth: 16,
itemHeight: 16, itemHeight: 16,
itemGap: 16, itemGap: 30,
textStyle: { textStyle: {
fontSize: 14, fontSize: 14,
}, },
@ -544,7 +561,8 @@
fontWeight: 'bold', fontWeight: 'bold',
}, },
formatter: function (parms: any) { formatter: function (parms: any) {
return '[ ' + parms.data.name + ' ] : ' + parms.data.value; // return '[ ' + parms.data.name + ' ] : ' + parms.data.value;
return parms.data.name + ' : ' + parms.data.value;
}, },
}, },
}, },
@ -616,7 +634,7 @@
// border: 1px solid red; // border: 1px solid red;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 12px; gap: 20px;
background-color: #f0f1f4; background-color: #f0f1f4;
box-sizing: border-box; box-sizing: border-box;
.box-top { .box-top {
@ -625,11 +643,11 @@
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
gap: 12px; gap: 20px;
.box-top-item { .box-top-item {
height: 100%; height: 100%;
flex: 1; flex: 1;
gap: 12px; gap: 20px;
background-color: white; background-color: white;
border-radius: 4px; border-radius: 4px;
.item-box { .item-box {
@ -657,10 +675,10 @@
} }
.iem-box-left-number { .iem-box-left-number {
color: #000000; color: #000000;
font-weight: 700; font-weight: 400;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif; font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
font-style: normal; font-style: normal;
font-size: 30px; font-size: 40px;
} }
} }
.item-box-right { .item-box-right {
@ -674,7 +692,7 @@
flex: 4; flex: 4;
width: 100%; width: 100%;
display: flex; display: flex;
gap: 12px; gap: 20px;
.box-center-item { .box-center-item {
flex: 1; flex: 1;
height: 100%; height: 100%;

27
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editConfigureEnergyAlarm.vue
View File

@ -8,20 +8,7 @@
:cancel="handleClose" :cancel="handleClose"
@close="handleClose" @close="handleClose"
placement="right"> placement="right">
<div <div class="ns-title-extra-box title">
class="ns-title-extra-box"
style="
width: 100%;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
">
<span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span> <span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span>
</div> </div>
<div style="padding: 18px; width: 100%; overflow: hidden"> <div style="padding: 18px; width: 100%; overflow: hidden">
@ -494,6 +481,18 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.title {
width: 200px;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-left: 24px;
}
.blue-background.ant-switch-checked { .blue-background.ant-switch-checked {
background-color: linear-gradient( background-color: linear-gradient(
180deg, 180deg,

28
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editeEnergyAlarm.vue
View File

@ -8,20 +8,7 @@
:cancel="handleClose" :cancel="handleClose"
placement="right" placement="right"
@close="handleClose"> @close="handleClose">
<div <div class="ns-title-extra-box title">
class="ns-title-extra-box"
style="
width: 100%;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
">
<span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span> <span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span>
</div> </div>
<a-form ref="formRef" :model="infoObject" :rules="rules"> <a-form ref="formRef" :model="infoObject" :rules="rules">
@ -272,6 +259,19 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.title {
width: 200px;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
margin-left: 24px;
}
.blue-background.ant-switch-checked { .blue-background.ant-switch-checked {
background-color: linear-gradient( background-color: linear-gradient(
180deg, 180deg,

29
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue
View File

@ -9,20 +9,7 @@
placement="right" placement="right"
@close="handleClose"> @close="handleClose">
<div style="padding: 12px; width: 100%; overflow: hidden"> <div style="padding: 12px; width: 100%; overflow: hidden">
<div <div class="ns-title-extra-box title">
class="ns-title-extra-box"
style="
width: 100%;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
">
<span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span> <span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span>
</div> </div>
<a-form ref="formRef" :model="infoObject" :rules="rules"> <a-form ref="formRef" :model="infoObject" :rules="rules">
@ -518,6 +505,19 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.title {
width: 200px;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
margin-left: 24px;
}
.blue-background.ant-switch-checked { .blue-background.ant-switch-checked {
background-color: linear-gradient( background-color: linear-gradient(
180deg, 180deg,
@ -547,7 +547,6 @@
z-index: 20; z-index: 20;
text-align: right; text-align: right;
width: 23%; width: 23%;
display: flex;
position: relative; position: relative;
} }
</style> </style>

28
hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editeEquipmentAlarm.vue
View File

@ -8,20 +8,7 @@
:cancel="handleClose" :cancel="handleClose"
placement="right" placement="right"
@close="handleClose"> @close="handleClose">
<div <div class="ns-title-extra-box title">
class="ns-title-extra-box"
style="
width: 100%;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
">
<span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span> <span style="margin-left: 6px">{{ infoObject?.id ? '编辑' : '新增' }}</span>
</div> </div>
<a-form ref="formRef" :model="infoObject" :rules="rules"> <a-form ref="formRef" :model="infoObject" :rules="rules">
@ -332,6 +319,19 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.title {
width: 200px;
height: 22px;
opacity: 1;
/** 文本1 */
font-size: 16px;
font-weight: 700;
letter-spacing: 0px;
line-height: 21px;
color: rgba(51, 51, 51, 1);
margin-bottom: 24px;
margin-left: 24px;
}
.blue-background.ant-switch-checked { .blue-background.ant-switch-checked {
background-color: linear-gradient( background-color: linear-gradient(
180deg, 180deg,

Write Preview
Loading…
Cancel
Save