hir_web/src/views/system/dicomAE/index.vue

321 lines
8.8 KiB
Vue

<template>
<div class="dicomAE">
<div ref="leftContainer" class="left">
<el-form :inline="true">
<!--AE Title-->
<el-form-item
:label="$t('system:dicom:search:AETitle')"
prop="CalledAE"
>
<el-input
v-model="searchData.CalledAE"
style="width: 140px"
clearable
/>
</el-form-item>
<!--IP-->
<el-form-item :label="$t('system:dicom:search:IP')" prop="IP">
<el-input v-model="searchData.IP" style="width: 140px" clearable />
</el-form-item>
<!--Port-->
<el-form-item :label="$t('system:dicom:search:Port')" prop="Port">
<el-input v-model="searchData.Port" style="width: 140px" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" size="mini" @click="getList">{{
$t("system:dicom:search:search")
}}</el-button>
<el-button type="primary" size="mini" @click="reset">{{
$t("system:dicom:search:reset")
}}</el-button>
<el-button
type="primary"
size="mini"
v-hasPermi="['system:dicom:add']"
@click="openDialog('add')"
>{{ $t("system:dicom:search:add") }}</el-button
>
</el-form-item>
</el-form>
<el-table
v-loading="loading"
v-adaptive="{ bottomOffset: 45 }"
height="100"
:data="list"
class="table"
ref="dicomAeTable"
@sort-change="handleSortChange"
:default-sort="{ prop: 'CreateTime', order: 'descending' }"
>
<!--AE Title-->
<el-table-column
:label="$t('system:dicom:table:AETitle')"
prop="CalledAE"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--IP-->
<el-table-column
:label="$t('system:dicom:table:IP')"
prop="IP"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--Port-->
<el-table-column
:label="$t('system:dicom:table:Port')"
prop="Port"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--Modality-->
<el-table-column
:label="$t('system:dicom:table:Modality')"
prop="Modality"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--Description-->
<el-table-column
:label="$t('system:dicom:table:Description')"
prop="Description"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--测试状态-->
<el-table-column
:label="$t('system:dicom:table:IsTestOK')"
prop="IsTestOK"
min-width="120"
show-overflow-tooltip
sortable="custom"
>
<template slot-scope="scope">
<el-tag :type="scope.row.IsTestOK ? 'success' : 'danger'">{{
$fd("IsTestOK", String(scope.row.IsTestOK))
}}</el-tag>
</template>
</el-table-column>
<!--创建时间-->
<el-table-column
:label="$t('system:dicom:table:CreateTime')"
prop="CreateTime"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<!--最后测试时间-->
<el-table-column
:label="$t('system:dicom:table:LatestTestTime')"
prop="LatestTestTime"
min-width="120"
show-overflow-tooltip
sortable="custom"
/>
<el-table-column
:label="$t('system:dicom:table:action')"
fixed="right"
prop="UserTypeShortName"
show-overflow-tooltip
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
v-hasPermi="['system:dicom:edit']"
@click="openDialog('edit', scope.row)"
>{{ $t("system:dicom:action:edit") }}</el-button
>
<el-button
size="mini"
type="text"
v-hasPermi="['system:dicom:del']"
@click="delAE(scope.row)"
>{{ $t("system:dicom:action:remove") }}</el-button
>
<el-button size="mini" type="text" @click="test(scope.row)">{{
$t("system:dicom:action:test")
}}</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination" style="text-align: right; margin-top: 5px">
<pagination
:total="total"
:page.sync="searchData.PageIndex"
:limit.sync="searchData.PageSize"
@pagination="getList"
/>
</div>
</div>
<editDicom
:visible.sync="editDicomVisible"
:title="editDicomTitle"
:dicom="DICOM"
@getList="getList"
/>
</div>
</template>
<script>
import Pagination from "@/components/Pagination";
import editDicom from "./components/edit-dicom";
import { getDicomAEList, deleteDiicomAE, testConnect } from "@/api/dicomAE.js";
const defaultSearchData = () => {
return {
CalledAE: null,
IP: null,
Port: null,
PageIndex: 1,
PageSize: 10,
SortField: "CreateTime",
Asc: false,
};
};
export default {
name: "dicomAE",
components: { Pagination, editDicom },
data() {
return {
// 查询
searchData: defaultSearchData(),
total: 0,
// 列表
loading: false,
list: [],
// 弹窗
editDicomVisible: false,
editDicomTitle: "",
DICOM: {},
};
},
created() {
this.getList();
},
methods: {
// 表格排序
handleSortChange(sort) {
this.searchData.SortField = sort.prop;
if (sort.order === "ascending") this.searchData.Asc = true;
if (sort.order === "descending") this.searchData.Asc = false;
if (!sort.order) this.searchData.SortField = null;
this.getList();
},
// 获取列表
async getList() {
let data = {};
Object.keys(this.searchData).forEach((key) => {
data[key] = this.searchData[key];
});
try {
this.loading = true;
let res = await getDicomAEList(data);
this.loading = false;
if (res.IsSuccess) {
this.list = res.Result.CurrentPageData;
this.total = res.Result.TotalCount;
}
} catch (err) {
console.log(err);
}
},
// 重置
reset() {
this.searchData = defaultSearchData();
this.$refs.dicomAeTable.clearSort();
this.getList();
},
// 打开弹框
openDialog(key, item = {}) {
this.editDicomVisible = true;
this.editDicomTitle = this.$t("system:dicom:action:edit");
if (key === "add") {
this.editDicomTitle = this.$t("system:dicom:search:add");
}
this.DICOM = JSON.parse(JSON.stringify(item));
},
// 删除
async delAE(item) {
try {
let confirm = await this.$confirm(
this.$t("trials:staffResearch:message:confirmDel"),
this.$t("trials:uploadDicomList:label:prompt"),
{
confirmButtonText: this.$t("trials:reviewTrack:impactList:save"),
cancelButtonText: this.$t("common:button:cancel"),
type: "warning",
}
);
if (confirm !== "confirm") return;
let res = await deleteDiicomAE(item.Id);
if (res.IsSuccess) {
this.$message.success(
this.$t("trials:crcUpload:message:deleteVisitSuccessfully")
);
this.getList();
}
} catch (err) {
console.log(err);
}
},
// 测试连通性
async test(item) {
try {
this.loading = true;
let res = await testConnect(item.Id);
this.loading = false;
if (res.IsSuccess && res.Result) {
this.$message.success(this.$t("system:dicomAE:connect:success"));
} else {
this.$message.error(this.$t("system:dicomAE:connect:error"));
}
this.getList();
} catch (err) {
console.log(err);
this.loading = false;
}
},
},
};
</script>
<style lang="scss" scoped>
.dicomAE {
height: 100%;
box-sizing: border-box;
display: flex;
padding: 10px;
border-radius: 5px;
.left {
display: flex;
flex-direction: column;
width: 0;
flex-grow: 4;
// border-right: 1px solid #ccc;
.filter-container {
display: flex;
align-items: center;
margin: 5px;
}
.data-table {
flex: 1;
padding: 5px 0px;
}
.pagination-container {
text-align: right;
}
}
.right {
width: 0;
flex-grow: 6;
overflow-y: auto;
border-right: 1px solid #ccc;
}
.selected-row {
background-color: cadetblue;
}
}
</style>