maochaoying
2 years ago
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