134 lines
3.8 KiB
Vue
134 lines
3.8 KiB
Vue
<template>
|
|
<FormPage
|
|
ref="formPage"
|
|
:action-column="actionColumn"
|
|
:left-tools="leftTools"
|
|
:paging="paging">
|
|
<template #searchFormItem="{ searchForm }">
|
|
<ElFormItem label="站点名称">
|
|
<ElInput
|
|
v-model="searchForm.stationName"
|
|
placeholder="站点名称"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="省">
|
|
<ElInput
|
|
v-model="searchForm.provinceName"
|
|
placeholder="请输入省"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="市">
|
|
<ElInput
|
|
v-model="searchForm.cityName"
|
|
placeholder="请输入市"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="区县">
|
|
<ElInput
|
|
v-model="searchForm.areaName"
|
|
placeholder="请输入区县"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="乡镇街道">
|
|
<ElInput
|
|
v-model="searchForm.townName"
|
|
placeholder="请输入乡镇街道"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="详细地址">
|
|
<ElInput
|
|
v-model="searchForm.address"
|
|
placeholder="详细地址"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="经度">
|
|
<ElInput
|
|
v-model="searchForm.lng"
|
|
placeholder="经度"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="纬度">
|
|
<ElInput
|
|
v-model="searchForm.lat"
|
|
placeholder="纬度"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="创建时间">
|
|
<ElInput
|
|
v-model="searchForm.createTime"
|
|
placeholder="创建时间"/>
|
|
</ElFormItem>
|
|
<ElFormItem label="修改时间">
|
|
<ElInput
|
|
v-model="searchForm.modifyTime"
|
|
placeholder="修改时间"/>
|
|
</ElFormItem>
|
|
</template>
|
|
<template #columns>
|
|
<ElTableColumn label="所属公司" prop="org.orgName"/>
|
|
<ElTableColumn label="站点名称" prop="stationName"/>
|
|
<ElTableColumn label="省" prop="provinceName"/>
|
|
<ElTableColumn label="市" prop="cityName"/>
|
|
<ElTableColumn label="区县" prop="areaName"/>
|
|
<ElTableColumn label="乡镇街道" prop="townName"/>
|
|
<ElTableColumn label="详细地址" prop="address" width="160px"/>
|
|
<ElTableColumn label="经度" prop="lng" width="100px"/>
|
|
<ElTableColumn label="纬度" prop="lat" width="100px"/>
|
|
<ElTableColumn label="创建时间" prop="createTime" width="170px"/>
|
|
<ElTableColumn label="修改时间" prop="modifyTime" width="170px"/>
|
|
</template>
|
|
<StationForm ref="stationForm" @edit-succ="research"/>
|
|
</FormPage>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import StationApi from '@/pages/cst/station/station-api.ts'
|
|
import StationForm from '@/pages/cst/station/StationForm.vue'
|
|
import FormPage, {
|
|
type ActionColumnType,
|
|
type ToolType,
|
|
} from '@/components/page/FormPage.vue'
|
|
import type { ComponentExposed } from 'vue-component-type-helpers'
|
|
|
|
const stationFormIns = useTemplateRef<InstanceType<typeof StationForm>>('stationForm')
|
|
const formPageIns = useTemplateRef<ComponentExposed<typeof FormPage>>('formPage')
|
|
|
|
const actionColumn = reactive<ActionColumnType<StationTypes.SearchStationResult>>({
|
|
tableActions: [
|
|
{
|
|
tooltip: '编辑',
|
|
icon: 'Edit',
|
|
action({row}) {
|
|
stationFormIns.value?.open(row)
|
|
},
|
|
},
|
|
{
|
|
icon: 'Delete',
|
|
loading: false,
|
|
type: 'danger',
|
|
tooltip: '删除',
|
|
confirm: {
|
|
title: '是否删除当前数据',
|
|
},
|
|
action({row}) {
|
|
return StationApi.del([ row.id! ])
|
|
.then(() => {
|
|
ElMessage.success('删除成功')
|
|
return true
|
|
})
|
|
},
|
|
},
|
|
],
|
|
})
|
|
const leftTools: ToolType[] = [
|
|
{
|
|
icon: 'Plus',
|
|
label: '新建',
|
|
action() {
|
|
stationFormIns.value?.open()
|
|
},
|
|
},
|
|
]
|
|
|
|
function research() {
|
|
formPageIns.value?.doSearch()
|
|
}
|
|
|
|
function paging(params: StationTypes.SearchStationParam) {
|
|
return StationApi.paging(params)
|
|
}
|
|
|
|
</script>
|