|
@@ -0,0 +1,280 @@
|
|
|
+<!-- 柜锁配置 -->
|
|
|
+<template>
|
|
|
+ <div class="app-container cabinetLockDisposition">
|
|
|
+ <div class="cabinetLockDispositionPage" v-if="pageType === 1">
|
|
|
+ <div class="page-form-title-box">
|
|
|
+ <el-form :model="queryParams" class="form-box" ref="queryForm"
|
|
|
+ :inline="true" style="width:100%;">
|
|
|
+ <el-form-item label="名称" prop="gatewayName" label-width="90px">
|
|
|
+ <el-input
|
|
|
+ maxLength="30"
|
|
|
+ v-model="queryParams.gatewayName"
|
|
|
+ placeholder="请输入"
|
|
|
+ clearable
|
|
|
+ style="width: 200px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="float: right;">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <p class="add-button-one-90"
|
|
|
+ @click="tableButton(1)"
|
|
|
+ v-hasPermi="['demo:demo:add']"
|
|
|
+ >新增</p>
|
|
|
+ </el-col>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
|
|
|
+ <p class="reset-button-one" @click="resetQuery">重置</p>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="page-content-box">
|
|
|
+ <el-table class="table-box" v-loading="loading" border :data="dataList">
|
|
|
+ <el-table-column label="名称" prop="gatewayName" show-overflow-tooltip/>
|
|
|
+ <el-table-column label="地址" prop="gatewayMac" width="300" show-overflow-tooltip/>
|
|
|
+ <el-table-column label="创建人" prop="createBy" width="200" show-overflow-tooltip/>
|
|
|
+ <el-table-column label="创建时间" prop="createTime" width="200" show-overflow-tooltip>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ parseTime(scope.row.createTime) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="200" show-overflow-tooltip v-if="tableButtonType">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="table-button-box">
|
|
|
+ <p class="table-button-null"></p>
|
|
|
+ <p class="table-button-p"
|
|
|
+ @click="tableButton(2,scope.row)"
|
|
|
+ v-hasPermi="['demo:demo:detail']"
|
|
|
+ >详情</p>
|
|
|
+ <p class="table-button-p"
|
|
|
+ @click="tableButton(3,scope.row)"
|
|
|
+ v-hasPermi="['demo:demo:edit']"
|
|
|
+ >编辑</p>
|
|
|
+ <p class="table-button-p"
|
|
|
+ @click="tableButton(4,scope.row)"
|
|
|
+ v-hasPermi="['demo:demo:del']"
|
|
|
+ >删除</p>
|
|
|
+ <p class="table-button-null"></p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination :page-sizes="[20, 30, 40, 50]"
|
|
|
+ v-show="total>0"
|
|
|
+ :total="total"
|
|
|
+ :page.sync="queryParams.pageNum"
|
|
|
+ :limit.sync="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog :title="dialogTitle" :visible.sync="dialogType " @close="handleClose" width="500px" append-to-body>
|
|
|
+ <div style="text-align: center">
|
|
|
+ <el-form ref="dialogForm" :model="dialogForm" :rules="rules" label-width="80px">
|
|
|
+ <el-form-item label="名称:" prop="gatewayName" style="margin-bottom:40px;">
|
|
|
+ <el-input
|
|
|
+ :disabled="dialogForm.showType"
|
|
|
+ v-model="dialogForm.gatewayName"
|
|
|
+ maxlength="25"
|
|
|
+ placeholder="请输入名称"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="地址:" prop="gatewayMac" style="margin-bottom:40px;">
|
|
|
+ <el-input
|
|
|
+ :disabled="dialogForm.showType"
|
|
|
+ v-model="dialogForm.gatewayMac"
|
|
|
+ maxlength="25"
|
|
|
+ placeholder="请输入地址"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <p class="dialog-footer-null-p"></p>
|
|
|
+ <el-button @click="handleClose">{{dialogForm.showType?'关 闭':'取 消'}}</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm" v-if="!dialogForm.showType">确 定</el-button>
|
|
|
+ <p class="dialog-footer-null-p"></p>
|
|
|
+ </div>
|
|
|
+ <!-- <vue-qr id="form1" style="display: block;height:200px;width:200px;cursor:pointer;margin:0 auto;" text="12123123123123" :size="200"></vue-qr>-->
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { laboratoryLockGatewayList,laboratoryLockGatewayId,laboratoryLockGatewayAdd,laboratoryLockGatewayPut,laboratoryLockGatewayDelGateway } from "@/api/medicUniversity-3_1/index";
|
|
|
+ export default {
|
|
|
+ name: 'index',
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
|
|
|
+ //页面状态
|
|
|
+ pageType:1,
|
|
|
+ //页面遮罩
|
|
|
+ loading:false,
|
|
|
+ //下拉列表数据
|
|
|
+ optionList:[{value:true,label:'启用'},{value:false,label:'停用'}],
|
|
|
+ //查询条件
|
|
|
+ queryParams:{
|
|
|
+ pageNum:1,
|
|
|
+ pageSize:20,
|
|
|
+ gatewayName:"",
|
|
|
+ },
|
|
|
+ //列表数据
|
|
|
+ dataList:[],
|
|
|
+ //数据数量
|
|
|
+ total:0,
|
|
|
+ //组件传参
|
|
|
+ dialogTitle:'',
|
|
|
+ dialogForm:{},
|
|
|
+ dialogType:false,
|
|
|
+ rules: {
|
|
|
+ gatewayName: [
|
|
|
+ { required: true, message: "请输入名称", trigger: "blur" },
|
|
|
+ { required: true, message: "请输入名称", validator: this.spaceJudgmentHTML, trigger: "blur" }
|
|
|
+ ],
|
|
|
+ gatewayMac: [
|
|
|
+ { required: true, message: "请输入地址", trigger: "blur" },
|
|
|
+ { required: true, message: "请输入地址", validator: this.spaceJudgmentHTML, trigger: "blur" }
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //查询按钮
|
|
|
+ handleQuery(){
|
|
|
+ this.$set(this.queryParams,'page',1);
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ //重置按钮
|
|
|
+ resetQuery(){
|
|
|
+ this.$set(this,'queryParams',{
|
|
|
+ pageNum:1,
|
|
|
+ pageSize:20,
|
|
|
+ gatewayName:"",
|
|
|
+ });
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ //获取数据列表
|
|
|
+ getList(){
|
|
|
+ this.$set(this,'loading',true);
|
|
|
+ laboratoryLockGatewayList(this.queryParams).then(response => {
|
|
|
+ this.$set(this,'dataList',response.rows);
|
|
|
+ this.$set(this,'total',response.total);
|
|
|
+ this.$set(this,'loading',false);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //操作按钮
|
|
|
+ tableButton(type,row){
|
|
|
+ let self = this;
|
|
|
+ if(type == 1){
|
|
|
+ //新增
|
|
|
+ this.$set(this,'dialogTitle','新增');
|
|
|
+ this.$set(this,'dialogForm',{
|
|
|
+ showType:false,
|
|
|
+ gatewayName:'',
|
|
|
+ gatewayMac:'',
|
|
|
+ });
|
|
|
+ this.$set(this,'dialogType',true);
|
|
|
+ }else if(type == 2){
|
|
|
+ //详情
|
|
|
+ let obj = JSON.parse(JSON.stringify(row))
|
|
|
+ obj.showType = true;
|
|
|
+ this.$set(this,'dialogTitle','详情');
|
|
|
+ this.$set(this,'dialogForm',obj);
|
|
|
+ this.$set(this,'dialogType',true);
|
|
|
+ }else if(type == 3){
|
|
|
+ //编辑
|
|
|
+ let obj = JSON.parse(JSON.stringify(row))
|
|
|
+ obj.showType = false;
|
|
|
+ this.$set(this,'dialogTitle','编辑');
|
|
|
+ this.$set(this,'dialogForm',obj);
|
|
|
+ this.$set(this,'dialogType',true);
|
|
|
+ }else if(type == 4){
|
|
|
+ //删除
|
|
|
+ this.$confirm('是否确认删除?', "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(function() {
|
|
|
+ }).then(() => {
|
|
|
+ laboratoryLockGatewayDelGateway({id:row.id}).then(response => {
|
|
|
+ self.msgSuccess(response.message)
|
|
|
+ self.getList();
|
|
|
+ });
|
|
|
+ }).catch(() => {});
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //弹窗相关
|
|
|
+
|
|
|
+ //监听关联记录弹窗关闭
|
|
|
+ handleClose(){
|
|
|
+ this.$refs["dialogForm"].clearValidate();
|
|
|
+ this.$set(this,'dialogType',false);
|
|
|
+ },
|
|
|
+ //提交
|
|
|
+ submitForm(){
|
|
|
+ this.$refs["dialogForm"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ if(this.dialogForm.id){
|
|
|
+ //编辑
|
|
|
+ let obj = {
|
|
|
+ id:this.dialogForm.id,
|
|
|
+ gatewayName:this.dialogForm.gatewayName,
|
|
|
+ gatewayMac:this.dialogForm.gatewayMac,
|
|
|
+ }
|
|
|
+ laboratoryLockGatewayPut(obj).then(response => {
|
|
|
+ this.$set(this,'dialogType',false);
|
|
|
+ this.msgSuccess(response.msg)
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ //新增
|
|
|
+ let obj = {
|
|
|
+ gatewayName:this.dialogForm.gatewayName,
|
|
|
+ gatewayMac:this.dialogForm.gatewayMac,
|
|
|
+ }
|
|
|
+ laboratoryLockGatewayAdd(obj).then(response => {
|
|
|
+ this.$set(this,'dialogType',false);
|
|
|
+ this.msgSuccess(response.msg)
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+ .cabinetLockDisposition{
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+ .cabinetLockDispositionPage{
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+ .page-form-title-box{
|
|
|
+ padding-top:20px;
|
|
|
+ display: flex;
|
|
|
+ border-bottom:1px solid #dedede;
|
|
|
+ }
|
|
|
+ .page-content-box{
|
|
|
+ padding:20px;
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|