绘制短信模块

This commit is contained in:
guanj
2025-05-30 16:00:31 +08:00
parent 6e99373c1c
commit 3451759e48
9 changed files with 159 additions and 9 deletions

View File

@@ -4,7 +4,7 @@
{{ fieldValue }}
</div>
<!-- Icon -->
<Icon class="ba-icon-dark" v-if="field.render == 'icon'" :name="fieldValue ? fieldValue : field.default ?? ''" />
<Icon class="ba-icon-dark" v-if="field.render == 'icon' && fieldValue" :name="fieldValue ? fieldValue : field.default ?? ''" />
<!-- switch -->
<el-switch v-if="field.render == 'switch'" @change="onChangeField(field, $event)"

View File

@@ -80,7 +80,6 @@ watch(
() => prop.timeKey,
val => {
tableStore.index()
console.log(123)
}
)

View File

@@ -3,7 +3,7 @@
<my-echart :style="{ width: prop.width, height: prop.height }" :options="options" />
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import { ref, onMounted, provide, watch } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
@@ -13,7 +13,8 @@ import * as echarts from 'echarts/core'
import { getTimeOfTheMonth } from '@/utils/formatTime'
const prop = defineProps({
width: { type: String },
height: { type: String }
height: { type: String },
timeKey: { type: String }
})
const dictData = useDictData()
const options = ref({})
@@ -92,7 +93,10 @@ const tableStore = new TableStore({
showPage: false,
method: 'POST',
column: [],
beforeSearchFun: () => {
tableStore.table.params.searchBeginTime = getTimeOfTheMonth(prop.timeKey)[0]
tableStore.table.params.searchEndTime = getTimeOfTheMonth(prop.timeKey)[1]
},
loadCallback: () => {
let code = tableStore.table.params.statisticalType.code
let title = '',
@@ -246,8 +250,7 @@ const tableStore = new TableStore({
}
})
tableStore.table.params.deptIndex = dictData.state.area[0].id
tableStore.table.params.searchBeginTime = getTimeOfTheMonth()[0]
tableStore.table.params.searchEndTime = getTimeOfTheMonth()[1]
tableStore.table.params.statisticalType = classificationData[0]
tableStore.table.params.scale = []
tableStore.table.params.manufacturer = []
@@ -259,5 +262,11 @@ provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
watch(
() => prop.timeKey,
val => {
tableStore.index()
}
)
</script>
<style scoped lang="scss"></style>

View File

@@ -28,6 +28,7 @@
:key="key"
:height="rowHeight * item.h - (item.h == 6 ? -20 : item.h == 2 ? 20 : 5) + 'px'"
:width="rowWidth * item.w - 5 + 'px'"
:timeKey="item.timeKey"
/>
<div v-else class="pd10">组件加载失败...</div>
</div>

View File

@@ -311,7 +311,8 @@ function dragEnd(row: any) {
i: dragItem.i,
name: row.name,
path: row.path,
icon: row.icon
icon: row.icon,
timeKey: row.timeKey
})
gridLayout.value.dragEvent('dragend', dragItem.i, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
const item = gridLayout.value.getItem(dropId)

View File

@@ -32,6 +32,7 @@
:key="key"
:height="rowHeight * item.h - (item.h == 6 ? -20 : item.h == 2 ? 20 : 5) + 'px'"
:width="rowWidth * item.w - 5 + 'px'"
:timeKey="item.timeKey"
/>
<div v-else class="pd10">组件加载失败...</div>
</div>

View File

@@ -36,7 +36,7 @@
<el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
</el-form-item>
</el-form>
<div style="max-width: 600px; max-height: 370px; overflow: hidden">
<div style="width: 550px; height: 370px; overflow: hidden">
<div class="ml10" style="font-weight: 600">组件展示</div>
<component
:is="registerComponent(form.path)"

View File

@@ -0,0 +1,12 @@
<template>
<div class="default-main">123 </div>
</template>
<script setup lang='ts'>
// src/views/setting/translate/configuration/index.vue
import { ref, reactive } from 'vue'
</script>
<style lang="scss" scoped>
</style>

View File

@@ -0,0 +1,127 @@
<template>
<div class="default-main" style="position: relative">
<TableHeader datePicker showExport>
<template #select>
<el-form-item label="发送结果">
<el-select v-model="tableStore.table.params.searchState" clearable placeholder="请选择发送结果">
<el-option label="成功" value="1" />
<el-option label="失败" value="2" />
<el-option label="异常" value="0" />
</el-select>
</el-form-item>
</template>
<template #operation>
<el-button icon="el-icon-Delete" type="primary" @click="deleteEven">删除</el-button>
</template>
</TableHeader>
<Table ref="tableRef" :showOverflow="false" />
</div>
</template>
<script setup lang="ts">
import { Plus } from '@element-plus/icons-vue'
import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage } from 'element-plus'
import { dictTypeDelete } from '@/api/system-boot/dictType'
defineOptions({
name: 'system-boot/dictType/list'
})
const tableStore = new TableStore({
url: '/system-boot/dictType/list',
method: 'POST',
column: [
{ width: '60', type: 'checkbox' },
{
title: '序号',
width: 80,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ title: '时间', field: 'time', width: '200px' },
{ title: '接收人', field: 'uesr', width: '120px' },
{ title: '手机号', field: 'sort', width: '180px' },
{
title: '发送结果',
field: 'outcome',
width: '120px',
render: 'tag',
custom: {
0: 'warning',
1: 'success',
2: 'danger'
},
replaceValue: {
0: '异常',
1: '成功',
2: '失败'
}
},
{ title: '内容', field: 'content', align: 'left' }
],
loadCallback: () => {
tableStore.table.data = [
{
time: '2023-10-01 12:00:00',
uesr: '张三',
sort: '1234567890',
outcome: '1',
content:
'①、2025-05-30 00:12:55 220kV龙泉站 220kV主变1#高压侧发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;②、2025-05-30 00:12:55 220kV龙泉站 220kV福泉II线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;③、2025-05-30 03:51:58 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.88p.u.(55.96 kV),持续时间:0.015s;④、2025-05-30 10:46:11 110kV八一站 10kV主变1#低压侧发生暂降事件,特征幅值:0.22p.u.(1.25 kV),持续时间:0.595s;⑤、2025-05-30 03:51:58 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.88 kV),持续时间:0.015s;⑥、2025-05-30 00:12:55 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.84p.u.(53.17 kV),持续时间:0.189s;⑦、2025-05-30 02:49:29 110kV昌洒站 35kV主变1#中压侧发生暂降事件,特征幅值:0.79p.u.(16.04 kV),持续时间:0.073s;⑧、2025-05-30 00:12:55 220kV龙泉站 220kV福泉I线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;⑨、2025-05-30 00:12:55 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.90 kV),持续时间:0.189s; 详情请登录海南电网电能质量监测系统查看!'
},
{
time: '2023-10-01 12:00:00',
uesr: '张三',
sort: '1234567890',
outcome: '2',
content:
'①、2025-05-30 00:12:55 220kV龙泉站 220kV主变1#高压侧发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;②、2025-05-30 00:12:55 220kV龙泉站 220kV福泉II线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;③、2025-05-30 03:51:58 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.88p.u.(55.96 kV),持续时间:0.015s;④、2025-05-30 10:46:11 110kV八一站 10kV主变1#低压侧发生暂降事件,特征幅值:0.22p.u.(1.25 kV),持续时间:0.595s;⑤、2025-05-30 03:51:58 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.88 kV),持续时间:0.015s;⑥、2025-05-30 00:12:55 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.84p.u.(53.17 kV),持续时间:0.189s;⑦、2025-05-30 02:49:29 110kV昌洒站 35kV主变1#中压侧发生暂降事件,特征幅值:0.79p.u.(16.04 kV),持续时间:0.073s;⑧、2025-05-30 00:12:55 220kV龙泉站 220kV福泉I线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;⑨、2025-05-30 00:12:55 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.90 kV),持续时间:0.189s; 详情请登录海南电网电能质量监测系统查看!'
},
{
time: '2023-10-01 12:00:00',
uesr: '张三',
sort: '1234567890',
outcome: '0',
content:
'①、2025-05-30 00:12:55 220kV龙泉站 220kV主变1#高压侧发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;②、2025-05-30 00:12:55 220kV龙泉站 220kV福泉II线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;③、2025-05-30 03:51:58 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.88p.u.(55.96 kV),持续时间:0.015s;④、2025-05-30 10:46:11 110kV八一站 10kV主变1#低压侧发生暂降事件,特征幅值:0.22p.u.(1.25 kV),持续时间:0.595s;⑤、2025-05-30 03:51:58 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.88 kV),持续时间:0.015s;⑥、2025-05-30 00:12:55 220kV龙泉站 110kV主变1#中压侧发生暂降事件,特征幅值:0.84p.u.(53.17 kV),持续时间:0.189s;⑦、2025-05-30 02:49:29 110kV昌洒站 35kV主变1#中压侧发生暂降事件,特征幅值:0.79p.u.(16.04 kV),持续时间:0.073s;⑧、2025-05-30 00:12:55 220kV龙泉站 220kV福泉I线发生暂降事件,特征幅值:0.86p.u.(109.56 kV),持续时间:0.189s;⑨、2025-05-30 00:12:55 220kV龙泉站 10kV主变1#低压侧发生暂降事件,特征幅值:0.85p.u.(4.90 kV),持续时间:0.189s; 详情请登录海南电网电能质量监测系统查看!'
}
]
}
})
provide('tableStore', tableStore)
tableStore.table.params.searchValue = ''
tableStore.table.params.searchState = ''
const deleteEven = (row: any) => {
if (tableStore.table.selection.length == 0) {
ElMessage({
type: 'warning',
message: '请选择要删除的数据'
})
} else {
ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// deleteQuitRunningDevice(tableStore.table.selection.map(item => item.id)).then(res => {
// ElMessage({
// type: 'success',
// message: '删除成功!'
// })
// tableStore.index()
// })
})
}
}
onMounted(() => {
tableStore.index()
})
</script>