postdischarge-ui/src/views/manage/projectdevice/index.vue
2024-03-20 11:05:32 +08:00

700 lines
20 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<!-- <el-form-item label="所属患者" prop="patientId">
<el-input
v-model="queryParams.patientId"
placeholder="请输入患者"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item label="患者姓名" prop="patientName">
<el-input
v-model="queryParams.patientName"
placeholder="请输入患者姓名"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="身份证号" prop="cardNo">
<el-input
v-model="queryParams.cardNo"
placeholder="请输入身份证号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- <el-form-item label="设备名称" prop="deviceName">
<el-input
v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item label="设备类型" prop="deviceType">
<el-select
v-model="queryParams.deviceType"
placeholder="请选择"
style="width: 208px"
>
<el-option
v-for="item in options"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="设备编码" prop="deviceCode">
<el-input
v-model="queryParams.deviceCode"
placeholder="请输入设备编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- <el-form-item label="设备绑定时间" prop="deviceBindTime">
<el-date-picker clearable
v-model="queryParams.deviceBindTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择设备绑定时间">
</el-date-picker>
</el-form-item>
<el-form-item label="设备解绑时间" prop="deviceUnbindTime">
<el-date-picker clearable
v-model="queryParams.deviceUnbindTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择设备解绑时间">
</el-date-picker>
</el-form-item>
<el-form-item label="设备IP地址" prop="deviceIp">
<el-input
v-model="queryParams.deviceIp"
placeholder="请输入设备IP地址"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备端口" prop="devicePort">
<el-input
v-model="queryParams.devicePort"
placeholder="请输入设备端口"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['manage:projectdevice:add']"
>新增</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['manage:projectdevice:edit']"
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['manage:projectdevice:remove']"
>删除</el-button
>
</el-col>
<!-- <el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['manage:projectdevice:export']"
>导出</el-button
>
</el-col> -->
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="projectdeviceList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="主键id" align="center" prop="id" /> -->
<!-- <el-table-column label="患者" align="center" prop="patientId" /> -->
<el-table-column label="患者姓名" align="center" prop="patientName" />
<el-table-column label="身份证号" align="center" prop="cardNo" />
<!-- :show-overflow-tooltip="true" -->
<el-table-column label="设备类型" align="center" prop="deviceType">
<template slot-scope="scope">
{{ scope.row.deviceType == "GLUCOSE_METER" ? "血糖仪" : "" }}
{{ scope.row.deviceType == "BLOOD_PRESSURE" ? "血压仪" : "" }}
{{ scope.row.deviceType == "ELECTROCARDIOGRAPH" ? "心电仪" : "" }}
</template>
</el-table-column>
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="设备编码" align="center" prop="deviceCode" />
<!-- <el-table-column label="设备状态" align="center" prop="deviceStatus" /> -->
<!-- <el-table-column label="备注信息" align="center" prop="deviceRemark" /> -->
<el-table-column
label="设备绑定时间"
align="center"
prop="deviceBindTime"
>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.deviceBindTime, "{y}-{m}-{d}") }}</span>
</template>
</el-table-column>
<!-- <el-table-column
label="设备解绑时间"
align="center"
prop="deviceUnbindTime"
>
<template slot-scope="scope">
<span>{{
parseTime(scope.row.deviceUnbindTime, "{y}-{m}-{d}")
}}</span>
</template>
</el-table-column> -->
<el-table-column
label="设备IP地址"
align="center"
prop="deviceIp"
:show-overflow-tooltip="true"
/>
<el-table-column label="设备端口" align="center" prop="devicePort" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['manage:projectdevice:edit']"
>修改</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['manage:projectdevice:remove']"
>解绑</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改检测项目设备对话框 -->
<el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="120px"
:inline="true"
>
<el-form-item label="患者" prop="patientId">
<!-- <el-form-item label="所属分组" prop="groupId"> -->
<el-button
type=""
v-if="form.patientName == '请选择患者'"
@click="clickinnerVisible()"
style="
width: 208px;
text-align: left;
height: 36px;
color: #c0c4cc;
overflow: hidden;
"
>{{ form.patientName }}</el-button
>
<el-button
@click="clickinnerVisible()"
type=""
v-else
style="
width: 208px;
text-align: left;
height: 36px;
padding-left: -10px;
overflow: hidden;
"
>{{ form.patientName }}</el-button
>
</el-form-item>
<el-form-item label="身份证号" prop="cardNo">
<el-input v-model="form.cardNo" placeholder="请输入身份证号" maxlength="18" />
</el-form-item>
<el-form-item label="设备名称" prop="deviceName" maxlength="300">
<el-input v-model="form.deviceName" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="设备编码" prop="deviceCode">
<el-input v-model="form.deviceCode" placeholder="请输入设备编码" />
</el-form-item>
<el-form-item label="设备类型" prop="deviceType">
<el-select
v-model="form.deviceType"
placeholder="请选择"
style="width: 208px"
>
<el-option
v-for="item in options"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="设备绑定时间" prop="deviceBindTime">
<el-date-picker
clearable
v-model="form.deviceBindTime"
type="date"
style="width: 208px"
value-format="yyyy-MM-dd"
placeholder="请选择设备绑定时间"
>
</el-date-picker>
</el-form-item> -->
<!-- <el-form-item label="设备解绑时间" prop="deviceUnbindTime">
<el-date-picker
clearable
style="width: 208px"
v-model="form.deviceUnbindTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择设备解绑时间"
>
</el-date-picker>
</el-form-item> -->
<el-form-item label="设备IP地址" prop="deviceIp">
<el-input v-model="form.deviceIp" placeholder="请输入设备IP地址" />
</el-form-item>
<el-form-item label="设备端口" prop="devicePort">
<el-input v-model="form.devicePort" placeholder="请输入设备端口" />
</el-form-item>
<el-form-item label="备注信息" prop="deviceRemark">
<el-input v-model="form.deviceRemark" placeholder="请输入备注信息" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 患者弹框 -->
<el-dialog
title=""
:visible.sync="innerVisibleshow"
width="1000px"
append-to-body
:before-close="innerVisiblecancel"
>
<el-form
ref="queryForm"
:model="informationqueryParams"
:rules="rules"
label-width="80px"
:inline="true"
>
<el-form-item label="患者名称" prop="patientName" label-width="120">
<el-input
v-model="informationqueryParams.patientName"
placeholder="请输入患者名称"
clearable
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="informationInfoinfo"
>搜索</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
@click="addresetQuerylist"
>重置</el-button
>
</el-form-item>
</el-form>
<el-table
:data="infolist"
@cell-dblclick="nurseclick"
v-loading="loading"
>
<el-table-column label="请选择" width="100" align="center">
<template slot-scope="scope">
<el-button
type="primary"
style="width: 15px; height: 15px"
v-if="form.patientId == scope.row.id"
circle
@click="nurseclick(scope.row)"
></el-button>
<el-button
v-else
style="width: 15px; height: 15px"
circle
@click="nurseclick(scope.row)"
></el-button>
</template>
</el-table-column>
<el-table-column property="patientName" label="患者名称" align="center">
</el-table-column>
<el-table-column
property="patientPhone"
label="患者手机号"
align="center"
>
</el-table-column>
<el-table-column property="sex" label="患者性别" align="center">
<template slot-scope="scope">
{{ scope.row.sex == "FEMALE" ? "" : "" }}
{{ scope.row.sex == "MALE" ? "" : "" }}
</template>
</el-table-column>
<el-table-column
property="cardNo"
label="患者身份证号"
align="center"
:show-overflow-tooltip="true"
>
</el-table-column>
patientPhone
</el-table>
<pagination
v-show="totaldepartment > 0"
:total="totaldepartment"
:page.sync="informationqueryParams.pageNum"
:limit.sync="informationqueryParams.pageSize"
@pagination="informationInfoinfo"
/>
</el-dialog>
</div>
</template>
<script>
import {
listProjectdevice,
getProjectdevice,
delProjectdevice,
addProjectdevice,
updateProjectdevice,
patientInfo,
} from "@/api/manage/projectdevice";
import { getAgencytype } from "@/api/system/agency";
export default {
name: "Projectdevice",
data() {
//验证身份证
var isCardId = (rule, value, callback) => {
console.log(value)
if (value==null) {
callback(new Error("身份证号不能为空"));
} else {
const reg =
/^\d{6}(18|19|20)?\d{2}(0[1-9]|1[0-2])(([0-2][1-9])|10|20|30|31)\d{3}(\d|X|x)$/;
const card = reg.test(value);
if (!card) {
callback(new Error("身份证号格式有误"));
} else {
callback();
}
}
};
return {
options: [],
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
innerVisibleshow: false,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 检测项目设备表格数据
projectdeviceList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
informationqueryParams: {
pageNum: 1,
pageSize: 10,
// patientId: null,
patientName: null,
},
queryParams: {
pageNum: 1,
pageSize: 10,
patientId: null,
patientName: null,
cardNo: null,
deviceType: null,
deviceName: null,
deviceCode: null,
deviceStatus: "BIND",
deviceRemark: null,
deviceBindTime: null,
deviceUnbindTime: null,
deviceIp: null,
devicePort: null,
},
// 表单参数
form: {},
infolist: [],
totaldepartment: 0,
// 表单校验
rules: {
patientId: [
{ required: true, message: "患者不能为空", trigger: "blur" },
],
cardNo: [
{ required: true, message: "", validator: isCardId, trigger: "blur" },
],
deviceCode: [
{ required: true, message: "设备编码不能为空", trigger: "blur" },
],
deviceType: [
{ required: true, message: "设备类型不能为空", trigger: "blur" },
],
},
};
},
created() {
this.getList();
this.info();
},
methods: {
info() {
var dictType = "hardware_type";
getAgencytype(dictType).then((res) => {
this.options = res.data;
});
},
// 患者名称重置
addresetQuerylist() {
this.informationqueryParams = {
pageNum: 1,
pageSize: 10,
};
this.informationInfoinfo();
},
innerVisiblecancel() {
this.innerVisibleshow = false;
},
// 患者名称圆点按钮
nurseclick(row) {
console.log(row);
this.form.cardNo = row.cardNo;
this.form.patientId = row.id;
this.form.patientName = row.patientName;
// console.log(this.departmentName, "0000");
this.innerVisibleshow = false;
},
// 患者列表
informationInfoinfo() {
patientInfo(this.informationqueryParams).then((response) => {
this.infolist = response.rows;
this.totaldepartment = response.total;
this.loading = false;
});
},
// 点击患者
clickinnerVisible() {
this.innerVisibleshow = true;
this.informationInfoinfo();
},
/** 查询检测项目设备列表 */
getList() {
this.loading = true;
listProjectdevice(this.queryParams).then((response) => {
this.projectdeviceList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
patientId: null,
patientName: null,
cardNo: null,
deviceType: null,
deviceName: null,
deviceCode: null,
deviceStatus: "0",
deviceRemark: null,
deviceBindTime: null,
deviceUnbindTime: null,
deviceIp: null,
devicePort: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.form.patientName = "请选择患者";
this.title = "添加检测项目设备";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getProjectdevice(id).then((response) => {
this.form = response.data;
this.open = true;
this.title = "修改检测项目设备";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateProjectdevice(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addProjectdevice(this.form).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm('是否确认解绑检测项目设备编号为"' + ids + '"的数据项?')
.then(function () {
return delProjectdevice(ids);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("解绑成功");
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download(
"manage/projectdevice/export",
{
...this.queryParams,
},
`projectdevice_${new Date().getTime()}.xlsx`
);
},
},
};
</script>