添加sql请求
userName
parent
be9feba558
commit
f7012b6321
|
|
@ -16,6 +16,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
|
|||
public attr = { ...chartInitConfig, w: 500, h: 70, zIndex: 1 }
|
||||
public chartConfig = cloneDeep(TitlesTextConfig)
|
||||
public option = cloneDeep(option)
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from zg_meirishangbaoshuliangtongji' }, }
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from ' }, }
|
||||
public filter = "return res.result;"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -34,6 +34,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
|
|||
public attr = { ...chartInitConfig, w: 378, h: 193, zIndex: 1 }
|
||||
public chartConfig = cloneDeep(EquipmentHuoQingJianCeConfig)
|
||||
public option = cloneDeep(option)
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from zg_meirishangbaoshuliangtongji' }, }
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from ' }, }
|
||||
public filter = "return res.result;"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,13 +28,13 @@ export const option = {
|
|||
{
|
||||
title: '巡护发现火情',
|
||||
type: '重大火灾',
|
||||
address: '临沂市蒙阴县马田公路附近东北方向100米',
|
||||
position: '临沂市蒙阴县马田公路附近东北方向100米',
|
||||
time: '2025/10/01 12:05:01'
|
||||
},
|
||||
{
|
||||
title: '巡护发现火情',
|
||||
type: '重大火灾',
|
||||
address: '临沂市蒙阴县马田公路附近东北方向100米',
|
||||
position: '临沂市蒙阴县马田公路附近东北方向100米',
|
||||
time: '2025/10/01 12:05:01'
|
||||
},
|
||||
],
|
||||
|
|
@ -45,6 +45,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
|
|||
public attr = { ...chartInitConfig, w: 378, h: 300, zIndex: 1 }
|
||||
public chartConfig = cloneDeep(EquipmentHuoQingXianSuoConfig)
|
||||
public option = cloneDeep(option)
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from zg_meirishangbaoshuliangtongji' }, }
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from zg_weixinyaoganxinxi' }, }
|
||||
public filter = "return res.result;"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</div>
|
||||
<div class="flex mt-1">
|
||||
<img class="mr-1" src="/src/assets/images/chart/equipment/address.png" />
|
||||
<div class="numStyle">{{item.address}}</div>
|
||||
<div class="numStyle">{{item.position}}</div>
|
||||
</div>
|
||||
<div class="flex mt-1">
|
||||
<img class="mr-1" src="/src/assets/images/chart/equipment/time.png" />
|
||||
|
|
@ -69,11 +69,12 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any[]) => {
|
|||
|
||||
<style lang="scss" scoped>
|
||||
@include go('title-03') {
|
||||
height: v-bind('h');
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-top:10px;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
.max-w{
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -101,6 +102,7 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any[]) => {
|
|||
}
|
||||
.navsbox{
|
||||
width: 92%;
|
||||
margin-left: 4%;
|
||||
height: 28px;
|
||||
background: v-bind('navsBackground');
|
||||
border-radius: 1px;
|
||||
|
|
@ -136,6 +138,7 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any[]) => {
|
|||
}
|
||||
.sectionBox{
|
||||
width: 92%;
|
||||
margin-left: 4%;
|
||||
img{
|
||||
width: 21px;
|
||||
height: 21px;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { PublicConfigClass } from '@/packages/public'
|
||||
import { chartInitConfig } from '@/settings/designSetting'
|
||||
import { chartInitConfig, requestSqlConfig } from '@/settings/designSetting'
|
||||
import { CreateComponentType } from '@/packages/index.d'
|
||||
import { EquipmentTitlesbg04Config } from './index'
|
||||
import cloneDeep from 'lodash/cloneDeep'
|
||||
|
|
@ -7,6 +7,10 @@ import cloneDeep from 'lodash/cloneDeep'
|
|||
export const option = {
|
||||
boxId: 'EquipmentTitlesbg04',
|
||||
colors: ['#457453','#0D6336','#FFCE00','#4FE985','#9BCCB8'],
|
||||
textColors: ['#4FE985','#CBE7CD'],
|
||||
textSize: 28,
|
||||
textSize1: 14,
|
||||
dataset: {label: '在线', value: '23'}
|
||||
}
|
||||
|
||||
export default class Config extends PublicConfigClass implements CreateComponentType {
|
||||
|
|
@ -14,4 +18,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
|
|||
public attr = { ...chartInitConfig, w: 103, h: 94, zIndex: 1 }
|
||||
public chartConfig = cloneDeep(EquipmentTitlesbg04Config)
|
||||
public option = cloneDeep(option)
|
||||
public request = { ...requestSqlConfig, requestSQLContent: { sql: 'select * from ' }, }
|
||||
public filter = "return res.result;"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,6 +10,35 @@
|
|||
/>
|
||||
</SettingItemBox>
|
||||
</CollapseItem>
|
||||
<CollapseItem name="文字样式" :expanded="true">
|
||||
<SettingItem name="大小">
|
||||
<n-input-number v-model:value="optionData.textSize" size="small" :min="12"></n-input-number>
|
||||
</SettingItem>
|
||||
<SettingItem name="大小">
|
||||
<n-input-number v-model:value="optionData.textSize1" size="small" :min="12"></n-input-number>
|
||||
</SettingItem>
|
||||
<SettingItemBox
|
||||
:name="`颜色-${index + 1}`"
|
||||
v-for="(item, index) in optionData.textColors"
|
||||
:key="index"
|
||||
>
|
||||
<SettingItem name="颜色">
|
||||
<n-color-picker
|
||||
size="small"
|
||||
:modes="['hex']"
|
||||
v-model:value="optionData.textColors[index]"
|
||||
></n-color-picker>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<n-button
|
||||
size="small"
|
||||
@click="optionData.textColors[index] = option.textColors[index]"
|
||||
>
|
||||
恢复默认
|
||||
</n-button>
|
||||
</SettingItem>
|
||||
</SettingItemBox>
|
||||
</CollapseItem>
|
||||
<CollapseItem name="样式" :expanded="true">
|
||||
<SettingItemBox
|
||||
:name="`颜色-${index + 1}`"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,10 @@
|
|||
<template>
|
||||
<div class="go-title-03">
|
||||
<div class="flex ai-c jc-c column">
|
||||
<div class="dataValue flex ai-c jc-c"> {{dataset.value}} </div>
|
||||
<div class="dataLabel flex ai-c jc-c"> {{dataset.label}} </div>
|
||||
</div>
|
||||
|
||||
<svg :width="w" :height="h">
|
||||
<title>编组 66</title>
|
||||
<g id="监测平台" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
|
|
@ -9,7 +14,7 @@
|
|||
<g id="编组-7" transform="translate(0, 0.8472)">
|
||||
<g id="标题模块--左侧1" transform="translate(0, 219.1528)">
|
||||
<g id="编组-66" :transform="`translate(164.5, 11.9394)`">
|
||||
<!-- w: 103, h: 94 -->
|
||||
|
||||
<rect id="矩形" :stroke="colors[0]" x="0.00126503312" y="0.266825726" :width="`${w/1.03}`" :height="`${h/1.04}`"></rect>
|
||||
<polygon
|
||||
id="矩形" :fill="colors[1]"
|
||||
|
|
@ -29,6 +34,8 @@
|
|||
id="路径-32" :stroke="colors[3]" stroke-width="2"
|
||||
:points="`0 ${h/1.13} 0 ${h/1.04} ${w/14.67} ${h/1.04}`"
|
||||
></polyline>
|
||||
<!-- w: 103, h: 94 -->
|
||||
|
||||
<polyline
|
||||
id="路径-32" :stroke="colors[3]" stroke-width="2"
|
||||
:transform="`translate(${w/1.06}, ${h/26.12}) scale(-1, -1) translate(-${w/1.09}, -${h/26.12})`"
|
||||
|
|
@ -58,6 +65,8 @@
|
|||
<script setup lang="ts">
|
||||
import { PropType, toRefs } from 'vue'
|
||||
import { CreateComponentType } from '@/packages/index.d'
|
||||
import { useChartDataFetch } from '@/hooks';
|
||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore';
|
||||
|
||||
const props = defineProps({
|
||||
chartConfig: {
|
||||
|
|
@ -69,8 +78,16 @@ const props = defineProps({
|
|||
const { w, h } = toRefs(props.chartConfig.attr)
|
||||
const {
|
||||
colors,
|
||||
boxId
|
||||
textColors,
|
||||
textSize,
|
||||
textSize1,
|
||||
dataset
|
||||
} = toRefs(props.chartConfig.option)
|
||||
|
||||
// 数据callback处理（预览时触发）
|
||||
useChartDataFetch(props.chartConfig, useChartEditStore, (resData: any[]) => {
|
||||
props.chartConfig.option.dataset = resData;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -93,5 +110,27 @@ const {
|
|||
.stroke {
|
||||
stroke: v-bind('colors[1]');
|
||||
}
|
||||
.dataLabel{
|
||||
color: v-bind('textColors[1]');
|
||||
font-size: v-bind('textSize1+"px"');
|
||||
height: v-bind('h/2+"px"');
|
||||
}
|
||||
.dataValue{
|
||||
height: v-bind('h/2+"px"');
|
||||
color: v-bind('textColors[0]');
|
||||
font-size: v-bind('textSize+"px"');
|
||||
}
|
||||
.column{
|
||||
flex-direction: column;
|
||||
}
|
||||
.flex{
|
||||
display: flex;
|
||||
}
|
||||
.jc-c{
|
||||
justify-content: center;
|
||||
}
|
||||
.ai-c{
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue