feat:[资源库管理][钥匙管理]暂存柜列表查询，钥匙发放，归还弹窗，固定文字中英文

src/api/business/zcg/zcg.js

@@ -18,20 +18,20 @@ export function zcg_info(query) {
   })
 }
 
-// 保存暂存柜
-export function zcg_save(data) {
+// 钥匙发放
+export function zcg_yygh(data) {
   return request({
-    url: '/system/business/zcg/save',
+    url: '/system/business/zcg/ysgh',
     method: 'post',
     data: data
   })
 }
 
-// 删除暂存柜
-export function zcg_delete(data) {
+//钥匙归还
+export function zcg_yyff(data) {
   return request({
-    url: '/system/business/zcg/delete',
+    url: '/system/business/zcg/ysff',
     method: 'post',
     data: data
   })
-}
+}

src/views/business/resource/zcg/list.vue

@@ -1,119 +1,104 @@
 <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="bh">
-        <el-input v-model="queryParams.bh" placeholder="" clearable @keyup.enter.native="handleQuery" />
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
+      <el-form-item :label="$t('page.business.zykgl.zcg.zcg') + '：'">
+        <el-input v-model="queryParams.mc" placeholder="" clearable @change="handleQuery" />
       </el-form-item>
-      <el-form-item label="借用人" prop="bh">
-        <el-input v-model="queryParams.yslqr1" placeholder="" clearable @keyup.enter.native="handleQuery" />
+      <el-form-item :label="$t('page.business.zykgl.zcg.jyr') + '：'">
+        <el-input v-model="queryParams.jyrId" placeholder="" clearable @change="handleQuery" />
       </el-form-item>
-      <el-form-item label="状态" prop="zt">
-        <el-input v-model="queryParams.zt" clearable @keyup.enter.native="handleQuery" />
+      <el-form-item :label="$t('page.business.zykgl.zcg.zt') + '：'">
+        <el-select v-model="queryParams.zt" :placeholder="$t('form.placeholderSelect')" clearable @change="handleQuery" >
+          <el-option key="5" :label="$t('page.business.zykgl.zcg.jyz')" value="5" />
+          <el-option key="1" :label="$t('page.business.zykgl.zcg.wjy')" value="1" />
+        </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="el-icon-search" @click="handleQuery">{{ $t('form.search') }}</el-button>
+        <el-button icon="el-icon-refresh" @click="resetQuery">{{ $t('form.reset') }}</el-button>
       </el-form-item>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button type="primary" :disabled="multiple" @click="handleDelete"
-          v-hasPermi="['business:Zcg:ghys']">批量归还</el-button>
+        <el-button type="primary" :disabled="multiple" @click="handleDelete" v-hasPermi="['business:Zcg:ghys']">{{
+          $t('page.business.zykgl.zcg.plgh') }}</el-button>
       </el-col>
     </el-row>
 
     <el-table v-loading="loading" :data="ZcgList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="暂存柜" align="center" prop="mc" />
-      <el-table-column label="钥匙编号" align="center" prop="bh" />
-      <el-table-column label="钥匙1借用人" align="center" prop="yslqr1" />
-      <el-table-column label="钥匙2借用人" align="center" prop="yslqr2" />
-      <el-table-column label="状态" align="center" prop="zt" />
-      <el-table-column label="关联药剂" align="center" prop="glyj" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column :label="$t('page.business.zykgl.zcg.zcg')" align="left" prop="mc" width="250px"/>
+      <el-table-column :label="$t('page.business.zykgl.zcg.ys1jyr')" align="center" prop="lqr1Id" width="150px"/>
+      <el-table-column :label="$t('page.business.zykgl.zcg.ys2jyr')" align="center" prop="lqr2Id" width="150px"/>
+      <el-table-column :label="$t('page.business.zykgl.zcg.zt')" align="center" width="150px">
         <template slot-scope="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-            v-hasPermi="['business:Zcg:ffys']">发放钥匙</el-button>
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-            v-hasPermi="['business:Zcg:ghys']">归还钥匙</el-button>
+          <span v-if="scope.row.zt == 1">{{ $t('page.business.zykgl.zcg.wjy') }}</span>
+          <span v-if="scope.row.zt == 5">{{ $t('page.business.zykgl.zcg.jyz') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('page.business.zykgl.zcg.glyj')" align="center" prop="glyj" />
+      <el-table-column :label="$t('form.operate')" align="center" class-name="small-padding fixed-width" width="150px">
+        <template slot-scope="scope">
+          <el-button size="mini" type="text"  @click="handleffys(scope.row)"
+            v-hasPermi="['business:Zcg:ffys']">{{ $t('page.business.zykgl.zcg.ffys') }}</el-button>
+          <el-button size="mini" type="text"  @click="handleghys(scope.row)"
+            v-hasPermi="['business:Zcg:ghys']">{{ $t('page.business.zykgl.zcg.gh') }}</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="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="暂存柜名称" prop="mc">
-          <el-input v-model="form.mc" placeholder="请输入暂存柜名称" />
-        </el-form-item>
-        <el-form-item label="钥匙编号" prop="bh">
-          <el-input v-model="form.bh" placeholder="请输入钥匙编号" />
-        </el-form-item>
-        <el-form-item label="钥匙1领取人" prop="yslqr1">
-          <el-input v-model="form.yslqr1" placeholder="请输入钥匙1领取人" />
-        </el-form-item>
-        <el-form-item label="钥匙2领取人" prop="yslqr2">
-          <el-input v-model="form.yslqr2" placeholder="请输入钥匙2领取人" />
-        </el-form-item>
-        <el-form-item label="状态：1：未借用；5：借用中；10：停用" prop="zt">
-          <el-input v-model="form.zt" placeholder="请输入状态：1：未借用；5：借用中；10：停用" />
-        </el-form-item>
-        <el-form-item label="备注信息" prop="remark">
-          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
-        </el-form-item>
-        <el-form-item label="删除标志" prop="delFlag">
-          <el-input v-model="form.delFlag" placeholder="请输入删除标志" />
-        </el-form-item>
+
+    <el-dialog :title="$t('page.business.zykgl.zcg.ysgh')" :visible.sync="openYsgh" width="500px" append-to-body>
+      <el-form ref="resetYsgh" :model="formYsgh" :rules="rulesYsgh" label-width="80px">
+        
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
+        <el-button type="primary" @click="saveYsgh">{{ $t('form.confirm') }}</el-button>
+        <el-button @click="cancelYsgh">{{ $t('form.cancel') }}</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog :title="$t('page.business.zykgl.zcg.ysff')" :visible.sync="openYsff" width="500px" append-to-body>
+      <el-form ref="formYsff" :model="formYsff" :rules="rulesYsff" label-width="80px">
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="saveYsff">{{ $t('form.confirm') }}</el-button>
+        <el-button @click="cancelYsff">{{ $t('form.cancel') }}</el-button>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { zcg_list, zcg_info, zcg_delete, zcg_save } from "@/api/business/zcg/zcg"
+import { zcg_list, zcg_info, zcg_yygh, zcg_yyff } from "@/api/business/zcg/zcg"
 
 export default {
   name: "Zcg",
   data() {
     return {
-      // 遮罩层
       loading: true,
-      // 选中数组
       ids: [],
-      // 非单个禁用
       single: true,
-      // 非多个禁用
       multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
       total: 0,
-      // 暂存柜表格数据
       ZcgList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 10,
         mc: null,
-        bh: null,
-        yslqr1: null,
-        yslqr2: null,
+        jyrId: null,
         zt: null,
       },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
+      openYsff: false,
+      formYsff: {},
+      rulesYsff: {
+      },
+      openYsgh: false,
+      formYsgh: {},
+      rulesYsgh: {
       }
     }
   },
@@ -121,7 +106,6 @@ export default {
     this.getList()
   },
   methods: {
-    /** 查询暂存柜列表 */
     getList() {
       this.loading = true
       zcg_list(this.queryParams).then(response => {
@@ -130,82 +114,86 @@ export default {
         this.loading = false
       })
     },
-    // 取消按钮
-    cancel() {
-      this.open = false
-      this.reset()
+    cancelYsff() {
+      this.openYsff = false
+      this.resetYsff()
+    },
+    cancelYsgh() {
+      this.openYsgh = false
+      this.resetYsgh()
     },
-    // 表单重置
-    reset() {
-      this.form = {
+    resetYsff() {
+      this.formYsff = {
         id: null,
         mc: null,
         bh: null,
         yslqr1: null,
         yslqr2: null,
-        zt: null,
-        createBy: null,
-        createTime: null,
-        updateBy: null,
-        updateTime: null,
-        remark: null,
-        delFlag: null
+        zt: null
       }
-      this.resetForm("form")
+      this.resetForm("resetYsff")
+    },
+    resetYsgh() {
+      this.formYsgh = {
+        id: null,
+        mc: null,
+        bh: null,
+        yslqr1: null,
+        yslqr2: null,
+        zt: null
+      }
+      this.resetForm("resetYsgh")
     },
-    /** 搜索按钮操作 */
     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.title = "添加暂存柜"
+    handleffys(row) {
+      this.resetYsff()
+      const id = row.id || this.ids
+      zcg_info(id).then(response => {
+        this.formYsff = response.data
+        this.openYsff = true
+      })
     },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset()
+    handleghys(row) {
+      this.resetYsgh()
       const id = row.id || this.ids
       zcg_info(id).then(response => {
-        this.form = response.data
-        this.open = true
-        this.title = "修改暂存柜"
+        this.formYsgh = response.data
+        this.openYsgh = true
       })
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
+    saveYsgh() {
+      this.$refs["formYsgh"].validate(valid => {
         if (valid) {
-          zcg_save(this.form).then(response => {
-            this.$modal.msgSuccess("修改成功")
-            this.open = false
+          zcg_yygh(this.formYsgh).then(response => {
+            this.$modal.msgSuccess("操作成功")
+            this.openYsgh = false
             this.getList()
           })
         }
       })
     },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids
-      this.$modal.confirm('是否确认？').then(function () {
-        return zcg_delete(ids)
-      }).then(() => {
-        this.getList()
-        this.$modal.msgSuccess("删除成功")
-      }).catch(() => { })
+    saveYsff() {
+      this.$refs["formYsff"].validate(valid => {
+        if (valid) {
+          zcg_yyff(this.formYsff).then(response => {
+            this.$modal.msgSuccess("操作成功")
+            this.openYsff = false
+            this.getList()
+          })
+        }
+      })
     }
   }
 }