工单管理后台功能

客户后台管理

src/views/base/customerInfo-detail.vue

@@ -0,0 +1,225 @@
+
+<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="form"
+          :model="formModel"
+          :rules="ruleValidate"
+          :label-width="'100px'"
+          :inline="true"
+        >
+          <el-form-item label="真实姓名" prop="realName">
+            <el-input v-model="formModel.realName" placeholder="请输入真实姓名" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="联系电话" prop="phone">
+            <el-input v-model="formModel.phone" placeholder="请输入联系电话" style="width: 300px"></el-input>
+          </el-form-item>
+          <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="region">
+            <el-input v-model="formModel.region" placeholder="请输入所在地区" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="头像" prop="image">
+              <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>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="closeDialog">取 消</el-button>
+        <el-button type="primary" @click="handleSubmit" :loading="submitting"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+  </template>
+  <script>
+  import Constant from "@/constant";
+  import { getToken } from "@/utils/auth"; // get token from cookie
+  import customerInfoApi from "@/api/base/customerInfo";
+  
+  export default {
+    props: ["businessKey", "title"],
+    data() {
+      return {
+          showPwd: true,
+          ruleValidate: {
+              userName: [
+              { required: true, message: "用户名不能为空", trigger: "blur" },
+              ],
+              realName: [
+              { required: true, message: "真实名称不能为空", trigger: "blur" },
+              ],
+              phone: [
+              { required: true, message: "联系电话不能为空", trigger: "blur" },
+              ],
+              idCard: [
+              { required: true, message: "身份证号不能为空", trigger: "blur" },
+              ],
+              age: [
+              { required: true, message: "年龄不能为空", trigger: "blur" },
+              ],
+              gender: [
+              { required: true, message: "性别不能为空", trigger: "blur" },
+              ],
+          },
+          roleList: [],
+          formModel: {},
+          showDialog: true,
+          loading: false,
+          submitting: false,
+          enterpriseList:[],
+          //上传地址
+          uploadUrl: Constant.serverUrl + "/uploadPicture",
+          uploadData: {
+              subFolder: "water-tank",
+          },
+          fileUrl: "",
+          headers: {
+              Authorization: getToken(),
+          },
+      };
+    },
+    created() {
+    },
+    methods: {
+      closeDialog() {
+        this.$emit("close", false);
+      },
+      handleSubmit() {
+        var self = this;
+  
+        this.$refs["form"].validate((valid) => {
+          if (valid) {
+            (function () {
+              var id = self.formModel.id;
+  
+              if (id == null || id.length == 0) {
+                return customerInfoApi.add(self.formModel);
+              } else {
+                return customerInfoApi.update(self.formModel);
+              }
+            })().then(function (response) {
+              var jsonData = response.data;
+  
+              if (jsonData.result) {
+                self.$message({
+                  message: "保存成功!",
+                  type: "success",
+                });
+  
+                self.$emit("close", true);
+              } else {
+                self.$message({
+                  message: jsonData.message + "",
+                  type: "warning",
+                });
+  
+                self.$emit("close", false);
+              }
+            });
+          }
+        });
+      },
+      handleAvatarSuccess(res, file) {
+          var self = this;
+          self.formModel.image = res.data;
+  
+          self.fileUrl =
+            res.data + "?x-oss-process=image/resize,m_lfit,h_300,w_300";
+      },
+      beforeAvatarUpload(file) {
+          const isLt2M = file.size / 1024 / 1024 < 2;
+          if (!isLt2M) {
+              this.$message.error('上传头像图片大小不能超过 2MB!');
+          }
+          return isLt2M;
+      }
+    },
+    async mounted() {
+      var self = this;
+      self.loading = true;
+  
+      (function () {
+        if (self.businessKey != null && self.businessKey.length > 0) {
+          return customerInfoApi.edit(self.businessKey);
+        } else {
+          return customerInfoApi.create();
+        }
+      })()
+        .then((response) => {
+          var jsonData = response.data;
+  
+          if (jsonData.result) {
+              self.formModel = jsonData.data;
+  
+              let image = self.formModel.image;
+              if (image != null) {
+                  self.fileUrl = image 
+              }
+  
+              self.showModal = true;
+          } else {
+            self.$message.error(jsonData.message + "");
+          }
+  
+          self.loading = false;
+        })
+        .catch((error) => {
+          self.$message.error(error + "");
+          self.loading = false;
+        });
+    },
+    components: {
+    },
+  };
+  </script>
+  <style scoped>
+  .user-panel {
+    margin: 10px auto;
+  }
+  .avatar-uploader .el-upload {
+      border: 1px dashed #d9d9d9;
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+    }
+    .avatar-uploader .el-upload:hover {
+      border-color: #409EFF;
+    }
+    .avatar-uploader-icon {
+      font-size: 28px;
+      color: #8c939d;
+      width: 178px;
+      height: 178px;
+      line-height: 178px;
+      text-align: center;
+    }
+    .avatar {
+      width: 178px;
+      height: 178px;
+      display: block;
+    }
+  </style>

src/views/base/customerInfo-list.vue

@@ -47,20 +47,6 @@
           :disabled="multipleSelection.length==0"
           @click="handleBatchDelete"
         >删除选中项</el-button>
-        <el-button
-          type="primary"
-          size="small"
-          plain
-          icon="el-icon-upload"
-          @click="batchImportVisible = true"
-        >导入</el-button>
-        <el-button
-          type="primary"
-          size="small"
-          plain
-          icon="el-icon-upload2"
-          @click="exportXls"
-        >导出数据</el-button>
       </el-row>
       <el-table
         :data="tableData"
@@ -71,29 +57,24 @@
         @selection-change="handleSelectionChange"
       >
         <el-table-column type="selection" width="55"></el-table-column>
-        <el-table-column  prop="realName"  label="姓名"></el-table-column>
+        <el-table-column  prop="image"  label="头像">
+          <template slot-scope="{row}">
+            <el-avatar :size="50" :src="row.image"></el-avatar>
+          </template>
+        </el-table-column>
+        <el-table-column  prop="realName"  label="名称"></el-table-column>
         <el-table-column  prop="phone"  label="联系电话"></el-table-column>
         <el-table-column  prop="idCard"  label="身份证号" width="180"></el-table-column>
         <el-table-column  prop="gender"  label="性别">
             <template slot-scope="{row}">
-                <span v-if="row.gender=='0'">女</span>
+                <span v-if="row.gender=='2'">女</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="lastLoginTime"  label="最后登录时间" width="180"></el-table-column>
-        <el-table-column  prop="applicationCheckTime"  label="申请认证时间" width="180"></el-table-column>
-        <el-table-column  prop="checkTime"  label="认证时间" width="180"></el-table-column>
-        <el-table-column  prop="status"  label="认证状态">
-            <template slot-scope="{row}">
-                <span v-if="row.status=='0'" style="color: #F56C6C;">未认证</span>
-                <span v-else-if="row.status=='1'" style="color: #67C23A;">已认证</span>
-          </template>
-        </el-table-column>
+        <el-table-column  prop="region"  label="所在地区" width="180"></el-table-column>
         <el-table-column label="操作">
           <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="primary" @click="handleEdit(row)">编辑-</el-link>
             <el-link type="danger" @click="handleDelete(row)">删除</el-link>
           </template>
         </el-table-column>
@@ -113,55 +94,6 @@
         :title="modalTitle"
         @close="onDetailModalClose"
       ></customerInfo-detail>
-      <el-dialog
-      title="批量导入人员"
-      :visible.sync="batchImportVisible"
-      :modal-append-to-body="false"
-      style="text-align: left"
-      :close-on-click-modal="false"
-    >
-      <el-form label-width="150px">
-        <el-form-item label="模板下载">
-          <el-link
-            href="https://oss.xiaoxinda.com/jk-temporary-workers/person.xls"
-            type="primary"
-            target="_blank"
-            >点击下载模板</el-link
-          >
-        </el-form-item>
-        <el-form-item label="上传文件">
-          <el-upload
-            class="upload-demo"
-            accept=".xls"
-            :action="uploadUrlXls"
-            :data="uploadXlsData"
-            :headers="headers"
-            :on-preview="handleBatchImportPreview"
-            name="uploadFile"
-            :multiple="true"
-            :limit="1"
-            :on-remove="handleBatchImportRemove"
-            :before-remove="beforeBatchImportRemove"
-            :before-upload="beforeUpload"
-            :on-exceed="handleBatchImportExceed"
-            :on-success="handleBatchImportSuccess"
-            :file-list="batchImportFileList"
-          >
-            <el-button size="small" type="primary" :loading="xlsLoading"
-              >点击上传</el-button
-            >
-            <div slot="tip" class="el-upload__tip">
-              只能上传xls文件，且不超过500kb
-            </div>
-          </el-upload>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="batchImportVisible = false"
-          >关 闭</el-button
-        >
-      </div>
-    </el-dialog>
     </div>
   </template>
   <script>
@@ -215,18 +147,6 @@
         headers: {
             Authorization: getToken(),
         },
-        statusList:[
-          {
-            "id":"0",
-            "name":"未认证",
-            "value":"0"
-          },
-          {
-            "id":"1",
-            "name":"已认证",
-            "value":"1"
-          }
-        ],
       };
     },
     methods: {

src/views/base/personInfo-list.vue

@@ -20,19 +20,6 @@
         <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"
@@ -84,6 +71,11 @@
         @selection-change="handleSelectionChange"
       >
         <el-table-column type="selection" width="55"></el-table-column>
+        <el-table-column  prop="image"  label="头像">
+          <template slot-scope="{row}">
+            <el-avatar :size="50" :src="row.image"></el-avatar>
+          </template>
+        </el-table-column>
         <el-table-column  prop="realName"  label="姓名"></el-table-column>
         <el-table-column  prop="phone"  label="联系电话"></el-table-column>
         <el-table-column  prop="idCard"  label="身份证号" width="180"></el-table-column>

src/views/base/workOrder-detail.vue

@@ -0,0 +1,536 @@
+
+<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="1500px"
+    >
+      <div class="user-panel" v-loading="loading">
+        <el-form
+          ref="form"
+          :model="formModel"
+          :rules="ruleValidate"
+          :label-width="'100px'"
+          :inline="true"
+        >
+          <el-form-item label="工单号" prop="number">
+            <el-input v-model="formModel.number" placeholder="请输入真实姓名" style="width: 300px"></el-input>
+          </el-form-item>
+          <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="address">
+            <el-input v-model="formModel.address" placeholder="请输入身份证号" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="日期" prop="date">
+            <el-input v-model="formModel.date" placeholder="请输入所在地区" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="报价" prop="price">
+            <el-input v-model="formModel.price" placeholder="请输入报价" style="width: 300px"></el-input>
+          </el-form-item>
+          <el-form-item label="支付状态" prop="payStatus">
+            <el-select v-model="formModel.payStatus" placeholder="请选择" style="width: 300px">
+              <el-option
+                v-for="item in paystatusList"
+                :key="item.value"
+                :label="item.name"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div>
+        <el-tabs v-model="activeName" type="card">
+            <el-tab-pane label="工单信息" name="first">
+                <el-card class="box-card">
+                    <div slot="header" class="clearfix">
+                        <span>工单信息</span>
+                    </div>
+                    <div>
+                        <el-form
+                            ref="form"
+                            :model="formModel2"
+                            :rules="ruleValidate"
+                            :label-width="'150px'"
+                            :inline="true"
+                            >
+                        <el-form-item label="所在地" prop="address">
+                            <el-input v-model="formModel2.address" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="施工位置" prop="location">
+                            <el-input v-model="formModel2.location" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="施工环境" prop="environment">
+                            <el-input v-model="formModel2.environment" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="水箱材质" prop="material">
+                            <el-input v-model="formModel2.material" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="水箱体积" prop="volume">
+                            <el-input v-model="formModel2.volume" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">m³</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="异型水箱补贴" prop="amount">
+                            <el-input v-model="formModel2.amount" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">元</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="施工难度" prop="difficulty">
+                            <el-input v-model="formModel2.difficulty" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="额外补助" prop="subsidyType">
+                            <el-input v-model="formModel2.subsidyType" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="补贴金额" prop="subsidyAmount">
+                            <el-input v-model="formModel2.subsidyAmount" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">元</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="工程总预算" prop="budget">
+                            <el-input v-model="formModel2.budget" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">元</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="工期要求" prop="period">
+                            <el-input v-model="formModel2.period" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">月</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="通过后打款比例" prop="completionPayProp">
+                            <el-input v-model="formModel2.completionPayProp" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">%</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="驻地条件要求" prop="requirement">
+                            <el-input v-model="formModel2.requirement" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="施工阶段要求" prop="stageRequirements">
+                            <el-input v-model="formModel2.stageRequirements" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="验收标准" prop="acceptanceCriteria">
+                            <el-input v-model="formModel2.acceptanceCriteria" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="售后要求" prop="salesRequirement">
+                            <el-input v-model="formModel2.salesRequirement" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        </el-form>
+                    </div>
+                </el-card>
+                <el-card class="box-card">
+                    <div slot="header" class="clearfix">
+                        <span>接单要求</span>
+                    </div>
+                    <div>
+                        <el-form
+                            ref="form"
+                            :model="formModel3"
+                            :rules="ruleValidate"
+                            :label-width="'250px'"
+                            :inline="true"
+                            >
+                        <el-form-item label="保证金" prop="amount">
+                            <el-input v-model="formModel3.amount" placeholder="请输入所在地" style="width: 300px">
+                              <template slot="append">元</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="师傅完成工单量" prop="completedNum">
+                            <el-input v-model="formModel3.completedNum" style="width: 300px">
+                              <template slot="append">单</template>
+                            </el-input>
+                        </el-form-item>
+                        <el-form-item label="订单发布模式" prop="orderModel">
+                            <el-select v-model="formModel3.orderModel" placeholder="请选择" style="width: 300px">
+                              <el-option
+                                v-for="item in orderModelList"
+                                :key="item.value"
+                                :label="item.name"
+                                :value="item.value">
+                              </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="是否要求师傅具有施工资质" prop="isQualification">
+                            <el-switch
+                            style="width: 300px"
+                              v-model="formModel3.isQualification">
+                            </el-switch>
+                        </el-form-item>
+                        <el-form-item label="是否要求师傅上传购买保险凭证" prop="isInsuranceCertificate">
+                            <el-switch
+                            style="width: 300px"
+                              v-model="formModel3.isInsuranceCertificate">
+                            </el-switch>
+                        </el-form-item>
+
+                    </el-form>
+                    </div>
+                </el-card>
+                <el-card class="box-card">
+                    <div slot="header" class="clearfix">
+                        <span>客户信息</span>
+                    </div>
+                    <div>
+                        <el-form
+                            ref="form"
+                            :model="formModel4"
+                            :rules="ruleValidate"
+                            :label-width="'150px'"
+                            :inline="true"
+                            >
+                        <el-form-item label="客户名称">
+                            <el-input v-model="formModel4.customerName" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="联系方式" prop="phone">
+                            <el-input v-model="formModel4.customerPhone" placeholder="请输入所在地" style="width: 300px"></el-input>
+                        </el-form-item>
+                    </el-form>
+                    </div>
+                </el-card>
+                <el-card class="box-card">
+                    <div slot="header" class="clearfix">
+                    <span>订单信息</span>
+                    </div>
+                    <div>
+                        <el-form
+                            ref="form"
+                            :model="formModel5"
+                            :rules="ruleValidate"
+                            :label-width="'150px'"
+                            :inline="true"
+                            >
+                        <el-form-item label="订单状态" prop="status">
+                            <el-select v-model="formModel.status" placeholder="请选择订单状态" style="width: 300px">
+                              <el-option
+                                v-for="item in orderStatusList"
+                                :key="item.value"
+                                :label="item.name"
+                                :value="item.value">
+                              </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item label="订单编号" prop="number">
+                            <el-input v-model="formModel.number" placeholder="请输入订单编号" style="width: 300px"></el-input>
+                        </el-form-item>
+                        <el-form-item label="发布时间" prop="createTime">
+                            <el-input v-model="formModel.createTime" placeholder="请输入发布时间" style="width: 300px"></el-input>
+                        </el-form-item>
+                    </el-form>
+                    </div>
+                </el-card>
+            </el-tab-pane>
+            <el-tab-pane label="现场照片" name="second">
+                <div>
+                    <el-image v-for="(item,index) in imageList" :key="index"
+                        class="img"
+                        src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
+                        fit="fit"></el-image>
+                </div>
+            </el-tab-pane>
+            <el-tab-pane label="师傅信息" name="third">
+                <div style="margin:30px">
+                    <el-descriptions>
+                        <el-descriptions-item label="姓名">{{technicianInfo.realName}}</el-descriptions-item>
+                        <el-descriptions-item label="星级">4.6分</el-descriptions-item>
+                        <el-descriptions-item label="已完成单数">50单</el-descriptions-item>
+                        <el-descriptions-item label="好评率">80%</el-descriptions-item>
+                        <el-descriptions-item label="擅长类目">家具灯具厨卫健身器材</el-descriptions-item>
+                        <el-descriptions-item label="师傅来源">4.6分</el-descriptions-item>
+                        <el-descriptions-item label="所在地区">50单</el-descriptions-item>
+                        <el-descriptions-item label="公司性质">80%</el-descriptions-item>
+                        <el-descriptions-item label="公司地址">家具灯具厨卫健身器材</el-descriptions-item>
+                        <el-descriptions-item label="联系电话">4.6分</el-descriptions-item>
+                        <el-descriptions-item label="服务介绍">50单</el-descriptions-item>
+                    </el-descriptions>
+                </div>
+            </el-tab-pane>
+            <el-tab-pane label="施工进度" name="fourth">
+                <div style="margin:50px">
+                  <el-timeline>
+                    <el-timeline-item :timestamp="item.submitDate" placement="top" v-for="(item,index) in constructionProgressList" :key="index">
+                        <h4>{{item.submitByN}} {{item.title}}</h4>
+                        <div>
+                          <el-image v-for="(item1,index1) in item.imageList" :key="index1"
+                          class="img"
+                          style="width:50px;height:50px"
+                          :src="item1"
+                          fit="fit"></el-image>
+                        </div>
+                        <p>{{item.submitByN}} 提交于 {{item.submitTime}}</p>
+                    </el-timeline-item>
+                  </el-timeline>
+                </div>
+            </el-tab-pane>
+            <el-tab-pane label="客户评价" name="five">
+                <el-table
+                :data="tableData"
+                style="width: 100%">
+                <el-table-column
+                    prop="companyName"
+                    label="评论人"
+                    width="180">
+                </el-table-column>
+                <el-table-column prop="starRating" label="星级" >
+                  <template slot-scope="{row}">
+                    <el-rate v-model="row.starRating" disabled ></el-rate>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                    prop="content"
+                    label="评论内容" width="400">
+                </el-table-column>
+                <el-table-column prop="address" label="评论图片">
+                  <template slot-scope="{row}">
+                    <span>
+                      <el-image
+                    class="img"
+                    style="width: 50px; height: 50px"
+                    :src="row.image"
+                    fit="fit"></el-image>
+                    </span>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                    prop="createTime"
+                    label="评论时间">
+                </el-table-column>
+                </el-table>
+            </el-tab-pane>
+        </el-tabs>
+        
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="closeDialog">取 消</el-button>
+        <!-- <el-button type="primary" @click="handleSubmit" :loading="submitting"
+          >确 定</el-button
+        > -->
+      </span>
+    </el-dialog>
+  </template>
+  <script>
+  import Constant from "@/constant";
+  import { getToken } from "@/utils/auth"; // get token from cookie
+  import workOrderApi from "@/api/base/workOrder";
+  import dataDictionaryApi from "@/api/sys/dataDictionary";
+  
+  export default {
+    props: ["businessKey", "title"],
+    data() {
+      return {
+          showPwd: true,
+          ruleValidate: {
+
+          },
+          roleList: [],
+          formModel: {},
+          formModel2:{},
+          formModel3:{},
+          formModel4:{},
+          formModel5:{},
+          tableData:[],
+          showDialog: true,
+          loading: false,
+          submitting: false,
+          enterpriseList:[],
+          //上传地址
+          uploadUrl: Constant.serverUrl + "/uploadPicture",
+          uploadData: {
+              subFolder: "water-tank",
+          },
+          fileUrl: "",
+          headers: {
+              Authorization: getToken(),
+          },
+          activeName: 'first',
+          paystatusList:[],
+          orderStatusList:[],
+          orderModelList:[],
+          technicianInfo:{},
+          imageList:[],
+          constructionProgressList:[],
+          reverse: true,
+          activities: [{
+            content: '活动按期开始',
+            timestamp: '2018-04-15'
+          }, {
+            content: '通过审核',
+            timestamp: '2018-04-13'
+          }, {
+            content: '创建成功',
+            timestamp: '2018-04-11'
+          }]
+      };
+    },
+    created() {
+      var self = this;
+
+      dataDictionaryApi.findByCatalogName({
+        catalogName: "支付状态",
+      })
+      .then((response) => {
+        var jsonData = response.data;
+        
+        self.paystatusList = jsonData.data;
+      });
+
+      dataDictionaryApi.findByCatalogName({
+        catalogName: "工单状态",
+      })
+      .then((response) => {
+        var jsonData = response.data;
+        
+        self.orderStatusList = jsonData.data;
+
+        //alert(JSON.stringify(self.orderStatusList))
+      });
+
+      dataDictionaryApi.findByCatalogName({
+        catalogName: "订单发布模式",
+      })
+      .then((response) => {
+        var jsonData = response.data;
+        
+        self.orderModelList = jsonData.data;
+      });
+    },
+    methods: {
+      closeDialog() {
+        this.$emit("close", false);
+      },
+      handleSubmit() {
+        var self = this;
+  
+        this.$refs["form"].validate((valid) => {
+          if (valid) {
+            (function () {
+              var id = self.formModel.id;
+  
+              if (id == null || id.length == 0) {
+                return workOrderApi.add(self.formModel);
+              } else {
+                return workOrderApi.update(self.formModel);
+              }
+            })().then(function (response) {
+              var jsonData = response.data;
+  
+              if (jsonData.result) {
+                self.$message({
+                  message: "保存成功!",
+                  type: "success",
+                });
+  
+                self.$emit("close", true);
+              } else {
+                self.$message({
+                  message: jsonData.message + "",
+                  type: "warning",
+                });
+  
+                self.$emit("close", false);
+              }
+            });
+          }
+        });
+      },
+      handleAvatarSuccess(res, file) {
+          var self = this;
+          self.formModel.image = res.data;
+  
+          self.fileUrl =
+            res.data + "?x-oss-process=image/resize,m_lfit,h_300,w_300";
+      },
+      beforeAvatarUpload(file) {
+          const isLt2M = file.size / 1024 / 1024 < 2;
+          if (!isLt2M) {
+              this.$message.error('上传头像图片大小不能超过 2MB!');
+          }
+          return isLt2M;
+      }
+    },
+    async mounted() {
+      var self = this;
+      self.loading = true;
+  
+      (function () {
+        if (self.businessKey != null && self.businessKey.length > 0) {
+          return workOrderApi.edit(self.businessKey);
+        } else {
+          return workOrderApi.create();
+        }
+      })()
+        .then((response) => {
+          var jsonData = response.data;
+  
+          if (jsonData.result) {
+              self.formModel = jsonData.data.workOrder;
+              self.formModel2 = jsonData.data.installationRequirement;
+              self.formModel3 = jsonData.data.receiveRequire;
+              self.formModel4.customerName = jsonData.data.customerName;
+              self.formModel4.customerPhone = jsonData.data.customerPhone;
+              self.tableData = jsonData.data.commentInfoList;
+              self.technicianInfo = jsonData.data.technicianInfo;
+              self.imageList = jsonData.data.imageList;
+              self.constructionProgressList = jsonData.data.constructionProgressList;
+  
+              let image = self.formModel.image;
+              if (image != null) {
+                  self.fileUrl = image 
+              }
+  
+              self.showModal = true;
+          } else {
+            self.$message.error(jsonData.message + "");
+          }
+  
+          self.loading = false;
+        })
+        .catch((error) => {
+          self.$message.error(error + "");
+          self.loading = false;
+        });
+    },
+    components: {
+    },
+  };
+  </script>
+  <style scoped>
+  .user-panel {
+    margin: 10px auto;
+  }
+  .avatar-uploader .el-upload {
+      border: 1px dashed #d9d9d9;
+      border-radius: 6px;
+      cursor: pointer;
+      position: relative;
+      overflow: hidden;
+    }
+    .avatar-uploader .el-upload:hover {
+      border-color: #409EFF;
+    }
+    .avatar-uploader-icon {
+      font-size: 28px;
+      color: #8c939d;
+      width: 178px;
+      height: 178px;
+      line-height: 178px;
+      text-align: center;
+    }
+    .avatar {
+      width: 178px;
+      height: 178px;
+      display: block;
+    }
+    .box-card{
+        margin-bottom:10px
+    }
+    .img{
+        width: 100px; 
+        height: 100px;
+        margin:10px
+    }
+    
+  </style>

src/views/base/workOrder-list.vue

@@ -41,7 +41,7 @@
       </el-form>
       <el-divider></el-divider>
       <el-row class="button-group">
-        <el-button type="primary" size="small" plain icon="el-icon-circle-plus" @click="handleAdd">新增</el-button>
+        <!-- <el-button type="primary" size="small" plain icon="el-icon-circle-plus" @click="handleAdd">新增</el-button> -->
         <el-button
           type="primary"
           size="small"
@@ -50,20 +50,6 @@
           :disabled="multipleSelection.length==0"
           @click="handleBatchDelete"
         >删除选中项</el-button>
-        <el-button
-          type="primary"
-          size="small"
-          plain
-          icon="el-icon-upload"
-          @click="batchImportVisible = true"
-        >导入</el-button>
-        <el-button
-          type="primary"
-          size="small"
-          plain
-          icon="el-icon-upload2"
-          @click="exportXls"
-        >导出数据</el-button>
       </el-row>
       <el-table
         :data="tableData"
@@ -74,29 +60,22 @@
         @selection-change="handleSelectionChange"
       >
         <el-table-column type="selection" width="55"></el-table-column>
-        <el-table-column  prop="realName"  label="姓名"></el-table-column>
-        <el-table-column  prop="phone"  label="联系电话"></el-table-column>
-        <el-table-column  prop="idCard"  label="身份证号" width="180"></el-table-column>
-        <el-table-column  prop="gender"  label="性别">
+        <el-table-column  prop="number"  label="工单号"></el-table-column>
+        <el-table-column  prop="title"  label="标题" width="180"></el-table-column>
+        <el-table-column  prop="address"  label="地址" width="180"></el-table-column>
+        <el-table-column  prop="date"  label="日期" width="150"></el-table-column>
+        <el-table-column  prop="location"  label="所在地区" width="180"></el-table-column>
+        <el-table-column  prop="price"  label="报价"></el-table-column>
+        <el-table-column  prop="companyName"  label="发起客户" width="180"></el-table-column>
+        <el-table-column  prop="status"  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="region"  label="所在地区" width="180"></el-table-column>
-        <el-table-column  prop="applicationCheckTime"  label="申请认证时间" width="180"></el-table-column>
-        <el-table-column  prop="checkTime"  label="认证时间" width="180"></el-table-column>
-        <el-table-column  prop="status"  label="认证状态">
-            <template slot-scope="{row}">
-                <span v-if="row.status=='0'" style="color: #F56C6C;">未认证</span>
-                <span v-else-if="row.status=='1'" style="color: #67C23A;">已认证</span>
+                <span v-if="row.status=='1'" style="color: #F56C6C;">未接单</span>
+                <span v-else-if="row.status=='2'" style="color: #67C23A;" >已接单</span>
           </template>
         </el-table-column>
         <el-table-column label="操作">
           <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="primary" @click="handleEdit(row)">查看-</el-link>
             <el-link type="danger" @click="handleDelete(row)">删除</el-link>
           </template>
         </el-table-column>
@@ -116,55 +95,6 @@
         :title="modalTitle"
         @close="onDetailModalClose"
       ></workOrder-detail>
-      <el-dialog
-      title="批量导入人员"
-      :visible.sync="batchImportVisible"
-      :modal-append-to-body="false"
-      style="text-align: left"
-      :close-on-click-modal="false"
-    >
-      <el-form label-width="150px">
-        <el-form-item label="模板下载">
-          <el-link
-            href="https://oss.xiaoxinda.com/jk-temporary-workers/person.xls"
-            type="primary"
-            target="_blank"
-            >点击下载模板</el-link
-          >
-        </el-form-item>
-        <el-form-item label="上传文件">
-          <el-upload
-            class="upload-demo"
-            accept=".xls"
-            :action="uploadUrlXls"
-            :data="uploadXlsData"
-            :headers="headers"
-            :on-preview="handleBatchImportPreview"
-            name="uploadFile"
-            :multiple="true"
-            :limit="1"
-            :on-remove="handleBatchImportRemove"
-            :before-remove="beforeBatchImportRemove"
-            :before-upload="beforeUpload"
-            :on-exceed="handleBatchImportExceed"
-            :on-success="handleBatchImportSuccess"
-            :file-list="batchImportFileList"
-          >
-            <el-button size="small" type="primary" :loading="xlsLoading"
-              >点击上传</el-button
-            >
-            <div slot="tip" class="el-upload__tip">
-              只能上传xls文件，且不超过500kb
-            </div>
-          </el-upload>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="batchImportVisible = false"
-          >关 闭</el-button
-        >
-      </div>
-    </el-dialog>
     </div>
   </template>
   <script>
@@ -305,14 +235,14 @@
       handleAdd() {
         var self = this;
         
-        self.modalTitle = "新增用户";
+        self.modalTitle = "新增工单";
         self.businessKey = "";
         self.showModal = true;
       },
       handleEdit(record) {
         var self = this;
         
-        self.modalTitle = "编辑用户";
+        self.modalTitle = "编辑工单";
         self.businessKey = record.id;
         self.showModal = true;
       },