绘制技术监督页面 联调承载能力评估
This commit is contained in:
@@ -0,0 +1,63 @@
|
||||
<template>
|
||||
<el-row :gutter="20" :style="{ height: height }">
|
||||
<el-col :span="9" class="col1">
|
||||
<policyTree @tactics="tactics"/>
|
||||
</el-col>
|
||||
<el-col :span="15" class="col1">
|
||||
<div class="mb10" style="height: 32px">
|
||||
<el-button type="primary" icon="el-icon-Plus">新增策略</el-button>
|
||||
</div>
|
||||
<div :style="`height: calc(${height} - 43px)`">
|
||||
<vxe-table ref="tableRef" height="auto" :data="dataList" v-bind="defaultAttribute">
|
||||
<vxe-column field="name" title="策略名称"></vxe-column>
|
||||
<vxe-column field="type" title="策略类型">
|
||||
<template #default="{ row }">
|
||||
{{ row.type === 0 ? '预警单' : '告警单' }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="grade" title="策略等级">
|
||||
<template #default="{ row }">
|
||||
{{ row.grade === 0 ? '自动策略' : row.grade === 1 ? '手动策略' : '排他策略' }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="state" title="状态">
|
||||
<template #default="{ row }">
|
||||
<el-switch
|
||||
v-model.number="row.state"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949"
|
||||
:active-value="1"
|
||||
:inactive-value="2"
|
||||
@change="stateChange($event, row.id)"
|
||||
></el-switch>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column title="操作">
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" size="small" link>查看</el-button>
|
||||
<el-button type="primary" size="small" link>修改</el-button>
|
||||
<el-button type="primary" size="small" link>删除</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import policyTree from '@/components/tree/pqs/policyTree.vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { ref, reactive } from 'vue'
|
||||
const height = mainHeight(80).height
|
||||
const dataList = ref([{}])
|
||||
|
||||
const stateChange = (val: number, id: number) => {}
|
||||
const tactics = (row: any, id: number) => {
|
||||
console.log("🚀 ~ tactics ~ row:", row,id)
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
192
src/views/pqs/supervise/technology/components/technology.vue
Normal file
192
src/views/pqs/supervise/technology/components/technology.vue
Normal file
@@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<TableHeader datePicker ref="TableHeaderRef">
|
||||
<template #select>
|
||||
<el-form-item label="筛选数据">
|
||||
<el-input
|
||||
v-model="tableStore.table.params.searchValue"
|
||||
clearable
|
||||
placeholder="请选择筛选数据"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="事务类型:">
|
||||
<el-select v-model="tableStore.table.params.type" clearable placeholder="请选择事务类型">
|
||||
<el-option
|
||||
v-for="item in affairs"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属流程:">
|
||||
<el-select v-model="tableStore.table.params.searchState" placeholder="请选择所属流程">
|
||||
<el-option
|
||||
v-for="item in process"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Plus" type="primary" @click="add">新建</el-button>
|
||||
<el-button icon="el-icon-Plus" type="primary" @click="add">上传模板</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
|
||||
|
||||
const dictData = useDictData()
|
||||
const process = [
|
||||
{
|
||||
name: '开始',
|
||||
id: '0'
|
||||
},
|
||||
{
|
||||
name: '预/告警单下发',
|
||||
id: '1'
|
||||
},
|
||||
{
|
||||
name: '反馈单上传',
|
||||
id: '2'
|
||||
},
|
||||
{
|
||||
name: '现场测试',
|
||||
id: '3'
|
||||
},
|
||||
{
|
||||
name: '整改通知单下发',
|
||||
id: '4'
|
||||
},
|
||||
{
|
||||
name: '整改通知单反馈',
|
||||
id: '5'
|
||||
},
|
||||
{
|
||||
name: '完结',
|
||||
id: '6'
|
||||
}
|
||||
]
|
||||
const affairs = [
|
||||
{
|
||||
name: '预警单',
|
||||
id: '0'
|
||||
},
|
||||
{
|
||||
name: '告警单',
|
||||
id: '1'
|
||||
}
|
||||
]
|
||||
const dialogVisible = ref(false)
|
||||
const TableHeaderRef = ref()
|
||||
const title = ref('')
|
||||
|
||||
const ruleFormRef = ref()
|
||||
const tableStore = new TableStore({
|
||||
url: '/system-boot/area/areaSelect',
|
||||
publicHeight: 65,
|
||||
method: 'POST',
|
||||
column: [
|
||||
{ field: 'name', title: '名称' },
|
||||
{
|
||||
field: 'grade',
|
||||
title: '等级'
|
||||
},
|
||||
{ field: 'bigType', title: '策略选择' },
|
||||
{ field: 'updateBy', title: '更新人员' },
|
||||
{ field: 'updateTime', title: '更新时间' },
|
||||
{
|
||||
field: 'state',
|
||||
title: '状态',
|
||||
activeValue: '2',
|
||||
inactiveValue: '1',
|
||||
render: 'switch',
|
||||
onChangeField: (row: any, value) => {
|
||||
console.log('🚀 ~ row:', 444123, value)
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
title: '操作',
|
||||
width: '180',
|
||||
render: 'buttons',
|
||||
buttons: [
|
||||
{
|
||||
name: 'edit',
|
||||
title: '绑定',
|
||||
type: 'primary',
|
||||
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: row => {}
|
||||
},
|
||||
{
|
||||
name: 'edit',
|
||||
title: '编辑',
|
||||
type: '',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: async row => {}
|
||||
},
|
||||
{
|
||||
name: 'del',
|
||||
text: '删除',
|
||||
type: 'danger',
|
||||
icon: 'el-icon-Delete',
|
||||
render: 'confirmButton',
|
||||
popconfirm: {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
confirmButtonType: 'danger',
|
||||
title: '确定删除？'
|
||||
},
|
||||
click: row => {
|
||||
removeUse({ userIds: row.userId }).then(res => {
|
||||
ElMessage.success('删除成功')
|
||||
tableStore.index()
|
||||
})
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
loadCallback: () => {
|
||||
tableStore.table.data = [
|
||||
{
|
||||
state: 2
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
|
||||
tableStore.table.params.searchState = ''
|
||||
tableStore.table.params.searchValue = ''
|
||||
tableStore.table.params.type = ''
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
|
||||
// 新增
|
||||
const add = () => {
|
||||
title.value = '新增告警单'
|
||||
dialogVisible.value = true
|
||||
}
|
||||
</script>
|
||||
@@ -1,15 +1,39 @@
|
||||
<template>
|
||||
|
||||
<div>123
|
||||
|
||||
|
||||
general
|
||||
<div class="default-main">
|
||||
<el-tabs v-model="activeName" type="border-card">
|
||||
<el-tab-pane label="概览" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="技术监督管理" name="2"><technology /></el-tab-pane>
|
||||
<el-tab-pane label="告警单策略管理" name="3">
|
||||
<earlyWarning />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="预警单策略管理" name="4"><earlyWarning /></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { ref, reactive } from 'vue'
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
<script setup lang="ts">
|
||||
import technology from './components/technology.vue'
|
||||
import earlyWarning from './components/earlyWarning.vue'
|
||||
import { onMounted, reactive, ref, provide } from 'vue'
|
||||
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
defineOptions({
|
||||
name: 'Processsupervision/supervision/manage'
|
||||
})
|
||||
const activeName = ref('1')
|
||||
const Statistics = ref()
|
||||
const compatibility = ref()
|
||||
|
||||
const layout = mainHeight(63) as any
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bars_w {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
::v-deep(.el-tabs__content) {
|
||||
height: v-bind('layout.height');
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user