Files
irc_web/src/views/dictionary/institutions/components/Hospitals.vue
T
caiyiling 615580331b
continuous-integration/drone/push Build is passing
后台管理页面调整
2025-03-12 14:42:05 +08:00

274 lines
7.5 KiB
Vue

<template>
<box-content>
<div class="search">
<el-form :inline="true" class="base-search-form">
<!-- Hospital -->
<el-form-item :label="$t('institutions:hospitals:label:hospital')">
<el-input v-model="searchData.HospitalName" style="width:100px;" />
</el-form-item>
<!-- Province -->
<el-form-item :label="$t('institutions:hospitals:label:province')">
<el-input v-model="searchData.Province" style="width:100px;" />
</el-form-item>
<!-- City -->
<el-form-item :label="$t('institutions:hospitals:label:city')">
<el-input v-model="searchData.City" style="width:100px;" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleSearch">
{{ $t('common:button:search') }}
</el-button>
<el-button
type="primary"
icon="el-icon-refresh-left"
@click="handleReset"
>
{{ $t('common:button:reset') }}
</el-button>
</el-form-item>
</el-form>
<span style="margin-left:auto;">
<el-button
type="primary"
@click="handleAddHospital"
>{{ $t('common:button:new') }}</el-button>
</span>
</div>
<!-- hospital列表 -->
<el-table
v-loading="loading"
v-adaptive="{bottomOffset:60}"
:data="list"
stripe
height="100"
@sort-change="handleSortByColumn"
>
<el-table-column type="index" width="40" />
<!-- Hospital -->
<el-table-column
prop="HospitalName"
:label="$t('institutions:hospitals:label:hospital')"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!-- Hospital CN -->
<el-table-column
prop="HospitalNameCN"
label="Hospital CN"
:label="$t('institutions:hospitals:label:hospitalCN')"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!-- University Affiliated -->
<el-table-column
prop="UniversityAffiliated"
:label="$t('institutions:hospitals:label:universityAffiliated')"
min-width="170"
show-overflow-tooltip
sortable="custom"
/>
<!-- University Affiliated CN -->
<el-table-column
prop="UniversityAffiliatedCN"
:label="$t('institutions:hospitals:label:universityAffiliatedCN')"
min-width="170"
show-overflow-tooltip
sortable="custom"
/>
<!-- Country -->
<el-table-column
prop="Country"
:label="$t('institutions:hospitals:label:country')"
width="120"
show-overflow-tooltip
sortable="custom"
/>
<!-- Country CN -->
<el-table-column
prop="CountryCN"
:label="$t('institutions:hospitals:label:countryCN')"
width="140"
show-overflow-tooltip
sortable="custom"
/>
<!-- Province -->
<el-table-column
prop="Province"
:label="$t('institutions:hospitals:label:province')"
width="120"
show-overflow-tooltip
sortable="custom"
/>
<!-- Province CN -->
<el-table-column
prop="ProvinceCN"
:label="$t('institutions:hospitals:label:provinceCN')"
width="140"
show-overflow-tooltip
sortable="custom"
/>
<!-- City -->
<el-table-column
prop="City"
:label="$t('institutions:hospitals:label:city')"
width="120"
show-overflow-tooltip
sortable="custom"
/>
<!-- City CN -->
<el-table-column
prop="CityCN"
:label="$t('institutions:hospitals:label:cityCN')"
width="130"
show-overflow-tooltip
sortable="custom"
/>
<el-table-column :label="$t('common:action:action')" width="150">
<template slot-scope="scope">
<el-button
type="text"
@click="handleEdit(scope.row)"
>
{{ $t('common:button:edit') }}
</el-button>
<el-button
type="text"
@click="handleDelete(scope.row)"
>
{{ $t('common:button:delete') }}
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination class="page" :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize" @pagination="getList" />
<el-dialog
v-if="editDialog.visible"
:visible.sync="editDialog.visible"
:close-on-click-modal="false"
:title="editDialog.title"
width="600px"
custom-class="base-dialog-wrapper"
>
<hospital-form v-if="editDialog.visible" :data="rowData" @close="close" @getList="getList" />
</el-dialog>
</box-content>
</template>
<script>
import { getHospitalPageList, deleteHospital } from '@/api/dictionary'
import BoxContent from '@/components/BoxContent'
import Pagination from '@/components/Pagination'
import HospitalForm from './HospitalForm'
const searchDataDefault = () => {
return {
HospitalName: '',
Province: '',
City: '',
PageIndex: 1,
PageSize: 20,
Asc: true,
SortField: ''
}
}
export default {
name: 'Hospitals',
components: { BoxContent, Pagination, HospitalForm },
data() {
return {
searchData: searchDataDefault(),
editDialog: { visible: false, title: '' },
list: [],
total: 0,
loading: false,
rowData: {}
}
},
mounted() {
this.getList()
},
methods: {
// 获取医院列表信息
getList() {
this.loading = true
getHospitalPageList(this.searchData).then(res => {
this.loading = false
this.list = res.Result.CurrentPageData
this.total = res.Result.TotalCount
}).catch(() => {
this.loading = false
})
},
// 新增医院信息
handleAddHospital() {
this.rowData = {}
this.editDialog.title = this.$t('common:button:new')
this.editDialog.visible = true
},
// 修改医院信息
handleEdit(row) {
this.rowData = row
this.editDialog.title = this.$t('common:action:edit')
this.editDialog.visible = true
},
// 删除医院信息
handleDelete(row) {
this.$confirm(this.$t('trials:uploadedDicoms:message:deleteMes'), {
type: 'warning',
distinguishCancelAndClose: true,
})
.then(() => {
this.loading = true
deleteHospital(row.Id)
.then(res => {
if (res.IsSuccess) {
this.list.splice(this.list.findIndex(item => item.Id === row.Id), 1)
this.$message.success(this.$t('common:message:deletedSuccessfully'))
}
this.loading = false
}).catch(() => {
this.loading = false
})
})
},
// 查询
handleSearch() {
this.searchData.PageIndex = 1
this.getList()
},
// 重置列表
handleReset() {
this.searchData = searchDataDefault()
this.getList()
},
// 指定排序字段,对列表进行排序
handleSortByColumn(column) {
if (column.order === 'ascending') {
this.searchData.Asc = true
} else {
this.searchData.Asc = false
}
this.searchData.SortField = column.prop
this.searchData.PageIndex = 1
this.getList()
},
// 关闭模态框
close() {
this.editDialog.visible = false
}
}
}
</script>
<style lang="scss" scoped>
.hospitals{
height: 100%;
}
</style>