智慧厨房页面代码

src/api/kitchen/staff.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function deptUserTreeApi(query) {
+  return request({
+    url: '/system/user/deptUserTree',
+    method: 'post',
+    data: query
+  })
+}

src/views/kitchen/devicesManage/deviesInfo/index.vue

@@ -17,6 +17,15 @@
     </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"
+        >新增</el-button>
+      </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -58,8 +67,60 @@
     />
 
     <!-- 添加或修改参数配置对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px"> 
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-row>
+            <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    基本信息
+                </div>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="设备编号:" prop="devicesNum">
+                    <el-input v-model="form.devicesNum"
+                        placeholder="请输入设备编号"
+                        maxlength="30"
+                    />
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="设备名称:" prop="devicesName">
+                    <el-input v-model="form.userName"
+                        placeholder="请输入设备名称"
+                        maxlength="30"
+                    />
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="设备SN码:" prop="devicesSn">
+                    <el-input v-model="form.userName"
+                        placeholder="请输入设备名称"
+                        maxlength="30"
+                    />
+                </el-form-item>
+            </el-col> 
+             <el-col :span="12">
+                <el-form-item label="所属食堂:" prop="userName">
+                    <el-input v-model="form.userName"
+                        placeholder="请输入所属食堂"
+                        maxlength="11"
+                    />
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="位置:" prop="userName">
+                    <el-input v-model="form.userName"
+                        placeholder="请输入位置"
+                        maxlength="11"
+                    />
+                </el-form-item>
+            </el-col> 
+            <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    设备参数
+                </div>
+            </el-col>
+          </el-row> 
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>

src/views/kitchen/staffManage/staff/index.vue

@@ -55,37 +55,37 @@
     </el-row>
 
     <el-table v-loading="loading" :data="tableListData" height="800">
-      <el-table-column label="序号" align="center" width="80" type="index">
+        <el-table-column label="序号" align="center" width="80" type="index">
         <template slot-scope="scope">
-          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
+            <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
         </template>
-      </el-table-column>
+        </el-table-column>
-      <el-table-column label="员工编号" align="center" prop="canteenNum" :show-overflow-tooltip="true" width="100" />
+        <el-table-column label="员工编号" align="center" prop="canteenNum" :show-overflow-tooltip="true" width="100" />
-      <el-table-column label="员工名称" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="员工名称" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="手机号" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="手机号" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="性别" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="性别" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="岗位名称" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="岗位名称" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="员工照片" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="员工照片" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="人脸状态" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="人脸状态" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="健康证照片" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="健康证照片" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="出入权限" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="出入权限" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="健康证状态" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
+        <el-table-column label="健康证状态" align="center" prop="canteenName" :show-overflow-tooltip="true" width="150" />
-      <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
+        <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
         <template slot-scope="scope"> 
-          <el-button
+            <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)" 
-          >编辑</el-button>
+            >编辑</el-button>
-          <el-button
+            <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)" 
-          >删除</el-button>
+            >删除</el-button>
         </template>
-      </el-table-column>
+        </el-table-column>
     </el-table>
 
     <pagination
@@ -100,12 +100,23 @@
     <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="90px">
         <el-row>
+            <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    个人信息
+                </div>
+            </el-col>
             <el-col :span="12">
-                <el-form-item label="员工名称:" prop="userName">
+                <el-form-item label="员工名称:" prop="userId">
-                    <el-input v-model="form.userName"
+                   <el-cascader v-model="form.userId"
-                        placeholder="请输入员工名称"
+                    :options="userTreeOptions" :filterable="true" style="width: 100%"
-                        maxlength="30"
+                    ref="userCascader"
-                    />
+                    :props="{ 
+                        multiple: false,
+                        emitPath: false,// 若设置 false，则只返回该节点的值，只返回最后选择的id
+                        checkStrictly: false,//来设置父子节点取消选中关联，从而达到选择任意一级选项的目的
+                        value:'id',label:'label' 
+                    }" clearable @change="handleUserChange">
+                    </el-cascader> 
                 </el-form-item>
             </el-col>
             <el-col :span="12">
@@ -148,7 +159,7 @@
                     />
                 </el-form-item>
             </el-col>
-            <el-col :span="12">
+            <!-- <el-col :span="12">
                 <el-form-item label="人脸图片:">
                 <el-upload
                         :http-request="
@@ -163,13 +174,18 @@
                         :class="{ disabled: uploadDisabled }"
                         :before-upload="handleBeforeUpload"
                         :on-preview="handlePictureCardPreview"
-                        :on-remove="handleRemove2"
+                        :on-remove="handleRemove"
                     >
                         <i
                             class="el-icon-plus avatar-uploader-icon"
                         ></i>
                     </el-upload>
                 </el-form-item>
+            </el-col> -->
+            <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    健康证信息
+                </div>
             </el-col>
             <el-col :span="12">
                 <el-form-item label="健康证到期:" prop="userName">
@@ -192,7 +208,7 @@
                         :class="{ disabled: uploadDisabled2 }"
                         :before-upload="handleBeforeUpload"
                         :on-preview="handlePictureCardPreview"
-                        :on-remove="handleRemove"
+                        :on-remove="handleRemove2"
                     >
                         <i
                             class="el-icon-plus avatar-uploader-icon"
@@ -200,6 +216,11 @@
                     </el-upload>
                 </el-form-item>
             </el-col>
+            <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    留样柜权限
+                </div>
+            </el-col>
             <el-col :span="12">
                 <el-form-item label="留样柜权限:" prop="userName">
                     <el-switch v-model="form.accountStatus"
@@ -225,6 +246,7 @@
 
 <script> 
 import { getPageCanteenApi } from "@/api/base/canteen";
+import { deptUserTreeApi } from '@/api/kitchen/staff';
 import { getUser } from '@/api/system/user';
 import { imgUpLoadTwo } from '@/api/system/upload';
 export default {
@@ -248,6 +270,8 @@ export default {
       tableListData: [],
       // 岗位选项
       postOptions: [],
+      // 人员选项
+      userTreeOptions:[],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -280,6 +304,7 @@ export default {
   },
   created() { 
     this.getPostList();
+    this.deptUserTree();
   //   this.getList();
   },
   computed: {
@@ -297,6 +322,16 @@ export default {
                 this.postOptions = response.posts 
             })
         },
+        deptUserTree(){
+            deptUserTreeApi({}).then((response) => {
+                this.userTreeOptions = response.data 
+            })
+        },
+        handleUserChange(e){
+            let arr = this.$refs['userCascader'].getCheckedNodes()
+            let data = arr[0].data
+            console.log(data.nodeId)
+        },
         /** 搜索按钮操作 */
         handleQuery() {
             this.queryParams.pageNum = 1;