irc_web/src/views/dictionary/template/components/ClinicalDataConfig.vue

306 lines
8.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<box-content>
<!-- 搜索框 -->
<div class="search">
<el-form :inline="true" size="mini" class="base-search-form">
<el-form-item label="临床数据名称">
<el-input v-model="searchData.ClinicalDataSetName" />
</el-form-item>
<el-form-item label="数据级别">
<el-select v-model="searchData.ClinicalDataLevel" clearable style="width:120px;">
<el-option
v-for="(item,index) of $d.ClinicalLevel"
:key="index"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="传输方式">
<el-select v-model="searchData.ClinicalUploadType" clearable style="width:120px;">
<el-option
v-for="(item,index) of $d.ClinicalUploadType"
:key="index"
:label="item.label"
:value="item.value"
/>
</el-select>
</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" size="mini" @click="handleAdd">新增</el-button>
</span>
</div>
<el-table
v-loading="loading"
v-adaptive="{bottomOffset:45}"
:data="list"
stripe
size="small"
height="100"
>
<el-table-column type="index" width="60" />
<el-table-column
prop="ClinicalDataSetName"
label="临床数据名称"
show-overflow-tooltip
/>
<el-table-column
prop="ClinicalDataSetEnName"
label="临床数据名称EN"
show-overflow-tooltip
/>
<el-table-column
prop="UploadRole"
:label="$t('trials:uploadMonitor:table:uploader')"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ $fd('ClinicalDataUploadRole',scope.row.UploadRole) }}
</template>
</el-table-column>
<el-table-column
prop="ClinicalDataLevel"
label="数据级别"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ $fd('ClinicalLevel',scope.row.ClinicalDataLevel) }}
</template>
</el-table-column>
<el-table-column
prop="ClinicalUploadType"
label="传输方式"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ $fd('ClinicalUploadType',scope.row.ClinicalUploadType) }}
</template>
</el-table-column>
<el-table-column
prop="CriterionEnumList"
:label="$t('trials:auditRecord:table:criterion')"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ scope.row.CriterionEnumList.map(v => $fd('CriterionType', v)).toString() }}
</template>
</el-table-column>
<el-table-column
prop="FileName"
label="模板名称"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ scope.row.FileName }}
</template>
</el-table-column>
<el-table-column
prop="EnFileName"
label="模板英文名称"
show-overflow-tooltip
>
<template slot-scope="scope">
{{ scope.row.EnFileName }}
</template>
</el-table-column>
<el-table-column
prop="IsEnable"
label="状态"
show-overflow-tooltip
>
<template slot-scope="scope">
<el-tag v-if="scope.row.IsEnable">启用</el-tag>
<el-tag v-else type="danger">禁用</el-tag>
</template>
</el-table-column>
<el-table-column
prop="CreateTime"
label="创建时间"
show-overflow-tooltip
/>
<el-table-column label="操作" width="340" fixed="right">
<template slot-scope="scope">
<el-button
type="primary"
size="mini"
:disabled="scope.row.ClinicalUploadType !== 2"
@click="handleConfigQuestion(scope.row)"
>
问题配置
</el-button>
<el-button
v-if="$i18n.locale === 'zh'"
type="primary"
size="mini"
:disabled="!scope.row.FileName"
@click="handleDownloadTpl(scope.row.Path)"
>
下载
</el-button>
<el-button
v-else
type="primary"
size="mini"
:disabled="!scope.row.EnFileName"
@click="handleDownloadTpl(scope.row.EnPath)"
>
下载
</el-button>
<el-button
type="primary"
size="mini"
@click="handleEdit(scope.row)"
>
编辑
</el-button>
<el-button
type="danger"
size="mini"
@click="handleDelete(scope.row)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog
v-if="addOrEditCD.visible"
:visible.sync="addOrEditCD.visible"
:close-on-click-modal="false"
:title="addOrEditCD.title"
width="500px"
append-to-body
custom-class="base-dialog-wrapper"
>
<ClinicalDataForm ref="addOrEditCD" :data="currentRow" @close="addOrEditCD.visible = false" @getList="getList" />
</el-dialog>
<el-dialog
v-if="QuestionConfigVisible.visible"
:visible.sync="QuestionConfigVisible.visible"
:close-on-click-modal="false"
:title="QuestionConfigVisible.title"
width="1600px"
append-to-body
custom-class="base-dialog-wrapper"
>
<ClinicalQuestionConfig ref="QuestionConfigVisible" :data="currentRow" @close="QuestionConfigVisible.visible = false" @getList="getList" />
</el-dialog>
</box-content>
</template>
<script>
import { getClinicalDataSetList, deleteClinicalSetData, DownloadSystemClinicalFile } from '@/api/dictionary'
import BoxContent from '@/components/BoxContent'
import ClinicalDataForm from './ClinicalDataForm'
import ClinicalQuestionConfig from './ClinicalQuestionConfig'
const searchDataDefault = () => {
return {
ClinicalDataSetName: '',
ClinicalDataLevel: null,
ClinicalUploadType: null
}
}
export default {
name: 'ClinicalDataTemplate',
components: { BoxContent, ClinicalDataForm, ClinicalQuestionConfig },
data() {
return {
searchData: searchDataDefault(),
list: [],
total: 0,
loading: false,
currentRow: {},
addOrEditCD: { visible: false, title: '' },
QuestionConfigVisible: { visible: false, title: '' }
}
},
mounted() {
this.getList()
},
methods: {
handleConfigQuestion(row) {
this.currentRow = { ...row }
this.QuestionConfigVisible.visible = true
this.QuestionConfigVisible.title = '问题配置'
},
// 获取列表信息
getList() {
this.loading = true
getClinicalDataSetList(this.searchData).then(res => {
this.loading = false
this.list = res.Result
}).catch(() => { this.loading = false })
},
// 新增
handleAdd() {
this.currentRow = {}
this.addOrEditCD.title = '新增'
this.addOrEditCD.visible = true
},
// 编辑
handleEdit(row) {
this.currentRow = { ...row }
this.addOrEditCD.title = '编辑'
this.addOrEditCD.visible = true
},
// 删除
handleDelete(row) {
this.$confirm(this.$t('trials:staffResearch:message:confirmDel'), {
type: 'warning',
distinguishCancelAndClose: true
})
.then(() => {
this.loading = true
deleteClinicalSetData(row.Id)
.then(res => {
this.loading = false
if (res.IsSuccess) {
this.getList()
this.$message.success('删除成功!')
}
}).catch(() => { this.loading = false })
})
},
handleDownloadTpl(path) {
window.open(this.OSSclientConfig.basePath + path, '_blank')
},
// 排序
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()
},
// 查询
handleSearch() {
this.getList()
},
// 重置
handleReset() {
this.searchData = searchDataDefault()
this.getList()
}
}
}
</script>