You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

397 lines
13 KiB

<template>
<div class="" style="width: 100%;display: flex;margin-top: 15px;">
<div style="width: 90%">
<el-table :data="tableData" style="width: 100%" class="el-table__body-wrapper tbody" border
:height="window.pageHeight < 600 ? 260 : window.pageHeight - 340" @row-click="rowick" highlight-current-row>
<el-table-column prop="forSexId" label="性别" align="center">
<template slot-scope="scope">
<div>
{{ ldddw(forSexId, "id", scope.row.forSexId, "displayName") }}
</div>
</template>
</el-table-column>
<el-table-column prop="ageLowerLimit" label="年龄上限" align="center" />
<el-table-column prop="ageUpperLimit" label="年龄下限" align="center" />
<el-table-column prop="referenceRangeValue" label="参考范围" align="center" />
<el-table-column prop="followUpRangeValue" label="随访范围" align="center" />
<el-table-column prop="criticalRangeValue" label="危急范围" align="center" />
<el-table-column prop="lowerDiagnosisId" label="偏低诊断" align="center">
<template slot-scope="scope">
<div>
{{
ldddw(
diagnosis,
"id",
scope.row.lowerDiagnosisId,
"displayName"
)
}}
</div>
</template>
</el-table-column>
<el-table-column prop="upperDiagnosisId" label="偏高诊断" align="center">
<template slot-scope="scope">
<div>
{{
ldddw(
diagnosis,
"id",
scope.row.upperDiagnosisId,
"displayName"
)
}}
</div>
</template>
</el-table-column>
<!-- <el-table-column label="操作">
<template>
<el-tag
class="move"
style="cursor: move; margin-left: 15px"
draggable="true"
>
<i class="el-icon-d-caret" style="width: 1rem; height: 1rem"></i>
</el-tag>
</template>
</el-table-column> -->
</el-table>
</div>
<!-- 按钮区域 -->
<div style="margin-left: 10px;" class="editButton">
<div>
<el-button type="" @click="add" class="commonbutton">新增</el-button>
</div>
<div style="margin-top: 5px;">
<el-button type="" @click="edit" class="commonbutton">编辑</el-button>
</div>
<div style="margin-top: 5px;">
<el-button type="" @click="del" class="deleteButton">删除</el-button>
</div>
</div>
<!-- 新增或者编辑弹框 -->
<el-dialog :title="id ? '编辑' : '新增'" :visible.sync="dialogVisible" width="70%" :append-to-body="true">
<el-form ref="form" :model="form" label-width="100px" :rules="rules">
<el-row>
<el-col :span="8">
<el-form-item label="性别" prop="forSexId">
<el-select v-model="form.forSexId" placeholder="请选择" size="small">
<el-option v-for="item in forSexId" :key="item.id" :label="item.displayName" :value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="年龄下限" prop="ageLowerLimit">
<el-input v-model="form.ageLowerLimit" size="small"></el-input> </el-form-item></el-col>
<el-col :span="8">
<el-form-item label="年龄上限" prop="ageUpperLimit">
<el-input v-model="form.ageUpperLimit" size="small"></el-input> </el-form-item></el-col>
<el-col :span="8">
<el-form-item label="参考范围" prop="referenceRangeValue">
<el-input v-model="form.referenceRangeValue" size="small"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="随访范围" prop="followUpRangeValue">
<el-input v-model="form.followUpRangeValue" size="small"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="危急值范围" prop="criticalRangeValue">
<el-input v-model="form.criticalRangeValue" size="small"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="偏低诊断" prop="">
<el-select v-model="form.lowerDiagnosisId" placeholder="请选择" filterable :filter-method="remoteMethods"
default-first-option clearable popper-class="diagnosisSelect" :popper-append-to-body="false"
@change="quckEditdigoisce" size="small">
<el-option v-for="item in diagnosis" :key="item.id" :label="item.displayName" :value="item.id">
</el-option>
</el-select> </el-form-item></el-col>
<el-col :span="8">
<el-form-item label="偏高诊断" prop="">
<el-select v-model="form.upperDiagnosisId" placeholder="请选择" filterable :filter-method="remoteMethodes"
default-first-option clearable popper-class="diagnosisSelect" :popper-append-to-body="false"
@change="quckEditdigoisces" size="small">
<el-option v-for="item in diagnosies" :key="item.id" :label="item.displayName" :value="item.id">
</el-option>
</el-select> </el-form-item></el-col>
</el-row>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false, id = curRowes.id" class="difference">取 消</el-button>
<el-button type="primary" @click="onsbmint" class="commonbutton"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { mapState } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import { examinationgender } from "@/request/systemapi";
import { dddw } from "../../utlis/proFunc";
// import
export default {
props: ["itemId", "ReferenceRangeTypeFlag"],
data() {
return {
rules: {
itemId: [{ required: true, message: "请选择项目", trigger: "blur" }],
forSexId: [{ required: true, message: "请选择性别", trigger: "blur" }],
ageLowerLimit: [
{ required: true, message: "请输入年龄下限", trigger: "blur" },
],
ageUpperLimit: [
{ required: true, message: "请输入年龄上限", trigger: "blur" },
],
referenceRangeValue: [
{ required: true, message: "请输入参考范围", trigger: "blur" },
],
lowerDiagnosisId: [
{ required: true, message: "请选择偏低诊断", trigger: "blur" },
],
upperDiagnosisId: [
{ required: true, message: "请选择偏高诊断", trigger: "blur" },
],
},
pages: {
SkipCount: 0,
MaxResultCount: 100,
// Sorting: "displayOrder desc",
},
dialogVisible: false,
form: {
itemId: "",
forSexId: "",
ageLowerLimit: "",
ageUpperLimit: "",
referenceRangeValue: "",
criticalRangeValue: "",
followUpRangeValue: "",
lowerDiagnosisId: "",
upperDiagnosisId: "",
referenceRangeTypeFlag: "1",
},
id: "", //新增/编辑 或删除的记录 id
forSexId: [], //性别
diagnosis: [], //偏低诊断
diagnosies: [],//偏高诊断
tableData: [],
curRowes: {},
diagnosisId: ""
};
},
created() { },
mounted() {
this.addtoedit();
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
},
computed: {
...mapState(["itemSet", "window"]),
},
methods: {
getlist(itemId, ReferenceRangeTypeFlag) {
getapi(
`/api/app/reference-range/in-type/${itemId}?ReferenceRangeTypeFlag=${ReferenceRangeTypeFlag}`
).then((res) => {
this.tableData = res.data;
});
},
remoteMethods(keyWords) {
if (keyWords) {
this.diagnosis = [];
this.diagnosisId.forEach(item => {
if (item.displayName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
|| item.simpleCode.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
// || item.shortName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
) {
this.diagnosis.push(item);
}
});
} else {
this.quckeDitd = deepCopy(this.diagnosis);
}
},
remoteMethodes(keyWords) {
if (keyWords) {
this.diagnosies = [];
this.diagnosisId.forEach(item => {
if (item.displayName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
|| item.simpleCode.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
// || item.shortName.toLowerCase().indexOf(keyWords.toLowerCase()) > - 1
) {
this.diagnosies.push(item);
}
});
} else {
this.quckeDitd = deepCopy(this.diagnosies);
}
},
rowick(row) {
this.curRowes = row;
this.id = row.id;
// getapi(`/api/app/reference-range/${row.id}`).then((res) => {
// this.curRowes = res.data;
// this.id = res.data.id;
// });
},
quckEditdigoisce(e) {
if (!e) {
this.remoteMethods()
}
},
quckEditdigoisces(e) {
if (!e) {
this.remoteMethodes()
}
},
//ldddw(forSexId, 'id', scope.row.forSexId, 'displayName')
ldddw(arrayData, key, value, display) {
return dddw(arrayData, key, value, display);
},
// 新增或者编辑需要的类别
addtoedit() {
//适用性别
getapi("/api/app/for-sex").then((res) => {
this.forSexId = res.data;
});
//诊断
postapi("/api/app/Diagnosis/GetSimpleList").then((res) => {
this.diagnosis = res.data;
this.diagnosies = res.data
this.diagnosisId = res.data
});
},
add() {
this.addtoedit()
this.id = "";
this.dialogVisible = true;
if (this.$refs.form !== undefined) {
this.$refs.form.resetFields()
}
Object.assign(this.$data.form, this.$options.data().form)
this.form = {
itemId: this.itemId,
referenceRangeTypeFlag: this.ReferenceRangeTypeFlag,
forSexId: "A",
ageLowerLimit: "0",
ageUpperLimit: "200",
};
},
//编辑弹框
edit() {
if (!this.id) {
this.$message.warning({ showClose: true, message: "请先选中要编辑的记录" });
return;
}
this.dialogVisible = true;
if (this.$refs.form !== undefined) {
this.$refs.form.resetFields()
}
this.form = { ...this.curRowes }
this.addtoedit()
},
del() {
//console.log("删除操作");
if (!this.id) {
this.$message.warning({ showClose: true, message: "请先选中要删除的记录" });
return;
}
this.$confirm("此操作将永久删除该记录, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
cancelButtonClass: "difference",
confirmButtonClass: "commonbutton"
})
.then(() => {
return deletapi(`/api/app/reference-range/${this.id}`, this.form);
})
.then((res) => {
if (res.code != -1) {
console.log("删除成功");
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
this.id = "";
}
})
.catch(() => {
this.$message.info({ showClose: true, message: "已取消删除" });
});
},
confirmationRequest() {
if (!this.id) {
postapi("/api/app/reference-range", this.form).then((res) => {
if (res.code != -1) {
console.log("新增成功");
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
this.id = this.curRowes.id;
this.dialogVisible = false
}
});
} else {
putapi(`/api/app/reference-range/${this.id}`, this.form).then(
(res) => {
if (res.code != -1) {
console.log("修改成功");
this.dialogVisible = false
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
}
}
);
}
},
//确定新增或者编辑
onsbmint() {
this.$refs["form"].validate((v) => {
let that = this
if (v) {
that.confirmationRequest()
}
});
},
},
//监听事件
watch: {
//itemId','ReferenceRangeTypeFlag'
itemId(newVal, oldVal) {
if (newVal != oldVal && newVal != "") {
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
}
},
ReferenceRangeTypeFlag(newVal, oldVal) {
if (newVal != oldVal && newVal != "") {
this.getlist(this.itemId, this.ReferenceRangeTypeFlag);
}
},
},
};
</script>
<style scoped>
/* .box {
display: flex;
margin-top: 15px;
} */
/* :deep .editButton .el-button{
width: 100%;
} */
/* :deep .el-form-item {
margin-bottom: 14px;
} */
::v-deep .diagnosisSelect .el-select-dropdown__wrap {
background-color: #FFF;
max-height: 288px;
max-width: 280px;
}
</style>