后台人员企业审核功能，培训人员列表功能

.env.production

@@ -1,4 +1,4 @@
 OUT_PUT_DIR=dist/jk-temporary-workers-portal
 
-VUE_APP_BACKEND_URL=http://121.37.187.149/jk-temporary-workers-server
+VUE_APP_BACKEND_URL=https://equipment.xiaoxinda.com/jk-temporary-workers-server
 #VUE_APP_BACKEND_URL=https://mirror.xiaoxinda.com/xpgjapi/

src/api/base/enterpriseInfo.js

@@ -45,7 +45,11 @@ function batchRemove(idList) {
   });
 }
 
+function check(id) {
+  return request.post(constant.serverUrl + "/base/enterpriseInfo/check/" + id);
+}
+
 
 export default {
-  pageList, create, edit, add, update, remove, batchRemove,list
+  pageList, create, edit, add, update, remove, batchRemove,list,check
 }

src/api/base/mobileBannerInfo.js

@@ -42,6 +42,14 @@ function batchRemove(idList) {
   });
 }
 
+function checkBannerInfo(formModel) {
+    return request.post(constant.serverUrl + "/base/mobileBannerInfo/checkBannerInfo", formModel, {
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+  }
+
 export default {
-  pageList, create, edit, add, update, remove, batchRemove
+  pageList, create, edit, add, update, remove, batchRemove,checkBannerInfo
 }

src/api/base/personInfo.js

@@ -41,7 +41,11 @@ function batchRemove(idList) {
   });
 }
 
+function check(id) {
+  return request.post(constant.serverUrl + "/base/personInfo/check/" + id);
+}
+
 
 export default {
-  pageList, create, edit, add, update, remove, batchRemove
+  pageList, create, edit, add, update, remove, batchRemove,check
 }

src/api/base/trainingPerson.js

@@ -0,0 +1,47 @@
+import request from '@/utils/request'
+import constant from '@/constant'
+
+function pageList(formData) {
+  return request.post(constant.serverUrl + "/base/trainingPerson/pageList", formData);
+}
+
+function create() {
+  return request.get(constant.serverUrl + "/base/trainingPerson/create");
+}
+
+function edit(id) {
+  return request.get(constant.serverUrl + "/base/trainingPerson/edit/" + id);
+}
+
+function add(formModel) {
+  return request.post(constant.serverUrl + "/base/trainingPerson/add", formModel, {
+    headers: {
+      "Content-Type": "application/json"
+    }
+  });
+}
+
+function update(formModel) {
+  return request.post(constant.serverUrl + "/base/trainingPerson/update", formModel, {
+    headers: {
+      "Content-Type": "application/json"
+    }
+  });
+}
+
+function remove(id) {
+  return request.post(constant.serverUrl + "/base/trainingPerson/delete/" + id);
+}
+
+
+function batchRemove(idList) {
+  return request.post(constant.serverUrl + "/base/trainingPerson/batchDelete", idList, {
+    headers: {
+      "Content-Type": "application/json"
+    }
+  });
+}
+
+export default {
+  pageList, create, edit, add, update, remove, batchRemove
+}

src/views/base/enterpriseInfo-list.vue

@@ -76,6 +76,7 @@
         <el-table-column label="操作">
           <template slot-scope="{row}">
             <el-button size="mini" type="warning" @click="handleEdit(row)">编辑</el-button>
+            <el-button size="mini" v-if="row.status==0" type="success" @click="handleCheck(row)">认证</el-button>
             <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
           </template>
         </el-table-column>
@@ -252,6 +253,30 @@
           });
         });
       },
+      handleCheck(record){
+        var self = this;
+  
+        this.$confirm("是否确认认证？", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          enterpriseInfoApi.check(record.id).then(function(response) {
+            var jsonData = response.data;
+
+            if (jsonData.result) {
+              // var index = self.tableData.indexOf(record);
+              // self.tableData.splice(index, 1);
+              self.changePage(self.pageIndex);
+
+              self.$message({
+                type: "success",
+                message: "认证成功!"
+              });
+            }
+          });
+        });
+      },
       onDetailModalClose(refreshed) {
         this.showModal = false;
   

src/views/base/mobileBannerInfo-list.vue

@@ -86,12 +86,12 @@
               </a>
             </template>
         </el-table-column>
-        <!-- <el-table-column prop="enabled" label="审核状态">
+        <el-table-column prop="enabled" label="审核状态">
             <template slot-scope="{ row }">
                 <span v-if="row.enabled" style="color:green">已审核</span>
                 <span v-else style="color:red">未审核</span>
             </template>
-        </el-table-column> -->
+        </el-table-column>
         <el-table-column
           prop="createTime"
           label="创建时间"
@@ -107,7 +107,7 @@
                   @click="handleEdit(row)"
                   >编辑</el-link
                 >-
-                <!-- <el-link
+                <el-link
                     type="success"
                     :underline="false"
                     @click="handleCheck(row,true)"
@@ -118,7 +118,7 @@
                     :underline="false"
                     @click="handleCheck(row,false)"
                     >审核不通过</el-link
-                >- -->
+                >-
                 <el-link
                   type="danger"
                   :underline="false"

src/views/base/personInfo-detail.vue

@@ -29,7 +29,7 @@
         <el-form-item label="身份证号" prop="idCard">
           <el-input v-model="formModel.idCard" placeholder="请输入身份证号" style="width: 300px"></el-input>
         </el-form-item>
-        <el-form-item label="年龄" prop="age">
+        <!-- <el-form-item label="年龄" prop="age">
           <el-input v-model="formModel.age" placeholder="请输入年龄" style="width: 300px"></el-input>
         </el-form-item>
         <el-form-item label="性别" prop="gender">
@@ -37,7 +37,7 @@
                 <el-radio label="0">男</el-radio>
                 <el-radio label="1">女</el-radio>
             </el-radio-group>
-        </el-form-item>
+        </el-form-item> -->
         <el-form-item label="关联企业" prop="enterpriseId">
           <el-select
             v-model="formModel.enterpriseId"

src/views/base/personInfo-list.vue

@@ -17,6 +17,22 @@
         <el-form-item label="姓名" prop="realName">
           <el-input type="text" size="mini" v-model="queryModel.realName"></el-input>
         </el-form-item>
+        <el-form-item label="联系电话" prop="phone">
+          <el-input type="text" size="mini" v-model="queryModel.phone"></el-input>
+        </el-form-item>
+        <el-form-item label="身份证号" prop="idCard">
+          <el-input type="text" size="mini" v-model="queryModel.idCard"></el-input>
+        </el-form-item>
+        <el-form-item label="认证状态" prop="status">
+          <el-select v-model="queryModel.status" size="mini" filterable placeholder="请选择" clearable>
+            <el-option
+                  v-for="result in statusList"
+                  :key="result.id"
+                  :label="result.name"
+                  :value="result.value"
+                ></el-option>
+            </el-select>
+        </el-form-item>
         <el-form-item>
           <el-button
             type="primary"
@@ -78,9 +94,10 @@
           </template>
         </el-table-column>
         <el-table-column label="操作">
-          <template slot-scope="{row}">
-            <el-button size="mini" type="warning" @click="handleEdit(row)">编辑</el-button>
-            <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
+          <template slot-scope="{row}" >
+            <el-link type="primary" @click="handleEdit(row)">编辑--</el-link>
+            <el-link type="success" v-if="row.status==0&&row.idCard!=null" @click="handleCheck(row)">认证--</el-link>
+            <el-link type="danger" @click="handleDelete(row)">删除</el-link>
           </template>
         </el-table-column>
       </el-table>
@@ -164,6 +181,9 @@
       return {
         queryModel: {
           realName: "",
+          phone:"",
+          idCard:"",
+          status:"",
         },
         loading: false,
         tableData: [],
@@ -198,6 +218,18 @@
         headers: {
             Authorization: getToken(),
         },
+        statusList:[
+          {
+            "id":"0",
+            "name":"未认证",
+            "value":"0"
+          },
+          {
+            "id":"1",
+            "name":"已认证",
+            "value":"1"
+          }
+        ],
       };
     },
     methods: {
@@ -212,6 +244,9 @@
         formData.append("pageIndex", self.pageIndex);
         formData.append("pageSize", self.pageSize);
         formData.append("realName", self.queryModel.realName);
+        formData.append("phone", self.queryModel.phone);
+        formData.append("idCard", self.queryModel.idCard);
+        formData.append("status", self.queryModel.status);
   
         self.loading = true;
   
@@ -269,7 +304,7 @@
       handleDelete(record) {
         var self = this;
   
-        this.$confirm("是否确认删除" + record.userName + "？", "提示", {
+        this.$confirm("是否确认删除？", "提示", {
           confirmButtonText: "确定",
           cancelButtonText: "取消",
           type: "warning"
@@ -315,6 +350,30 @@
             }
           });
         });
+      },
+      handleCheck(record){
+        var self = this;
+  
+        this.$confirm("是否确认审核？", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          personInfoApi.check(record.id).then(function(response) {
+            var jsonData = response.data;
+
+            if (jsonData.result) {
+              // var index = self.tableData.indexOf(record);
+              // self.tableData.splice(index, 1);
+              self.changePage(self.pageIndex);
+
+              self.$message({
+                type: "success",
+                message: "审核成功!"
+              });
+            }
+          });
+        });
       },
         onDetailModalClose(refreshed) {
             this.showModal = false;

src/views/base/shareWorksInfo-list.vue

@@ -14,8 +14,8 @@
         要resetFields起作用，必须配置:model和prop
       -->
       <el-form ref="queryForm" :model="queryModel" inline class="demo-form-inline">
-        <el-form-item label="标题" prop="name">
-          <el-input type="text" size="mini" v-model="queryModel.name"></el-input>
+        <el-form-item label="标题" prop="title">
+          <el-input type="text" size="mini" v-model="queryModel.title"></el-input>
         </el-form-item>
         <el-form-item>
           <el-button
@@ -101,7 +101,7 @@
   
       return {
         queryModel: {
-          name: "",
+          title: "",
         },
         loading: false,
         tableData: [],
@@ -139,7 +139,7 @@
         formData.append("pageIndex", self.pageIndex);
         formData.append("pageSize", self.pageSize);
   
-        formData.append("name", self.queryModel.name);
+        formData.append("title", self.queryModel.title);
         
   
         self.loading = true;

src/views/base/trainingInfo-detail.vue

@@ -19,18 +19,48 @@
           <el-form-item label="标题" prop="title">
             <el-input v-model="formModel.title" placeholder="请输入标题" style="width: 300px"></el-input>
           </el-form-item>
-          <el-form-item label="作者" prop="author">
-            <el-input v-model="formModel.author" placeholder="请输入作者" style="width: 300px"></el-input>
+          <el-form-item label="企业名称" prop="enterpriseId">
+            <el-select
+            v-model="formModel.enterpriseId"
+            placeholder="请选择"
+            style="width: 300px"
+            clearable
+          >
+            <el-option
+              v-for="item in enterpriseList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
           </el-form-item>
-          <el-form-item label="类型" prop="type">
-            <el-select v-model="formModel.type" filterable placeholder="请选择" clearable style="width:300px;">
-              <el-option
-                    v-for="result in typeList"
-                    :key="result.id"
-                    :label="result.name"
-                    :value="result.value"
-                  ></el-option>
-              </el-select>
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="formModel.name" placeholder="请输入名称" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="报名结束时间" prop="endTime">
+            <el-date-picker
+              style="width: 300px"
+              v-model="formModel.endTime"
+              type="date"
+              placeholder="选择日期"
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="缩略图" prop="thumbnailImage">
+              <el-upload
+                  style="width:300px"
+                  class="avatar-uploader"
+                  name="photoFile"
+                  :action="uploadUrl"
+                  :headers="headers"
+                  :data="uploadData"
+                  :show-file-list="false"
+                  :on-success="handleAvatarSuccess"
+                  :before-upload="beforeAvatarUpload">
+                  <img v-if="fileUrl" :src="fileUrl" class="avatar">
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+              </el-upload>
           </el-form-item>
           <el-form-item label="内容" prop="content">
             <mce-editor
@@ -42,7 +72,21 @@
                 style="width: 90%"
             ></mce-editor>
         </el-form-item>
-  
+        <el-form-item label="上传附件" prop="content">
+          <el-upload
+            class="upload-demo"
+            action="https://jsonplaceholder.typicode.com/posts/"
+            :on-preview="handlePreview"
+            :on-remove="handleRemove"
+            :before-remove="beforeRemove"
+            multiple
+            :limit="3"
+            :on-exceed="handleExceed"
+            :file-list="fileList">
+            <el-button size="small" type="primary">点击上传</el-button>
+            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+          </el-upload>
+        </el-form-item>
         </el-form>
       </div>
       <span slot="footer" class="dialog-footer">
@@ -59,6 +103,8 @@
   import trainingInfoApi from "@/api/base/trainingInfo";
   import MceEditor from "@/components/Tinymce";
   import dataDictionaryApi from "@/api/sys/dataDictionary";
+  import enterpriseInfoApi from "@/api/base/enterpriseInfo";
+
   
   export default {
     props: ["businessKey", "title"],
@@ -86,6 +132,7 @@
               label: "name",
           },
           typeList:[],
+          enterpriseList:[],
           //上传地址
           uploadUrl: Constant.serverUrl + "/uploadPicture",
           uploadData: {
@@ -100,13 +147,27 @@
             height: 300,
             width: 660,
           },
+          fileList:[],
       };
     },
     created() {
+        var self = this;
+
         dataDictionaryApi.findByCatalogName({catalogName: "共享用工类型",})
         .then((response) => {
             var jsonData = response.data;
-            this.typeList = jsonData.data;
+            self.typeList = jsonData.data;
+        });
+
+        
+
+        enterpriseInfoApi.list().then(function (response) {
+          var jsonData = response.data;
+          if (jsonData.result) {
+              if (jsonData.data != null && jsonData.data != "") {
+                  self.enterpriseList = jsonData.data;
+              }
+          }
         });
     },
     methods: {
@@ -148,6 +209,37 @@
           }
         });
       },
+      handleAvatarSuccess(res, file) {
+          var self = this;
+          self.formModel.thumbnailImage = res.data;
+  
+          self.fileUrl =
+            res.data + "?x-oss-process=image/resize,m_lfit,h_300,w_300";
+      },
+      beforeAvatarUpload(file) {
+          const isJPG = file.type === 'image/jpeg';
+          const isLt2M = file.size / 1024 / 1024 < 2;
+  
+          if (!isJPG) {
+              this.$message.error('上传头像图片只能是 JPG 格式!');
+          }
+          if (!isLt2M) {
+              this.$message.error('上传头像图片大小不能超过 2MB!');
+          }
+          return isJPG && isLt2M;
+      },
+      handleRemove(file, fileList) {
+        console.log(file, fileList);
+      },
+      handlePreview(file) {
+        console.log(file);
+      },
+      handleExceed(files, fileList) {
+        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
+      },
+      beforeRemove(file, fileList) {
+        return this.$confirm(`确定移除 ${ file.name }？`);
+      }
     },
     async mounted() {
       var self = this;
@@ -170,6 +262,11 @@
                 self.$refs.editor.setContent(self.formModel.content);
             }
 
+            let thumbnailImage = self.formModel.thumbnailImage;
+            if (thumbnailImage != null) {
+                self.fileUrl = thumbnailImage 
+            }
+
             self.showModal = true;
           } else {
             self.$message.error(jsonData.message + "");

src/views/base/trainingInfo-list.vue

@@ -54,11 +54,22 @@
         @selection-change="handleSelectionChange"
       >
         <el-table-column type="selection" width="55"></el-table-column>
+        <el-table-column  prop="thumbnailImage"  label="缩略图">
+            <template slot-scope="{row}">
+            <a v-if="row.thumbnailImage" :href="row.thumbnailImage" target="_blank">
+              <el-image
+              style="width: 50px; height: 50px"
+              :src="row.thumbnailImage"
+              fit="fit"></el-image>
+            </a>
+          </template>
+        </el-table-column>
         <el-table-column  prop="enterpriseName"  label="企业名称"></el-table-column>
         <el-table-column  prop="name"  label="名称"></el-table-column>
         <el-table-column  prop="title"  label="标题"></el-table-column>
+
         <el-table-column  prop="file"  label="下载文件"></el-table-column>
-        <el-table-column  prop="createTime"  label="创建时间"></el-table-column>
+        <el-table-column  prop="endTime"  label="结束时间"></el-table-column>
         <el-table-column  prop="status"  label="审核状态">
           <template slot-scope="{row}">
             <span v-if="row.status=='0'" style="color: #F56C6C;">未审核</span>
@@ -69,6 +80,7 @@
           <template slot-scope="{row}">
             <el-button size="mini" type="warning" @click="handleEdit(row)">编辑</el-button>
             <el-button v-if="row.status=='0'" size="mini" type="primary" @click="handleCheck(row)">审核</el-button>
+            <el-button size="mini" type="success" @click="handlePersonList(row)">报名人员</el-button>
             <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
           </template>
         </el-table-column>
@@ -88,11 +100,18 @@
         :title="modalTitle"
         @close="onDetailModalClose"
       ></trainingInfo-detail>
+      <trainingPerson-list
+        v-if="showModal2"
+        :businessKey="businessKey"
+        :title="modalTitle2"
+        @close="onDetailModalClose2"
+      ></trainingPerson-list>
     </div>
   </template>
   <script>
   import trainingInfoApi from "@/api/base/trainingInfo";
   import trainingInfoDetail from "./trainingInfo-detail";
+  import trainingPersonList from "./trainingPerson-list";
   
   export default {
     name: 'baseTrainingInfoList',
@@ -113,9 +132,11 @@
         direction: "",
         pageSizeList: [10, 20, 30],
         multipleSelection: [],
-        modalTitle: "",      
+        modalTitle: "",
+        modalTitle2: "",          
         businessKey: "",
         showModal: false,
+        showModal2: false,
         dialogFormVisible:false,
         newPassword:"",
         roleResult:[],
@@ -272,6 +293,19 @@
       onDetailModalClose(refreshed) {
         this.showModal = false;
   
+        if(refreshed) {
+          this.changePage(this.pageIndex);
+        }
+      },
+      handlePersonList(record) {
+        var self = this;
+        self.modalTitle2 = "培训报名人员";
+        self.businessKey = record.id;
+        self.showModal2 = true;
+      },
+      onDetailModalClose2(refreshed) {
+        this.showModal2 = false;
+  
         if(refreshed) {
           this.changePage(this.pageIndex);
         }
@@ -282,7 +316,8 @@
       this.changePage(1);
     },
     components: {
-        "trainingInfo-detail":trainingInfoDetail
+        "trainingInfo-detail":trainingInfoDetail,
+        "trainingPerson-list":trainingPersonList,
     }
   };
   </script>

src/views/base/trainingPerson-list.vue

@@ -0,0 +1,177 @@
+
+<template>
+    <el-dialog
+      :visible.sync="showDialog"
+      :title="title"
+      :modal-append-to-body="false"
+      style="text-align: left;"
+      @close="closeDialog"
+      :close-on-click-modal="false"
+      width="900px"
+    >
+      <div class="user-panel" v-loading="loading">
+        <el-form ref="queryForm" :model="queryModel" inline class="demo-form-inline">
+            <el-form-item label="姓名" prop="name">
+                <el-input type="text" size="mini" v-model="queryModel.name"></el-input>
+            </el-form-item>
+            <el-form-item label="联系电话" prop="phone">
+                <el-input type="text" size="mini" v-model="queryModel.phone"></el-input>
+            </el-form-item>
+            <el-form-item>
+            <el-button
+                type="primary"
+                size="mini"
+                icon="ios-search"
+                @click="changePage(1)"
+                :loading="loading"
+            >查询</el-button>&nbsp;
+            <el-button
+                type="info"
+                size="mini"
+                style="margin-left: 8px"
+                @click="handleReset('queryForm')"
+            >重置</el-button>&nbsp;
+            </el-form-item>
+        </el-form>
+        <el-divider></el-divider>
+        <el-table
+        :data="tableData"
+        style="min-height:400px;"
+        v-loading="loading"
+        stripe
+        @sort-change="sortChange"
+        @selection-change="handleSelectionChange"
+      >
+            <!-- <el-table-column type="selection" width="55"></el-table-column> -->
+            <el-table-column  prop="workPersonName"  label="姓名"></el-table-column>
+            <el-table-column  prop="phone"  label="联系电话"></el-table-column>
+            <el-table-column  prop="gender"  label="性别">
+                <template slot-scope="{row}">
+                    <span v-if="row.gender=='0'">男</span>
+                    <span v-else-if="row.gender=='1'">女</span>
+                </template>
+            </el-table-column>
+            <el-table-column  prop="age"  label="年龄"></el-table-column>
+            <el-table-column  prop="createTime"  label="报名时间"></el-table-column>
+
+            <!-- <el-table-column label="操作" width="250">
+            <template slot-scope="{row}">
+                <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
+            </template>
+            </el-table-column> -->
+        </el-table>
+        <el-pagination
+            style="text-align: center;"
+            :current-page.sync="pageIndex"
+            :total="totalElements"
+            :page-sizes="pageSizeList"
+            @current-change="changePage"
+            @size-change="pageSizeChange"
+            layout="total, sizes, prev, pager, next, jumper"
+        ></el-pagination>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="closeDialog">取 消</el-button>
+      </span>
+    </el-dialog>
+  </template>
+  <script>
+  import trainingPersonApi from "@/api/base/trainingPerson";
+  
+  export default {
+    props: ["businessKey", "title"],
+    data() {
+      return {
+            submitting: false,
+            queryModel: {
+                name:"",
+                phone:"",
+            },
+            showDialog: true,
+            loading: false,
+            tableData: [],
+            pageIndex: 1,
+            pageSize: 10,
+            totalPages: 0,
+            totalElements: 0,
+            field: "",
+            direction: "",
+            pageSizeList: [10, 20, 30],
+            multipleSelection: [],
+      };
+    },
+    created() {
+
+    },
+    methods: {
+      closeDialog() {
+        this.$emit("close", false);
+      },
+      changePage(pageIndex) {
+        var self = this;
+  
+        console.log(pageIndex);
+  
+        self.pageIndex = pageIndex;
+        var formData = new FormData();
+  
+        formData.append("pageIndex", self.pageIndex);
+        formData.append("pageSize", self.pageSize);
+  
+        formData.append("informationId", self.businessKey);
+        formData.append("name", self.queryModel.name);
+        formData.append("phone", self.queryModel.phone);
+  
+        self.loading = true;
+  
+        trainingPersonApi.pageList(formData).then(function(response) {
+          self.loading = false;
+  
+          var jsonData = response.data;
+  
+          if(jsonData.result){
+            var pageInfo = jsonData.data;
+  
+            self.tableData = pageInfo.data;
+            self.totalPages = pageInfo.totalPages;
+            self.totalElements = pageInfo.recordsTotal;
+          }
+          else {
+            self.$message({
+                message: jsonData.message + "",
+                type: "warning"
+              });
+          }
+        }).catch((error)=>{
+          self.loading = false;
+        });
+      },
+      handleReset(name) {
+        this.$refs[name].resetFields();
+      },
+      pageSizeChange(pageSize) {
+        this.pageSize = pageSize;
+      },
+      sortChange(data) {
+        this.field = data.column.field;
+        this.direction = data.order == "ascending" ? "asc" : "desc";
+  
+        this.changePage(this.pageIndex);
+      },
+      handleSelectionChange(val) {
+        this.multipleSelection = val;
+      },
+    },
+    async mounted() {
+      var self = this;
+      self.changePage(1);
+    },
+    components: {
+    },
+  };
+  </script>
+  <style scoped>
+  .user-panel {
+    margin: 10px auto;
+  }
+  </style>