4 changed files with 174 additions and 7 deletions
-
15src/api/info.js
-
153src/components/Nuclear.vue
-
1src/components/Publish.vue
-
12src/pages/index.vue
@ -0,0 +1,15 @@ |
|||||
|
import request from '@/service' |
||||
|
|
||||
|
export const stationListApi = () => { |
||||
|
return request({ |
||||
|
url: '/station/list', |
||||
|
method: 'GET', |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export const coreListApi = () => { |
||||
|
return request({ |
||||
|
url: '/core/list', |
||||
|
method: 'GET', |
||||
|
}) |
||||
|
} |
@ -0,0 +1,153 @@ |
|||||
|
<template> |
||||
|
<div class="nuclear_container"> |
||||
|
<t-tabs :value="tabValue" @change="newValue => (tabValue = newValue)"> |
||||
|
<t-tab-panel value="first" label="核电站信息管理"> |
||||
|
<div style="padding: 25px"> |
||||
|
<t-button |
||||
|
style="margin-bottom: 25px" |
||||
|
theme="primary" |
||||
|
@click="stationVisible = true" |
||||
|
>新增核电站</t-button |
||||
|
> |
||||
|
<t-dialog |
||||
|
header="新增核电站" |
||||
|
:visible="stationVisible" |
||||
|
:footer="false" |
||||
|
:onClose="stationClose" |
||||
|
> |
||||
|
<template v-slot:body> |
||||
|
<div>这是使用插槽定义的对话框内容</div> |
||||
|
</template> |
||||
|
</t-dialog> |
||||
|
|
||||
|
<t-table |
||||
|
bordered |
||||
|
hover |
||||
|
stripe |
||||
|
resizable |
||||
|
tableLayout="auto" |
||||
|
row-key="id" |
||||
|
:data="stationList" |
||||
|
:columns="stationColumns" |
||||
|
/> |
||||
|
</div> |
||||
|
</t-tab-panel> |
||||
|
<t-tab-panel value="second" label="核芯堆信息管理"> |
||||
|
<div style="padding: 25px"> |
||||
|
<t-button |
||||
|
theme="primary" |
||||
|
style="margin-bottom: 25px" |
||||
|
@click="coreVisible = true" |
||||
|
>新增核芯堆</t-button |
||||
|
> |
||||
|
<t-dialog |
||||
|
header="新增核芯堆" |
||||
|
:visible="coreVisible" |
||||
|
:footer="false" |
||||
|
:onClose="coreClose" |
||||
|
> |
||||
|
<template v-slot:body> |
||||
|
<div>这是使用插槽定义的对话框内容</div> |
||||
|
</template> |
||||
|
</t-dialog> |
||||
|
<t-table |
||||
|
bordered |
||||
|
hover |
||||
|
stripe |
||||
|
resizable |
||||
|
tableLayout="auto" |
||||
|
row-key="id" |
||||
|
:data="coreList" |
||||
|
:columns="coreColumns" |
||||
|
/> |
||||
|
</div> |
||||
|
</t-tab-panel> |
||||
|
</t-tabs> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="jsx"> |
||||
|
import { stationListApi, coreListApi } from '@/api/info' |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
tabValue: 'first', |
||||
|
stationVisible: false, |
||||
|
coreVisible: false, |
||||
|
stationColumns: [ |
||||
|
{ |
||||
|
colKey: 'name', |
||||
|
title: '名称', |
||||
|
}, |
||||
|
{ |
||||
|
colKey: 'address', |
||||
|
title: '地址', |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
cell: (h, { row }) => ( |
||||
|
<div> |
||||
|
<t-button theme="danger" onClick={() => this.delStation(row.id)}> |
||||
|
删除 |
||||
|
</t-button> |
||||
|
</div> |
||||
|
), |
||||
|
}, |
||||
|
], |
||||
|
stationList: [], |
||||
|
coreList: [], |
||||
|
coreColumns: [ |
||||
|
{ |
||||
|
colKey: 'name', |
||||
|
title: '名称', |
||||
|
}, |
||||
|
{ |
||||
|
colKey: 'serialNumber', |
||||
|
title: '序列号', |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
cell: (h, { row }) => ( |
||||
|
<div> |
||||
|
<t-button theme="danger" onClick={() => this.delCore(row.id)}> |
||||
|
删除 |
||||
|
</t-button> |
||||
|
</div> |
||||
|
), |
||||
|
}, |
||||
|
], |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
delStation(id) {}, |
||||
|
delCore(id) {}, |
||||
|
stationClose() { |
||||
|
this.stationVisible = false |
||||
|
}, |
||||
|
coreClose() { |
||||
|
this.coreVisible = false |
||||
|
}, |
||||
|
async getStationList() { |
||||
|
const res = await stationListApi() |
||||
|
if (res?.code == 200) { |
||||
|
this.stationList = res?.data?.list |
||||
|
} |
||||
|
}, |
||||
|
async getCoreList() { |
||||
|
const res = await coreListApi() |
||||
|
if (res?.code == 200) { |
||||
|
this.coreList = res?.data?.list |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.getStationList() |
||||
|
this.getCoreList() |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.nuclear_container { |
||||
|
} |
||||
|
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue