宣传图修改

src/views/Sys/PublicizeImg.vue

@@ -1,140 +1,142 @@
 <template>
-    <div>
-        <el-main ref="elMain" style="padding: 0px">
-            <Split :gutterSize="2" style="height: calc(100vh - 120px)">
-                <!-- 左侧树Start -->
-                <SplitArea :size="leftSplitWidth" :minSize="240">
-                    <div>
-                        <!-- 左侧树形结构 -->
-                        <el-tree :data="ztreeNodes" :props="{ children: 'children', label: 'name' }" node-key="id"
-                            :default-expanded-keys="['9']" @node-click="onZTreeClick"></el-tree>
-                    </div>
-                </SplitArea>
-                <!-- 左侧树End -->
+  <div>
+    <el-main ref="elMain" style="padding: 0px">
+      <Split :gutterSize="2" style="height: calc(100vh - 120px)">
+        <!-- 左侧树Start -->
+        <SplitArea :size="leftSplitWidth" :minSize="240">
+          <div>
+            <!-- 左侧树形结构 -->
+            <el-tree :data="ztreeNodes" :props="{ children: 'children', label: 'name' }" node-key="id"
+                     :default-expanded-keys="['9']" @node-click="onZTreeClick"></el-tree>
+          </div>
+        </SplitArea>
+        <!-- 左侧树End -->
 
-                <!-- 右侧列表页面Start -->
-                <SplitArea :size="rightSplitWidth">
-                    <!-- 筛选区域Start -->
-                    <el-row class="queryFrom">
-                        <el-form ref="queryFormRef" :model="pageData" label-width="80px" size="small">
-                            <el-row>
-                                <el-col :span="5">
-                                    <el-form-item label="工号">
-                                        <el-input clearable placeholder="工号" v-model="pageData.userId"></el-input>
-                                    </el-form-item>
-                                </el-col>
-                                <el-col :span="5">
-                                    <el-form-item label="姓名">
-                                        <el-input clearable placeholder="姓名" v-model="pageData.name"></el-input>
-                                    </el-form-item>
-                                </el-col>
-                                <el-col :span="5">
-                                    <el-form-item label="手机号">
-                                        <el-input clearable placeholder="手机号" v-model="pageData.mobile"></el-input>
-                                    </el-form-item>
-                                </el-col>
-                                <el-col :span="5">
-                                    <el-form-item label="状态">
-                                        <el-select style="width:200px" clearable v-model="pageData.status"
-                                            placeholder="请选择">
-                                            <el-option v-for="val in user_statusoptions" :label="val.label"
-                                                :value="val.value" :key="val.id"></el-option>
-                                        </el-select>
-                                    </el-form-item>
-                                </el-col>
-                                <el-col :span="5">
-                                    <el-form-item label="领导人">
-                                        <el-select size="small" style="width:215px" clearable filterable
-                                            v-model="pageData.leaderId" placeholder="请选择">
-                                            <el-option v-for="item in searchLeaderOptions" :key="item.id" :label="item.name"
-                                                :value="item.name">
-                                            </el-option>
-                                        </el-select>
-                                    </el-form-item>
-                                </el-col>
-                                <el-col :span="4">
-                                    <el-form-item label="">
-                                        <el-button type="primary" @click="queryStaffInfo">查询</el-button>
-                                    </el-form-item>
-                                </el-col>
-                            </el-row>
-                        </el-form>
-                    </el-row>
-                    <kt-common-table permsEdit="sys:backline:edit" :data="pageResult" :columns="columns" editButtonName="配置图片"
-                        :showBatchDelete="false" @findPage="findPage" @handleEdit="handleTableEdit">
-                    </kt-common-table>
+        <!-- 右侧列表页面Start -->
+        <SplitArea :size="rightSplitWidth">
+          <!-- 筛选区域Start -->
+          <el-row class="queryFrom">
+            <el-form ref="queryFormRef" :model="pageData" label-width="80px" size="small">
+              <el-row>
+                <el-col :span="5">
+                  <el-form-item label="工号">
+                    <el-input clearable placeholder="工号" v-model="pageData.userId"></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="5">
+                  <el-form-item label="姓名">
+                    <el-input clearable placeholder="姓名" v-model="pageData.name"></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="5">
+                  <el-form-item label="手机号">
+                    <el-input clearable placeholder="手机号" v-model="pageData.mobile"></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="5">
+                  <el-form-item label="状态">
+                    <el-select style="width:200px" clearable v-model="pageData.status"
+                               placeholder="请选择">
+                      <el-option v-for="val in user_statusoptions" :label="val.label"
+                                 :value="val.value" :key="val.id"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="5">
+                  <el-form-item label="领导人">
+                    <el-select size="small" style="width:215px" clearable filterable
+                               v-model="pageData.leaderId" placeholder="请选择">
+                      <el-option v-for="item in searchLeaderOptions" :key="item.id" :label="item.name"
+                                 :value="item.name">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="4">
+                  <el-form-item label="">
+                    <el-button type="primary" @click="queryStaffInfo">查询</el-button>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-form>
+          </el-row>
+          <kt-common-table permsEdit="sys:backline:edit" :data="pageResult" :columns="columns" editButtonName="配置图片"
+                           :showBatchDelete="false" @findPage="findPage" @handleEdit="handleTableEdit">
+          </kt-common-table>
 
-                </SplitArea>
-                <!-- 右侧列表页面End -->
-            </Split>
-        </el-main>
+        </SplitArea>
+        <!-- 右侧列表页面End -->
+      </Split>
+    </el-main>
 
-        <!-- 新增修改界面 -->
-        <el-dialog width="20%" :visible.sync="dialogVisible" :close-on-click-modal="false"
-             @close="closeDialog" v-dialogDrag>
-             <div>
-             上传图片： <el-upload
-                action="#"
-                style="display:inline-block"
-                list-type="picture-card"
-                :auto-upload="false"
-                accept=".png, .jpg, .jpeg"
-                :show-file-list="false"
-                :on-change="drivingupload">
-                <img v-if="qrCodeImage" :src="qrCodeImage"  class="avatar">
-                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-              </el-upload>
-             </div>
-             <span slot="footer" class="dialog-footer">
+    <!-- 新增修改界面 -->
+    <el-dialog width="20%" :visible.sync="dialogVisible" :close-on-click-modal="false"
+               @close="closeDialog" v-dialogDrag>
+      <div>
+        上传图片：
+        <el-upload
+          action="#"
+          style="display:inline-block"
+          list-type="picture-card"
+          :auto-upload="false"
+          accept=".png, .jpg, .jpeg"
+          :show-file-list="false"
+          :on-change="drivingupload">
+          <img v-if="qrCodeImage" :src="qrCodeImage" class="avatar">
+          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+        </el-upload>
+      </div>
+      <span slot="footer" class="dialog-footer">
         <el-button size="small" @click="dialogVisible = false">取 消</el-button>
         <el-button size="small" type="primary" @click="submitForm">确 定</el-button>
       </span>
-        </el-dialog>
+    </el-dialog>
 
-    </div>
+  </div>
 </template>
-  
+
 <script>
 import KtButton from "@/views/Core/KtButton"; // 按钮权限组件
 import tree from "@/components/ztree.vue"; // 机构树组件
 import KtCommonTable from "@/views/Core/KtCommonTable.vue"; //表格组件
 import mixa from '../PeopleManage/mixin'
+
 const mixin = new mixa({
-    treeTypeNum: null
+  treeTypeNum: null
 })
 export default {
-    components: {
-        KtButton,
-        tree,
-        KtCommonTable,
-    },
-    mixins: [mixin],
-    data() {
-        return {
-            qrCodeImage:'',
-            CarFrontFile:{},
-            pageData: {
-                pageNum: 1,
-                pageSize: 20,
-                deptId: JSON.parse(localStorage.getItem('user_data')).deptId,
-                userId: '',
-                realName: '',
-                mobile: '',
-            },
-            formData: {},
-            queryFrom: {},
-            pageResult: {},
-            dialogVisible: false, // 新增编辑界面是否显示
-            departmentList: [], // 选中公司的所有部门的集合
-            deptInfo: {}, //选中机构的基本信息
-            option: [], //机构列表
-            //影像上传列表
-            imagesIdList: [],
-            leaderOptions: [],
-            searchLeaderOptions: {},
-            columns: [
+  components: {
+    KtButton,
+    tree,
+    KtCommonTable,
+  },
+  mixins: [mixin],
+  data() {
+    return {
+      qrCodeImage: '',
+      CarFrontFile: {},
+      pageData: {
+        pageNum: 1,
+        pageSize: 20,
+        deptId: JSON.parse(localStorage.getItem('user_data')).deptId,
+        userId: '',
+        realName: '',
+        mobile: '',
+      },
+      formData: {},
+      queryFrom: {},
+      pageResult: {},
+      dialogVisible: false, // 新增编辑界面是否显示
+      departmentList: [], // 选中公司的所有部门的集合
+      deptInfo: {}, //选中机构的基本信息
+      option: [], //机构列表
+      //影像上传列表
+      imagesIdList: [],
+      leaderOptions: [],
+      searchLeaderOptions: {},
+      columns: [
         // 数据列
-        { prop: "deptId", label: "部门编码", minWidth: 80, sortable: false },
+        {prop: "deptId", label: "部门编码", minWidth: 80, sortable: false},
         {
           prop: "pdeptName",
           label: "机构名称",
@@ -142,17 +144,17 @@ export default {
           sortable: false,
         },
 
-        { prop: "deptName", label: "部门名称", minWidth: 80, sortable: false },
+        {prop: "deptName", label: "部门名称", minWidth: 80, sortable: false},
 
-        { prop: "userId", label: "工号", minWidth: 80, sortable: false },
-        { prop: "name", label: "姓名", minWidth: 120, sortable: false },
+        {prop: "userId", label: "工号", minWidth: 80, sortable: false},
+        {prop: "name", label: "姓名", minWidth: 120, sortable: false},
         {
           prop: "sex",
           label: "性别",
           minWidth: 50,
           sortable: false,
         },
-        { prop: "mobile", label: "联系电话", minWidth: 100, sortable: false },
+        {prop: "mobile", label: "联系电话", minWidth: 100, sortable: false},
         {
           prop: "roleId",
           label: "角色",
@@ -171,151 +173,150 @@ export default {
           sortable: false,
         },
       ],
-        };
-    },
-    created() {
-        this.searchLeaderFun()
-    },
-    methods: {
-        drivingupload(file, fileList){
-            let fileRaw = file.raw;
+    };
+  },
+  created() {
+    this.searchLeaderFun()
+  },
+  methods: {
+    drivingupload(file, fileList) {
+      let fileRaw = file.raw;
       this.qrCodeImage = window.URL.createObjectURL(fileRaw);
-        const params = new FormData(); // 声明formData数据类型
-        params.append("multipartFile", file.raw);
-        params.append("type", "image");
-        this.$api.letter.uploadFile(params).then(res => {
-            if (res.code == "200") {
-                this.CarFrontFile=res.data
-            }
-            else{
-            this.$message.error(res.msg)
-            }
+      const params = new FormData(); // 声明formData数据类型
+      params.append("multipartFile", file.raw);
+      params.append("type", "image");
+      this.$api.letter.uploadFile(params).then(res => {
+        if (res.code == "200") {
+          this.CarFrontFile = res.data
+        } else {
+          this.$message.error(res.msg)
+        }
+      });
+    },
+    searchLeaderFun() {
+      this.$api.user
+        .findBackListByDeptId({deptId: this.deptId})
+        .then((res) => {
+          this.searchLeaderOptions = res.data;
         });
-        },
-        searchLeaderFun() {
-            this.$api.user
-                .findBackListByDeptId({ deptId: this.deptId })
-                .then((res) => {
-                    this.searchLeaderOptions = res.data;
-                });
-        },
-        // 查询Start
-        queryStaffInfo() {
-            this.findPage();
-        },
-        onZTreeClick: function (evt, treeId, treeNode) {
-            // 点击事件
-            this.currentTreeNode = evt;
-            this.deptId = this.currentTreeNode.id;
-            this.pageData.pageNum = 1;
-            this.findPage();
-            this.searchLeaderFun()
-        },
-       
-        // 右侧列表的方法Start
-        findPage(data) {
-            // 获取分页数据
-            if (data && data.pageRequest) {
-                this.pageData.pageNum = data.pageRequest.pageNum;
-                this.pageData.pageSize = data.pageRequest.pageSize;
+    },
+    // 查询Start
+    queryStaffInfo() {
+      this.findPage();
+    },
+    onZTreeClick: function (evt, treeId, treeNode) {
+      // 点击事件
+      this.currentTreeNode = evt;
+      this.deptId = this.currentTreeNode.id;
+      this.pageData.pageNum = 1;
+      this.findPage();
+      this.searchLeaderFun()
+    },
+
+    // 右侧列表的方法Start
+    findPage(data) {
+      // 获取分页数据
+      if (data && data.pageRequest) {
+        this.pageData.pageNum = data.pageRequest.pageNum;
+        this.pageData.pageSize = data.pageRequest.pageSize;
+      }
+
+      this.$api.user
+        .findBackUserList({
+          deptId: this.deptId,
+          mobile: this.pageData.mobile,
+          name: this.pageData.name,
+          userId: this.pageData.userId,
+          status: this.pageData.status,
+          agentFlag: 0,
+          leaderName: this.pageData.leaderId,
+          roleId: '22',
+          pageNum: this.pageData.pageNum,
+          pageSize: this.pageData.pageSize
+        })
+        .then((res) => {
+          res.data.records.forEach(val => {
+            if (val.sex && val.sex !== '' && val.sex !== null) {
+              val.sex = this.sexoptions.find(ele => ele.value == val.sex).label
             }
-            let dto = {
-                deptId: this.deptId,
-                mobile: this.pageData.mobile,
-                name: this.pageData.name,
-                userId: this.pageData.userId,
-                status: this.pageData.status,
-                agentFlag: 0,
-                leaderName: this.pageData.leaderId,
-                roleId: '22',
+            if (val.status && val.status !== '' && val.status !== null) {
+              val.status = this.user_statusoptions.find(ele => ele.value == val.status).label
             }
-            this.$api.user
-                .findBackUserList({ dto, pageNum: this.pageData.pageNum, pageSize: this.pageData.pageSize })
-                .then((res) => {
-                    res.data.records.forEach(val => {
-                        if (val.sex && val.sex !== '' && val.sex !== null) {
-                            val.sex = this.sexoptions.find(ele => ele.value == val.sex).label
-                        }
-                        if (val.status && val.status !== '' && val.status !== null) {
-                            val.status = this.user_statusoptions.find(ele => ele.value == val.status).label
-                        }
-                        val.roleId = val.roleName
-                    })
-                    this.pageResult = {
-                        content: res.data.records,
-                        pageNum: res.data.current,
-                        pageSize: res.data.size,
-                        totalPages: res.data.pages,
-                        totalSize: res.data.total,
-                    };
-                })
+            val.roleId = val.roleName
+          })
+          this.pageResult = {
+            content: res.data.records,
+            pageNum: res.data.current,
+            pageSize: res.data.size,
+            totalPages: res.data.pages,
+            totalSize: res.data.total,
+          };
+        })
 
-        },
-        
-        async handleTableEdit(params) {
-            this.formData=params.row
-            this.dialogVisible=true
-            this.CarFrontFile={}
-            this.qrCodeImage=''
-            this.$api.role
-                .pictureFind(params.row.userId)
-                .then((res) => {
-                    if (res.code == "200" ) {
-                        if(res.data){
-                            this.qrCodeImage=process.env.BASE_URL  +res.data.wechatPictureUrl
-                            res.data.url=res.data.wechatPictureUrl
-                            this.CarFrontFile=res.data
-                        }
-                    }
-                    else{
-                        this.$message.error(res.msg)
-                    }
-                })
-        },
+    },
 
-        getDictItems(typeName) {
-            //--数据字典--
-            this.$api.dict
-                .findByLableName(typeName)
-                .then((response) => {
-                    this[typeName + "options"] = response.data; // 把获取到的数据赋给this.data
-                })
-                .catch((error) => {
-                    this[typeName + "options"] = [];
-                });
-        },
-        closeDialog() {
-            this.deptInfo = {};
-            this.dialogVisible = false;
-        },
-        // 提交
-        submitForm() {
-            let data={
-                wechatpicture:this.CarFrontFile.id,
-                wechatPictureUrl:this.CarFrontFile.url,
-                userId:this.formData.userId,
-                userName:this.formData.name,
+    async handleTableEdit(params) {
+      this.formData = params.row
+      this.dialogVisible = true
+      this.CarFrontFile = {}
+      this.qrCodeImage = ''
+      this.$api.role
+        .pictureFind(params.row.userId)
+        .then((res) => {
+          if (res.code == "200") {
+            if (res.data) {
+              this.qrCodeImage = process.env.BASE_URL + res.data.wechatPictureUrl
+              res.data.url = res.data.wechatPictureUrl
+              this.CarFrontFile = res.data
             }
-            this.$api.role
-                .pictureSave(data)
-                .then((res) => {
-                    if (res.code == "200") {
-                        this.$message({
-                            message: res.msg ||'操作成功',
-                            type: 'success'
-                            });
-                        this.dialogVisible=false
-                    }
-                    else{
-                    this.$message.error(res.msg)
-                    }
-                })
-               
-        },
+          } else {
+            this.$message.error(res.msg)
+          }
+        })
     },
+
+    getDictItems(typeName) {
+      //--数据字典--
+      this.$api.dict
+        .findByLableName(typeName)
+        .then((response) => {
+          this[typeName + "options"] = response.data; // 把获取到的数据赋给this.data
+        })
+        .catch((error) => {
+          this[typeName + "options"] = [];
+        });
+    },
+    closeDialog() {
+      this.deptInfo = {};
+      this.dialogVisible = false;
+    },
+    // 提交
+    submitForm() {
+      let data = {
+        wechatpicture: this.CarFrontFile.id,
+        wechatPictureUrl: this.CarFrontFile.url,
+        userId: this.formData.userId,
+        userName: this.formData.name,
+      }
+      this.$api.role
+        .pictureSave(data)
+        .then((res) => {
+          if (res.code == "200") {
+            this.$message({
+              message: res.msg || '操作成功',
+              type: 'success'
+            });
+            this.dialogVisible = false
+          } else {
+            this.$message.error(res.msg)
+          }
+        })
+
+    },
+  },
 };
 </script>
-  
+
 <style scoped>
 .avatar {
   border: 1px dashed #d9d9d9;
@@ -326,4 +327,3 @@ export default {
   display: block;
 }
 </style>
-