64 lines
2.8 KiB
Vue
64 lines
2.8 KiB
Vue
<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>
|