201 lines
4.2 KiB
JavaScript
201 lines
4.2 KiB
JavaScript
|
|
import { h, ref, onMounted, reactive, watch, toRaw, nextTick } from "vue";
|
||
|
|
import { request } from "@/utils/request";
|
||
|
|
import { useRoute, useRouter } from 'vue-router'
|
||
|
|
|
||
|
|
const tableData = ref([]); // 表格数据
|
||
|
|
|
||
|
|
const modelVisible = ref(false); // 弹窗状态
|
||
|
|
const drawerVisible = ref(false); // 抽屉状态
|
||
|
|
// 弹窗内容
|
||
|
|
const model = reactive({
|
||
|
|
title: '',
|
||
|
|
content: null,
|
||
|
|
props: {},
|
||
|
|
onCancel: null,
|
||
|
|
onConfirm: null,
|
||
|
|
width: '',
|
||
|
|
});
|
||
|
|
const form = reactive({
|
||
|
|
});
|
||
|
|
const INIT_FORM = {
|
||
|
|
|
||
|
|
};
|
||
|
|
// 抽屉内容
|
||
|
|
const drawer = reactive({
|
||
|
|
title: '',
|
||
|
|
content: null,
|
||
|
|
props: {},
|
||
|
|
onCancel: null,
|
||
|
|
onConfirm: null,
|
||
|
|
direction: 'rtl',
|
||
|
|
size: '50%'
|
||
|
|
});
|
||
|
|
const dialogRef = ref(null); // 弹窗实例
|
||
|
|
const drawerRef = ref(null); // 抽屉实例
|
||
|
|
|
||
|
|
const columns = [
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "所属区县",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "项目名称",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地名称",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地类型",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "坐标点位",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "所属项目名称",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "项目类型",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "建设单位",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "施工单位",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地地址",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "行政区域",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地人数",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地风险等级",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "房建类型",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "搬迁状态",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "吹哨人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "建设单位包保责任人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "施工单位包保责任人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "驻地包保责任人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "区县级包保责任人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "市级包保责任人/电话",
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: "xxx",
|
||
|
|
label: "备注",
|
||
|
|
},
|
||
|
|
]
|
||
|
|
|
||
|
|
// 过滤条件
|
||
|
|
const filterData = reactive({
|
||
|
|
title: "",
|
||
|
|
type: "",
|
||
|
|
warningLevel: "",
|
||
|
|
})
|
||
|
|
// 分页
|
||
|
|
const pagination = reactive({
|
||
|
|
current: 1,
|
||
|
|
pageSize: 10,
|
||
|
|
total: 0,
|
||
|
|
pageSizes: [10, 20, 50],
|
||
|
|
layout: "prev, pager, next, jumper",
|
||
|
|
onChange: (page, pageSize) => {
|
||
|
|
pagination.current = page;
|
||
|
|
pagination.pageSize = pageSize;
|
||
|
|
getTableData(filterData);
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|
||
|
|
// 获取列表
|
||
|
|
const getTableData = async (filterData) => {
|
||
|
|
try {
|
||
|
|
const res = await request({
|
||
|
|
url: '',
|
||
|
|
method: "GET",
|
||
|
|
params: {
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|
||
|
|
} catch (error) {
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// 预警类型选项
|
||
|
|
const typeOptions = [
|
||
|
|
{ label: "全部", value: "" },
|
||
|
|
{ label: "台风预警", value: "台风预警" },
|
||
|
|
{ label: "暴雨预警", value: "暴雨预警" },
|
||
|
|
{ label: "寒潮预警", value: "寒潮预警" },
|
||
|
|
{ label: "大雾预警", value: "大雾预警" },
|
||
|
|
{ label: "暴雪预警", value: "暴雪预警" },
|
||
|
|
{ label: "道路结冰预警", value: "道路结冰预警" },
|
||
|
|
{ label: "雷电预警", value: "雷电预警" },
|
||
|
|
{ label: "强对流预警", value: "强对流预警" },
|
||
|
|
];
|
||
|
|
|
||
|
|
// 预警级别选项
|
||
|
|
const warningLevelOptions = [
|
||
|
|
{ label: "全部", value: "" },
|
||
|
|
{ label: "红色预警", value: "红色预警" },
|
||
|
|
{ label: "橙色预警", value: "橙色预警" },
|
||
|
|
{ label: "黄色预警", value: "黄色预警" },
|
||
|
|
{ label: "蓝色预警", value: "蓝色预警" },
|
||
|
|
]
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
export default () => {
|
||
|
|
return {
|
||
|
|
modelVisible,
|
||
|
|
model,
|
||
|
|
drawerVisible,
|
||
|
|
drawer,
|
||
|
|
dialogRef,
|
||
|
|
drawerRef,
|
||
|
|
|
||
|
|
|
||
|
|
tableData,
|
||
|
|
filterData,
|
||
|
|
pagination,
|
||
|
|
columns,
|
||
|
|
}
|
||
|
|
}
|