Merge remote-tracking branch 'origin/dev_shehuizuzhi_ljj'

src/views/modules/communityService/shzz/cpts/edit.vue

@@ -9,8 +9,37 @@
           :disabled="formType === 'detail'"
           class="form"
       >
+
+        <el-form-item label="头像" label-width="150px"
+                      prop="imageList"
+                      style="display: block">
+          <div class="imsg-list">
+            <div v-for="(item, index) in dataForm.imageList" :key="index" class="imgs-item">
+              <el-image
+                  style="width: 100px; height: 100px"
+                  :src="item"
+                  fit="fill"
+                  :preview-src-list="dataForm.imageList"></el-image>
+              <i class="el-icon-delete" @click="handleDelimg(item, index)"></i>
+            </div>
+            <el-upload class="avatar-uploader"
+                       v-if="dataForm.imageList.length < 1 && !disabled"
+                       :action="uploadUlr"
+                       :data="{customerId:customerId}"
+                       :show-file-list="false"
+                       :disabled="disabled"
+                       :on-progress="handleProgress"
+                       :on-success="handleImgSuccess"
+                       :before-upload="beforeImgUpload"
+                       accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP">
+              <el-progress v-if="uploading" :width="100" type="circle" :percentage="unloadPencent"></el-progress>
+              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+
+            </el-upload>
+          </div>
+        </el-form-item>
         <el-form-item
-          label="社会组织名称	"
+            label="组织名称	"
             prop="societyName"
             label-width="150px"
             style="display: block"
@@ -19,14 +48,14 @@
               class="item_width_1"
               maxlength="50"
               show-word-limit
-            placeholder="请输入社会组织名称	"
+              placeholder="请输入组织名称	"
               v-model="dataForm.societyName"
           >
           </el-input>
         </el-form-item>
 
         <el-form-item
-          label="服务事项"
+            label="服务内容"
             prop="serviceMatters"
             label-width="150px"
             style="display: block"
@@ -37,12 +66,12 @@
               maxlength="1000"
               show-word-limit
               :rows="3"
-            placeholder="请输入服务事项，不超过1000字"
+              placeholder="请输入服务内容，不超过1000字"
               v-model="dataForm.serviceMatters"
           ></el-input>
         </el-form-item>
 
-        <el-form-item
+<!--        <el-form-item
             label="负责人姓名	"
             prop="personInCharge"
             label-width="150px"
@@ -56,10 +85,10 @@
               v-model="dataForm.personInCharge"
           >
           </el-input>
-        </el-form-item>
+        </el-form-item>-->
 
         <el-form-item
-          label="负责人电话	"
+            label="服务电话	"
             prop="mobile"
             label-width="150px"
             style="display: block"
@@ -68,7 +97,7 @@
               class="item_width_1"
               maxlength="50"
               show-word-limit
-            placeholder="请输入负责人电话	"
+              placeholder="请输入服务电话	"
               v-model="dataForm.mobile"
           >
           </el-input>
@@ -76,11 +105,19 @@
 
         <el-form-item
             label="服务时间	"
-          prop="serviceTime"
+            prop="serviceTimeStr"
             label-width="150px"
             style="display: block"
         >
-          <el-date-picker
+          <el-input
+              class="item_width_1"
+              maxlength="50"
+              show-word-limit
+              placeholder="请输入服务时间	"
+              v-model="dataForm.serviceTimeStr"
+          >
+          </el-input>
+<!--          <el-date-picker
               v-model="dataForm.serviceTime"
               type="daterange"
               range-separator="至"
@@ -88,7 +125,7 @@
               end-placeholder="结束日期"
               value-format="yyyy-MM-dd"
           >
-          </el-date-picker>
+          </el-date-picker>-->
         </el-form-item>
 
         <el-form-item
@@ -114,7 +151,7 @@
           </el-select>
         </el-form-item>
 
-        <el-form-item
+        <!--        <el-form-item
                   label="位置坐标"
                   prop="longitude"
                   label-width="150px"
@@ -155,7 +192,7 @@
                       </el-input>
                     </div>
                   </div>
-        </el-form-item>
+                </el-form-item>-->
       </el-form>
     </div>
     <div class="div_btn">
@@ -165,7 +202,8 @@
           type="primary"
           :disabled="btnDisable"
           @click="handleComfirm"
-        >确 定</el-button
+      >确 定
+      </el-button
       >
     </div>
   </div>
@@ -185,6 +223,11 @@ let loading; // 加载动画
 export default {
   data() {
     return {
+      uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2',
+      btnLoading: false,
+      uploading: false,
+      disabled: false,
+      customerId: '',
       formType: "add", //表单操作类型 add新增，edit编辑，detail详情
 
       agencyId: "",
@@ -201,11 +244,13 @@ export default {
         mobile: "",
         serviceStartTime: "",
         serviceEndTime: "",
+        serviceTimeStr: "",
         serviceTime: ["", ""],
         adminStaffId: "",
         address: "",
         longitude: "",
         latitude: "",
+        imageList: [],
       },
     };
   },
@@ -214,29 +259,35 @@ export default {
     dataRule() {
       return {
         societyName: [
-          { required: true, message: "社会组织名称	不能为空", trigger: "blur" },
+          {required: true, message: "组织名称	不能为空", trigger: "blur"},
           {
             min: 1,
             max: 50,
-            message: "社会组织名称	长度在 1 到 50个字符",
+            message: "组织名称	长度在 1 到 50个字符",
             trigger: "blur",
           },
         ],
+        imageList: [
+          {required: true, message: "头像不能为空", trigger: "blur"},
+        ],
         serviceMatters: [
-          { required: true, message: "服务事项不能为空", trigger: "blur" },
+          {required: true, message: "服务内容不能为空", trigger: "blur"},
         ],
-        personInCharge: [
+        /*personInCharge: [
           {required: true, message: "负责人姓名不能为空", trigger: "blur"},
-        ],
+        ],*/
-        adminStaffId: [
+        /*adminStaffId: [
           { required: true, message: "绑定管理员不能为空", trigger: "blur" },
-        ],
+        ],*/
         mobile: [
-          { required: true, message: "负责人电话不能为空", trigger: "blur" },
+          {required: true, message: "服务电话不能为空", trigger: "blur"},
         ],
-        longitude: [
+        serviceTimeStr: [
-          { required: true, message: "位置坐标不能为空", trigger: "blur" },
+          {required: true, message: "服务时间不能为空", trigger: "blur"},
         ],
+        /*longitude: [
+          { required: true, message: "位置坐标不能为空", trigger: "blur" },
+        ],*/
       };
     },
   },
@@ -251,7 +302,7 @@ export default {
   },
 
   async mounted() {
-    this.initMap();
+    //this.initMap();
 
     await this.loadAgency();
     this.loadStaff();
@@ -326,7 +377,34 @@ export default {
             }
           });
     },
+    beforeImgUpload(file) {
+      const isPNG = (file.type === 'image/png') || (file.type === 'image/jpeg')
+      const isLt1M = file.size / 1024 / 1024 < 10
 
+      if (!isPNG) {
+        this.$message.error('上传图片只能是 PNG 或 JPEG 格式!')
+      }
+      if (!isLt1M) {
+        this.$message.error('上传图片大小不能超过 10MB!')
+      }
+      return isPNG && isLt1M
+    },
+    handleProgress(event, file, fileList) {
+      this.uploading = true
+      this.unloadPencent = Number(file.percentage.toFixed(0))
+    },
+    handleImgSuccess(res, file) {
+      if (res.code === 0 && res.msg === 'success') {
+        this.uploading = false
+        this.unloadPencent = 0
+        this.dataForm.imageList.push(res.data.url)
+      } else {
+        this.$message.error(res.msg)
+      }
+    },
+    handleDelimg(item, index) {
+      this.dataForm.imageList.splice(index, 1)
+    },
     handleMoveCenter() {
       //修改地图中心点
       const center = map.getCenter();
@@ -341,9 +419,12 @@ export default {
       this.$refs.ref_form.resetFields();
 
       this.formType = type;
-      console.log(row);
+      this.dataForm.imageList = []
       if (row) {
         this.dataForm = {...this.dataForm, ...row};
+        if (row.imgUrl) {
+          this.dataForm.imageList.push(row.imgUrl);
+        }
         this.societyId = this.dataForm.societyId;
         if (row.latitude && row.longitude) {
           map.setCenter(new TMap.LatLng(row.latitude, row.longitude));
@@ -355,7 +436,6 @@ export default {
     async loadAgency() {
       const url = "/epmetuser/customerstaff/staffbasicinfo";
       let params = {};
-
       const {data, code, msg} = await requestPost(url, params);
 
       if (code === 0) {
@@ -405,6 +485,7 @@ export default {
     },
 
     async submit() {
+
       let url = "";
       if (this.formType === "add") {
         url = "/heart/societyorg/add";
@@ -437,6 +518,9 @@ export default {
     },
     resetData() {
       this.societyId = ""; //小区ID
+      this.$refs.ref_form.resetFields();
+      this.propertyFormShow = false;
+     /*
       this.dataForm = {
         societyName: "",
         serviceMatters: "",
@@ -449,8 +533,9 @@ export default {
         address: "",
         longitude: "",
         latitude: "",
-      };
+        imageList:[]
-      this.propertyFormShow = false;
+      };*/
+
     },
     // 开启加载动画
     startLoading() {
@@ -471,17 +556,20 @@ export default {
 };
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .item_width_1 {
   width: 500px;
 }
+
 .item_width_2 {
   width: 400px;
 }
+
 .item_width_3 {
   margin-left: 10px;
   width: 200px;
 }
+
 .item_width_4 {
   width: 200px;
 }
@@ -494,14 +582,47 @@ export default {
   display: flex;
   justify-content: flex-end;
 }
+
 .el-tabs {
   margin: 0 20px;
 }
+
 .el-upload__tip {
   color: rgb(155, 155, 155);
   margin: 0;
 }
+
 .form {
   margin-top: 30px;
 }
+
+.avatar-uploader {
+  ::v-deep
+  .el-upload {
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .el-upload:hover {
+    border-color: #409EFF;
+  }
+
+  .avatar {
+    width: 100px;
+    height: 100px;
+    display: block;
+  }
+
+  .avatar-uploader-icon {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    font-size: 28px;
+    color: #8c939d;
+    width: 100px;
+    height: 100px;
+    line-height: 100px;
+    text-align: center;
+  }
+}
 </style>

src/views/modules/communityService/shzz/index.vue

@@ -1,8 +1,24 @@
 <template>
-  <div>
   <div class="resi-container">
     <el-card class="resi-card">
-        <el-row class="resi-row-box"
+      <div class="">
+        <el-form ref="fmData" :inline="true" :model="fmData" class="demo-form-inline">
+          <el-form-item label="组织名称" prop="societyName">
+            <el-input v-model="fmData.societyName" placeholder="请输入" class="input-width" clearable></el-input>
+          </el-form-item>
+          <el-form-item label="服务电话" prop="mobile">
+            <el-input v-model="fmData.mobile" placeholder="请输入" class="input-width" clearable></el-input>
+          </el-form-item>
+          <el-form-item label="服务时间" prop="serviceTimeStr">
+            <el-input v-model="fmData.serviceTimeStr" placeholder="请输入" class="input-width" clearable></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button class="diy-button--search" size="small" @click="handleSearch">查询</el-button>
+            <el-button class="diy-button--reset" size="small" @click="resetForm('fmData')">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <!--        <el-row class="resi-row-box"
                       :class="openSearch && 'resi-row-more'">
                 <el-row class="resi-row"
                         :gutter="20">
@@ -23,10 +39,10 @@
 
                   <el-col :span="8">
                     <div class="resi-cell">
-                <div class="resi-cell-label">负责人</div>
+                      <div class="resi-cell-label">服务电话</div>
                       <div class="resi-cell-value"
                            :class="'resi-cell-value-radio'">
-                  <el-input v-model="fmData.personInCharge"
+                        <el-input v-model="fmData.mobile"
                                   class="resi-cell-input"
                                   size="small"
                                   clearable
@@ -35,13 +51,12 @@
                       </div>
                     </div>
                   </el-col>
-
                   <el-col :span="8">
                     <div class="resi-cell">
-                <div class="resi-cell-label">联系电话</div>
+                      <div class="resi-cell-label">服务时间</div>
                       <div class="resi-cell-value"
                            :class="'resi-cell-value-radio'">
-                  <el-input v-model="fmData.mobile"
+                        <el-input v-model="fmData.serviceTimeStr"
                                   class="resi-cell-input"
                                   size="small"
                                   clearable
@@ -51,39 +66,28 @@
                     </div>
                   </el-col>
                 </el-row>
-          <el-row>
-            <el-col :span="24">
-              <div class="resi-cell">
-                <div class="resi-cell-label">服务时间</div>
-                <div class="resi-cell-value"
-                     :class="'resi-cell-value-radio'">
-                  <el-date-picker v-model="fmData.serviceTime"
-                                  type="daterange"
-                                  range-separator="至"
-                                  start-placeholder="开始日期"
-                                  end-placeholder="结束日期"
-                                  value-format="yyyy-MM-dd">
-                  </el-date-picker>
-                </div>
-              </div>
-            </el-col>
-          </el-row>
               </el-row>
               <el-row class="resi-search">
                 <el-col :span="24">
-            <el-button type="primary"
+                  <el-button class="diy-button&#45;&#45;add"
                              size="small"
-                       @click="handleSearch">查询</el-button>
+                             @click="handleSearch">查询
+                  </el-button>
                 </el-col>
-        </el-row>
+              </el-row>-->
     </el-card>
-    </div>
 
     <el-card class="resi-card-table">
       <div class="resi-row-btn">
-        <el-button type="success"
+        <el-button class="diy-button--add"
+                   size="small"
+                   @click="handleAdd">新增
+        </el-button>
+        <el-button class="diy-button--search"
+                   style="margin-left:10px"
                    size="small"
-                   @click="handleAdd">新增</el-button>
+                   @click="handleExportModule('room')">下载模板
+        </el-button>
         <el-upload ref="upload"
                    class="upload-btn"
                    action="uploadUlr"
@@ -95,16 +99,18 @@
                    :on-success="handleExcelSuccess"
                    :before-upload="beforeExcelUpload"
                    :http-request="uploadHttpRequest">
-          <el-button type="warning"
+          <el-button class="diy-button--delete"
                      size="small"
                      :loading="importLoading">{{
               importBtnTitle
-          }}</el-button>
+            }}
+          </el-button>
         </el-upload>
 
         <el-button @click="handleChu"
-                   type="danger"
+                   class="diy-button--reset"
-                   size="small">excel导出</el-button>
+                   size="small">导出
+        </el-button>
       </div>
       <el-table :data="tableData"
                 border
@@ -116,21 +122,21 @@
                          align="center"
                          width="50"/>
         <el-table-column prop="societyName"
-                         label="社会组织名称">
+                         label="组织名称">
         </el-table-column>
         <el-table-column prop="serviceMatters"
-                         label="服务事项">
+                         label="服务内容">
         </el-table-column>
-        <el-table-column prop="personInCharge"
+        <!--        <el-table-column prop="personInCharge"
                                  label="负责人">
-        </el-table-column>
+                </el-table-column>-->
         <el-table-column prop="mobile"
-                         label="负责人电话"> </el-table-column>
+                         label="服务电话"></el-table-column>
-        <el-table-column prop="serviceTime"
+        <el-table-column prop="serviceTimeStr"
                          label="服务时间"></el-table-column>
-        <el-table-column prop="score"
+        <!--        <el-table-column prop="score"
                                  width="80"
-                         label="积分"> </el-table-column>
+                                 label="积分"> </el-table-column>-->
         <el-table-column fixed="right"
                          label="操作"
                          align="center"
@@ -138,16 +144,18 @@
           <template slot-scope="scope">
             <el-button @click="handleWatch(scope.$index)"
                        type="text"
-                       size="small">查看</el-button>
+                       size="small">查看
-            <el-button type="text"
+            </el-button>
+            <!--            <el-button type="text"
                                    style="color:#00A7A9;"
                                    size="small"
-                       @click="handleScore(scope.row)">积分记录</el-button>
+                                   @click="handleScore(scope.row)">积分记录</el-button>-->
 
             <el-button @click="handleEdit(scope.$index)"
                        type="text"
                        size="small"
-                       style="margin-right: 10px; color: #00a7a9">编辑</el-button>
+                       style="margin-right: 10px; color: #00a7a9">编辑
+            </el-button>
 
             <el-popconfirm title="删除之后无法回复，确认删除？"
                            @onConfirm="handleDel(scope.row, scope.$index)"
@@ -155,7 +163,8 @@
               <el-button slot="reference"
                          type="text"
                          size="small"
-                         style="color: #d51010">删除</el-button>
+                         style="color: #d51010">删除
+              </el-button>
             </el-popconfirm>
           </template>
         </el-table-column>
@@ -229,9 +238,10 @@ export default {
         serviceStartTime: "",
         serviceEndTime: "",
         serviceTime: "",
+        serviceTimeStr: "",
       },
 
-      importBtnTitle: "excel导入",
+      importBtnTitle: "导入",
       importLoading: false,
 
       //积分记录
@@ -247,6 +257,7 @@ export default {
   },
   watch: {
     "fmData.serviceTime": function (val) {
+      console.log("watch start" + val + '_' + Array.isArray(val))
       if (Array.isArray(val) && val.length == 2) {
         this.fmData.serviceStartTime = val[0];
         this.fmData.serviceEndTime = val[1];
@@ -295,22 +306,22 @@ export default {
       const formData = new FormData(); //FormData对象，添加参数只能通过append('key', value)的形式添加
       formData.append("file", file.file); //添加文件对象
       axios({
-        url: window.SITE_CONFIG["apiURL"] + "/heart/societyorg/import",
+        url: window.SITE_CONFIG["apiURL"] + "/heart/societyorg/importV2",
         method: "post",
         data: formData,
         // responseType: "blob",
       })
           .then((res) => {
             this.importLoading = false;
-          this.importBtnTitle = "excel导入";
+            this.importBtnTitle = "导入";
             console.log("resresresresresresres", res);
 
             this.getTableData();
-          if (res.data.code == 0) {
+            this.$message({
-            return this.$message.success(res.data.data || '导入成功');
+              showClose: true,
-          } else {
+              message: '导入中，请到系统管理-导入记录中查看进度',
-            return this.$message.error(res.data.msg);
+              duration: 0
-          }
+            })
           })
           .catch((err) => {
             console.log("失败", err);
@@ -338,7 +349,10 @@ export default {
       this.pageNo = 1;
       this.getTableData();
     },
-
+    resetForm(formName) {
+      this.$refs[formName].resetFields()
+      this.handleSearch()
+    },
     async handleAdd() {
       this.formShow = true;
       await nextTick();
@@ -448,6 +462,43 @@ export default {
 
       this.scoreDiaShow = false
     },
+    async handleExportModule() {
+      let url = "/heart/societyorg/import-template-download";
+
+      let params = {};
+      await this.$http({
+        method: "POST",
+        url,
+        responseType: "blob",
+        data: params,
+      })
+          .then((res) => {
+            // this.download(res.data, title + '.xls')
+            if (res.headers["content-disposition"]) {
+              let fileName = window.decodeURI(
+                  res.headers["content-disposition"].split(";")[1].split("=")[1]
+              );
+              console.log("filename", fileName);
+              let blob = new Blob([res.data], {
+                type: "application/vnd.ms-excel",
+              });
+              var url = window.URL.createObjectURL(blob);
+              var aLink = document.createElement("a");
+              aLink.style.display = "none";
+              aLink.href = url;
+              aLink.setAttribute("download", fileName);
+              document.body.appendChild(aLink);
+              aLink.click();
+              document.body.removeChild(aLink); //下载完成移除元素
+              window.URL.revokeObjectURL(url); //释放掉blob对象
+            } else this.$message.error("下载失败");
+          })
+          .catch((err) => {
+            console.log("err", err);
+            return this.$message.error("网络错误");
+          });
+    },
+
   },
 };
 </script>
@@ -467,10 +518,12 @@ export default {
     background: #ebecf1;
     border-radius: 2px;
   }
+
   .el-tabs__nav-wrap::after,
   .el-tabs__active-bar {
     display: none;
   }
+
   .el-tabs__nav-next,
   .el-tabs__nav-prev {
     line-height: 20px;
@@ -480,16 +533,20 @@ export default {
 .resi-card-table {
   margin-top: 20px;
 }
+
 .resi-row-btn {
   margin-bottom: 13px;
+
   .upload-btn {
     display: inline-block;
     margin: 0 10px;
   }
 }
+
 .resi-other {
   width: 100%;
   display: flex;
+
   .resi-other-title {
     width: 100px;
     box-sizing: border-box;
@@ -500,6 +557,7 @@ export default {
     color: #333;
     text-align: center;
   }
+
   .tabs-other-info {
     // padding-left: 60px;
   }
@@ -514,6 +572,7 @@ export default {
   position: relative;
   overflow: visible;
 }
+
 .resi-down {
   position: absolute;
   left: 50%;
@@ -528,30 +587,37 @@ export default {
   cursor: pointer;
   background: #ffffff;
   border-radius: 0 0 10px 10px;
+
   img {
     display: block;
   }
 }
+
 .resi-row-box {
   height: 104px;
   overflow: hidden;
   transition: height 0.5s;
 }
+
 .resi-row-more {
   height: max-content;
   transition: height 0.5s;
 }
+
 .resi-row {
   margin-bottom: 20px;
 }
+
 .resi-search {
   .el-col {
     text-align: right;
   }
 }
+
 .resi-cell {
   display: flex;
   align-items: center;
+
   .resi-cell-label {
     width: 70px;
     box-sizing: border-box;
@@ -559,25 +625,31 @@ export default {
     text-align: right;
     // line-height: 32;
   }
+
   .resi-cell-value-radio {
     display: flex;
     align-items: center;
     min-height: 32px;
   }
+
   .resi-cell-input {
     width: 180px;
   }
+
   .resi-cell-select {
     width: 180px;
     box-sizing: border-box;
     margin-right: 10px;
+
     &-middle {
       width: 130px;
     }
+
     &-small {
       width: 88px;
     }
   }
+
   .resi-cell-select:last-child {
     margin-right: 0;
   }