no message

package.json

@@ -44,21 +44,22 @@
     "axios": "0.18.1",
     "clipboard": "2.0.4",
     "core-js": "3.6.5",
+    "crypto-js": "^4.0.0",
     "echarts": "4.2.1",
     "element-ui": "2.13.2",
     "file-saver": "2.0.1",
-    "js-beautify": "1.10.2",
     "fuse.js": "3.4.4",
+    "js-beautify": "1.10.2",
     "js-cookie": "2.2.0",
     "jsencrypt": "3.0.0-rc.1",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
+    "quill": "1.3.7",
     "screenfull": "4.2.0",
     "sortablejs": "1.8.4",
     "vue": "2.6.10",
     "vue-count-to": "1.0.13",
-    "quill": "1.3.7",
     "vue-cropper": "0.4.9",
     "vue-router": "3.0.2",
     "vue-splitpane": "1.0.4",

src/api/CONST.js

@@ -0,0 +1,250 @@
+/*性别*/
+export const sexList = [
+  {
+    "name":"男",
+    "id":0
+  },
+  {
+    "name":"女",
+    "id":1
+  }
+]
+
+/*贫困类型*/
+export const peopleType = [
+  {
+    "id":'1',
+    "name":'一般'
+  },
+  {
+    "id":'2',
+    "name":'低保户'
+  }
+]
+/*56个名族*/
+export const nation = [
+  {
+    "id": "01",
+    "name": "汉族"
+  },
+  {
+    "id": "02",
+    "name": "蒙古族"
+  },
+  {
+    "id": "03",
+    "name": "回族"
+  },
+  {
+    "id": "04",
+    "name": "藏族"
+  },
+  {
+    "id": "05",
+    "name": "维吾尔族"
+  },
+  {
+    "id": "06",
+    "name": "苗族"
+  },
+  {
+    "id": "07",
+    "name": "彝族"
+  },
+  {
+    "id": "08",
+    "name": "壮族"
+  },
+  {
+    "id": "09",
+    "name": "布依族"
+  },
+  {
+    "id": "10",
+    "name": "朝鲜族"
+  },
+  {
+    "id": "11",
+    "name": "满族"
+  },
+  {
+    "id": "12",
+    "name": "侗族"
+  },
+  {
+    "id": "13",
+    "name": "瑶族"
+  },
+  {
+    "id": "14",
+    "name": "白族"
+  },
+  {
+    "id": "15",
+    "name": "土家族"
+  },
+  {
+    "id": "16",
+    "name": "哈尼族"
+  },
+  {
+    "id": "17",
+    "name": "哈萨克族"
+  },
+  {
+    "id": "18",
+    "name": "傣族"
+  },
+  {
+    "id": "19",
+    "name": "黎族"
+  },
+  {
+    "id": "20",
+    "name": "傈僳族"
+  },
+  {
+    "id": "21",
+    "name": "佤族"
+  },
+  {
+    "id": "22",
+    "name": "畲族"
+  },
+  {
+    "id": "23",
+    "name": "高山族"
+  },
+  {
+    "id": "24",
+    "name": "拉祜族"
+  },
+  {
+    "id": "25",
+    "name": "水族"
+  },
+  {
+    "id": "26",
+    "name": "东乡族"
+  },
+  {
+    "id": "27",
+    "name": "纳西族"
+  },
+  {
+    "id": "28",
+    "name": "景颇族"
+  },
+  {
+    "id": "29",
+    "name": "柯尔克孜族"
+  },
+  {
+    "id": "30",
+    "name": "土族"
+  },
+  {
+    "id": "31",
+    "name": "达斡尔族"
+  },
+  {
+    "id": "32",
+    "name": "仫佬族"
+  },
+  {
+    "id": "33",
+    "name": "羌族"
+  },
+  {
+    "id": "34",
+    "name": "布朗族"
+  },
+  {
+    "id": "35",
+    "name": "撒拉族"
+  },
+  {
+    "id": "36",
+    "name": "毛难族"
+  },
+  {
+    "id": "37",
+    "name": "仡佬族"
+  },
+  {
+    "id": "38",
+    "name": "锡伯族"
+  },
+  {
+    "id": "39",
+    "name": "阿昌族"
+  },
+  {
+    "id": "40",
+    "name": "普米族"
+  },
+  {
+    "id": "41",
+    "name": "塔吉克族"
+  },
+  {
+    "id": "42",
+    "name": "怒族"
+  },
+  {
+    "id": "43",
+    "name": "乌孜别克族"
+  },
+  {
+    "id": "44",
+    "name": "俄罗斯族"
+  },
+  {
+    "id": "45",
+    "name": "鄂温克族"
+  },
+  {
+    "id": "46",
+    "name": "崩龙族"
+  },
+  {
+    "id": "47",
+    "name": "保安族"
+  },
+  {
+    "id": "48",
+    "name": "裕固族"
+  },
+  {
+    "id": "49",
+    "name": "京族"
+  },
+  {
+    "id": "50",
+    "name": "塔塔尔族"
+  },
+  {
+    "id": "51",
+    "name": "独龙族"
+  },
+  {
+    "id": "52",
+    "name": "鄂伦春族"
+  },
+  {
+    "id": "53",
+    "name": "赫哲族"
+  },
+  {
+    "id": "54",
+    "name": "门巴族"
+  },
+  {
+    "id": "55",
+    "name": "珞巴族"
+  },
+  {
+    "id": "56",
+    "name": "基诺族"
+  }
+]

src/api/baseManage/productType.js

@@ -1,10 +1,38 @@
 import request from '@/utils/request'
 
 // 查询参数列表
-export function listProductType(query) {
+export function listProductType(data) {
   return request({
     url: '/system/web/productType/searchByPage',
     method: 'post',
-    params: query
+    data: data
   })
-}
+}
+
+//类型新增
+export function addProductType(data) {
+  return request({
+    url: '/system/web/productType/save',
+    method: 'post',
+    data: data
+  })
+}
+
+//类型更新
+export function updateProductType(data) {
+  return request({
+    url: '/system/web/productType/update',
+    method: 'post',
+    data: data
+  })
+}
+
+//类型删除
+export function delProductType(data) {
+  return request({
+    url: '/system/web/productType/delete',
+    method: 'post',
+    data: data
+  })
+}
+

src/api/belongToSubject/area.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+// 查询区域列表
+export function listArea(data) {
+  return request({
+    url: '/system/web/area/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//查询区域树
+export function areaTree(data) {
+  return request({
+    url: '/system/web/position/findByCodeAndLevel',
+    method: 'post',
+    data: data
+  })
+}
+
+//保存区域
+export function saveArea(data) {
+  return request({
+    url: '/system/web/area/save',
+    method: 'post',
+    data: data
+  })
+}
+
+//更新区域
+export function updateArea(data) {
+  return request({
+    url: '/system/web/area/update',
+    method: 'post',
+    data: data
+  })
+}

src/api/belongToSubject/org.js

@@ -0,0 +1,64 @@
+import request from '@/utils/request'
+
+// 获取区域地址
+export function getTree(data) {
+  return request({
+    url: '/system/web/position/findChongqingArea',
+    method: 'post',
+    data: data
+  })
+}
+
+//归属人管理列表
+export function listOrg(data) {
+  return request({
+    url: '/system/web/collectiveFarmer/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//归属人删除
+export function delCollectiveFarmer(data) {
+  return request({
+    url: '/system/web/collectiveFarmer/delete',
+    method: 'post',
+    data: data
+  })
+}
+
+//查询归属区域
+export function listArea(datas) {
+  return request({
+    url: '/system/web/area/searchByPage',
+    method: 'post',
+    data: datas
+  })
+}
+
+//查询归属贫困成员
+export function listPeople(datas) {
+  return request({
+    url: '/system/web/farmer/searchByPage',
+    method: 'post',
+    data: datas
+  })
+}
+
+//归属人保存
+export function saverCollectiveFarmer(datas) {
+  return request({
+    url: '/system/web/collectiveFarmer/save',
+    method: 'post',
+    data: datas
+  })
+}
+
+//归属人跟新
+export function updateCollectiveFarmer(datas) {
+  return request({
+    url: '/system/web/collectiveFarmer/update',
+    method: 'post',
+    data: datas
+  })
+}

src/api/belongToSubject/people.js

@@ -0,0 +1,55 @@
+import request from '@/utils/request'
+
+// 获取区域地址
+export function getTree(data) {
+  return request({
+    url: '/system/web/position/findChongqingArea',
+    method: 'post',
+    data: data
+  })
+}
+
+//归属人管理列表
+export function listPeople(data) {
+  return request({
+    url: '/system/web/farmer/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//归属人删除
+export function delPerson(data) {
+  return request({
+    url: '/system/web/farmer/delete',
+    method: 'post',
+    data: data
+  })
+}
+
+//查询归属区域
+export function listArea(datas) {
+  return request({
+    url: '/system/web/area/searchByPage',
+    method: 'post',
+    data: datas
+  })
+}
+
+//归属人保存
+export function saverAreaPeople(datas) {
+  return request({
+    url: '/system/web/farmer/save',
+    method: 'post',
+    data: datas
+  })
+}
+
+//归属人跟新
+export function updateAreaPeople(datas) {
+  return request({
+    url: '/system/web/farmer/update',
+    method: 'post',
+    data: datas
+  })
+}

src/api/login.js

@@ -5,11 +5,11 @@ const client_secret = '123456'
 const scope = 'server'
 
 // 登录方法
-export function login(username, password, code, uuid) {
+export function login(username, password, captchaVerification) {
   return request({
     url: '/system/user/login',
     method: 'post',
-    data: { username, password, code, uuid }
+    data: { username, password, captchaVerification}
   })
 }
 

src/api/productManage/commodity.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+//获取产品类型
+export function listProductType(data) {
+  return request({
+    url: '/system/web/productType/all',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询产品列表
+export function listProduct(data) {
+  return request({
+    url: '/system/web/goods/searchJoinListByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//产品删除
+export function delProduct(data) {
+  return request({
+    url: '/system/web/goods/delete',
+    method: 'post',
+    data: data
+  })
+}
+
+//商品上下架
+export function productAc(data) {
+  return request({
+    url: '/system/web/goods/shelves',
+    method: 'post',
+    data: data
+  })
+}

src/api/productManage/productInfo.js

@@ -0,0 +1,94 @@
+import request from '@/utils/request'
+
+// 查询类型列表
+export function listType(data) {
+  return request({
+    url: '/system/web/productType/all',
+    method: 'post',
+    data: data
+  })
+}
+
+// 查询产品列表
+export function listProduct(data) {
+  return request({
+    url: '/system/web/product/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//获取产品类型
+export function listProductType(data) {
+  return request({
+    url: '/system/web/productType/all',
+    method: 'post',
+    data: data
+  })
+}
+
+//获取产品附属信息
+export function listProductAuxiliary(data) {
+  return request({
+    url: '/system/web/productType/expansions',
+    method: 'post',
+    params: data
+  })
+}
+
+//关联贫困集体查询
+export function listCollectiveFarmer(data) {
+  return request({
+    url: '/system/web/collectiveFarmer/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//关联单个贫困户
+export function listFarmer(data) {
+  return request({
+    url: '/system/web/farmer/searchByPage',
+    method: 'post',
+    data: data
+  })
+}
+
+//类别保存
+export function saveProductType(data) {
+  return request({
+    url: '/system/web/product/save',
+    method: 'post',
+    data: data
+  })
+}
+
+//产品生成
+export function createProduct(data) {
+  return request({
+    url: '/system/web/product/publish',
+    method: 'post',
+    data: data
+  })
+}
+
+//产品修改
+export function updateProduct(data) {
+  return request({
+    url: '/system/web/product/update',
+    method: 'post',
+    data: data
+  })
+}
+
+//商品详情
+export function detailProduct(query) {
+  return request({
+    url: 'system/web/product/findByProductInfoGuid',
+    method: 'get',
+    params: query
+  })
+}
+
+
+

src/components/verifition/Verify/VerifyPoints.vue

@@ -0,0 +1,245 @@
+<template>
+    <div style="position: relative"
+        >
+        <div class="verify-img-out">
+            <div class="verify-img-panel" :style="{'width': setSize.imgWidth,
+                                                   'height': setSize.imgHeight,
+                                                   'background-size' : setSize.imgWidth + ' '+ setSize.imgHeight,
+                                                   'margin-bottom': vSpace + 'px'}"
+                                                    >
+                <div class="verify-refresh" style="z-index:3" @click="refresh" v-show="showRefresh">
+                    <i class="iconfont icon-refresh"></i>
+                </div>
+                <img :src="'data:image/png;base64,'+pointBackImgBase" 
+                ref="canvas"
+                alt=""  style="width:100%;height:100%;display:block"
+                @click="bindingClick?canvasClick($event):undefined">
+
+                <div v-for="(tempPoint, index) in tempPoints" :key="index" class="point-area"
+                     :style="{
+                        'background-color':'#1abd6c',
+                        color:'#fff',
+                        'z-index':9999,
+                        width:'20px',
+                        height:'20px',
+                        'text-align':'center',
+                        'line-height':'20px',
+                        'border-radius': '50%',
+                        position:'absolute',
+                        top:parseInt(tempPoint.y-10) + 'px',
+                        left:parseInt(tempPoint.x-10) + 'px'
+                     }">
+                    {{index + 1}}
+                </div>
+            </div>
+        </div>
+        <!-- 'height': this.barSize.height, -->
+        <div class="verify-bar-area"
+             :style="{'width': setSize.imgWidth,
+                      'color': this.barAreaColor,
+                      'border-color': this.barAreaBorderColor,
+                      'line-height':this.barSize.height}">
+            <span class="verify-msg">{{text}}</span>
+        </div>
+    </div>
+</template>
+<script type="text/babel">
+    /**
+     * VerifyPoints
+     * @description 点选
+     * */
+    import {resetSize, _code_chars, _code_color1, _code_color2} from './../utils/util'
+    import {aesEncrypt} from "./../utils/ase"
+    import {reqGet,reqCheck}  from "./../api/index"
+
+    export default {
+        name: 'VerifyPoints',
+        props: {
+            //弹出式pop，固定fixed
+            mode: {
+                type: String,
+                default: 'fixed'
+            },
+            captchaType:{
+                type:String,
+            },
+            //间隔
+            vSpace: {
+                type: Number,
+                default: 5
+            },
+            imgSize: {
+                type: Object,
+                default() {
+                    return {
+                        width: '310px',
+                        height: '155px'
+                    }
+                }
+            },
+            barSize: {
+                type: Object,
+                default() {
+                    return {
+                        width: '310px',
+                        height: '40px'
+                    }
+                }
+            }
+        },
+        data() {
+            return {
+                secretKey:'',           //后端返回的ase加密秘钥
+                checkNum:3,             //默认需要点击的字数
+                fontPos: [],            //选中的坐标信息
+                checkPosArr: [],        //用户点击的坐标
+                num: 1,                 //点击的记数
+                pointBackImgBase:'',    //后端获取到的背景图片
+                poinTextList:[],        //后端返回的点击字体顺序
+                backToken:'',           //后端返回的token值
+                setSize: {
+                    imgHeight: 0,
+                    imgWidth: 0,
+                    barHeight: 0,
+                    barWidth: 0
+                },
+                tempPoints: [],
+                text: '',
+                barAreaColor: undefined,
+                barAreaBorderColor: undefined,
+                showRefresh: true,
+                bindingClick: true
+            }
+        },
+        computed: {
+            resetSize() {
+                return resetSize
+            }
+        },
+        methods: {
+            init() {
+                //加载页面
+                this.fontPos.splice(0, this.fontPos.length)
+                this.checkPosArr.splice(0, this.checkPosArr.length)
+                this.num = 1
+                this.getPictrue();
+                this.$nextTick(() => {
+                    this.setSize = this.resetSize(this)	//重新设置宽度高度
+                    this.$parent.$emit('ready', this)
+                })
+            },
+            canvasClick(e) {
+                this.checkPosArr.push(this.getMousePos(this.$refs.canvas, e));
+                if (this.num == this.checkNum) {
+                    this.num = this.createPoint(this.getMousePos(this.$refs.canvas, e));
+                    //按比例转换坐标值
+                    this.checkPosArr = this.pointTransfrom(this.checkPosArr,this.setSize);
+                    //等创建坐标执行完
+                    setTimeout(() => {
+                        // var flag = this.comparePos(this.fontPos, this.checkPosArr);
+                        //发送后端请求
+                        var captchaVerification = this.secretKey? aesEncrypt(this.backToken+'---'+JSON.stringify(this.checkPosArr),this.secretKey):this.backToken+'---'+JSON.stringify(this.checkPosArr)
+                        let data = {
+                            captchaType:this.captchaType,
+                            "pointJson":this.secretKey? aesEncrypt(JSON.stringify(this.checkPosArr),this.secretKey):JSON.stringify(this.checkPosArr),
+                            "token":this.backToken
+                        }
+                        reqCheck(data).then(res=>{
+                            if (res.repCode == "0000") {
+                                this.barAreaColor = '#4cae4c'
+                                this.barAreaBorderColor = '#5cb85c'
+                                this.text = '验证成功'
+                                this.bindingClick = false
+                                if (this.mode=='pop') {
+                                    setTimeout(()=>{
+                                        this.$parent.clickShow = false;
+                                        this.refresh();
+                                    },1500)
+                                }
+                                this.$parent.$emit('success', {captchaVerification})
+                            }else{
+                                this.$parent.$emit('error', this)
+                                this.barAreaColor = '#d9534f'
+                                this.barAreaBorderColor = '#d9534f'
+                                this.text = '验证失败'
+                                setTimeout(() => {
+                                    this.refresh();
+                                }, 700);
+                            }
+                        })
+                    }, 400);
+                }
+                if (this.num < this.checkNum) {
+                    this.num = this.createPoint(this.getMousePos(this.$refs.canvas, e));
+                }
+            },
+        
+            //获取坐标
+            getMousePos: function (obj, e) {
+                var x = e.offsetX 
+                var y = e.offsetY 
+                return {x, y}
+            },
+            //创建坐标点
+            createPoint: function (pos) {
+                this.tempPoints.push(Object.assign({}, pos))
+                return ++this.num;
+            },
+            refresh: function () {
+                this.tempPoints.splice(0, this.tempPoints.length)
+                this.barAreaColor = '#000'
+                this.barAreaBorderColor = '#ddd'
+                this.bindingClick = true
+                this.fontPos.splice(0, this.fontPos.length)
+                this.checkPosArr.splice(0, this.checkPosArr.length)
+                this.num = 1
+                this.getPictrue();
+                this.text = '验证失败'
+                this.showRefresh = true
+            },
+
+            // 请求背景图片和验证图片
+            getPictrue(){
+                let data = {
+                    captchaType:this.captchaType
+                }
+                reqGet(data).then(res=>{
+                    if (res.repCode == "0000") {
+                        this.pointBackImgBase = res.repData.originalImageBase64
+                        this.backToken = res.repData.token
+                        this.secretKey = res.repData.secretKey
+                        this.poinTextList = res.repData.wordList
+                        this.text = '请依次点击【' + this.poinTextList.join(",") + '】'
+                    }else{
+                        this.text = res.repMsg;
+                    }
+                })
+            },
+            //坐标转换函数
+            pointTransfrom(pointArr,imgSize){
+                var newPointArr = pointArr.map(p=>{
+                    let x = Math.round(310 * p.x/parseInt(imgSize.imgWidth)) 
+                    let y =Math.round(155 * p.y/parseInt(imgSize.imgHeight)) 
+                    return {x,y}
+                })
+                // console.log(newPointArr,"newPointArr");
+                return newPointArr
+            }
+        },
+        watch: {
+            // type变化则全面刷新
+            type: {
+                immediate: true,
+                handler() {
+                    this.init()
+                }
+            }
+        },
+        mounted() {
+            // 禁止拖拽
+            this.$el.onselectstart = function () {
+                return false
+            }
+        },
+    }
+</script>

src/components/verifition/Verify/VerifySlide.vue

@@ -0,0 +1,347 @@
+<template>
+    <div style="position: relative;">
+        <div v-if="type === '2'" class="verify-img-out"
+             :style="{height: (parseInt(setSize.imgHeight) + vSpace) + 'px'}"
+            >
+            <div class="verify-img-panel" :style="{width: setSize.imgWidth,
+                                                   height: setSize.imgHeight,}">
+                <img :src="'data:image/png;base64,'+backImgBase" alt="" style="width:100%;height:100%;display:block">
+                <div class="verify-refresh" @click="refresh" v-show="showRefresh"><i class="iconfont icon-refresh"></i>
+                </div>
+                <transition name="tips">
+                    <span class="verify-tips" v-if="tipWords" :class="passFlag ?'suc-bg':'err-bg'">{{tipWords}}</span>
+                </transition>
+            </div>
+        </div>
+        <!-- 公共部分 -->
+        <div class="verify-bar-area" :style="{width: setSize.imgWidth,
+                                              height: barSize.height,
+                                              'line-height':barSize.height}">
+            <span class="verify-msg" v-text="text"></span>
+            <div class="verify-left-bar"
+                 :style="{width: (leftBarWidth!==undefined)?leftBarWidth: barSize.height, height: barSize.height, 'border-color': leftBarBorderColor, transaction: transitionWidth}">
+                <span class="verify-msg" v-text="finishText"></span>
+                <div class="verify-move-block"
+                     @touchstart="start"
+                     @mousedown="start"
+                     :style="{width: barSize.height, height: barSize.height, 'background-color': moveBlockBackgroundColor, left: moveBlockLeft, transition: transitionLeft}">
+                    <i :class="['verify-icon iconfont', iconClass]"
+                       :style="{color: iconColor}"></i>
+                    <div v-if="type === '2'" class="verify-sub-block"
+                        :style="{'width':Math.floor(parseInt(setSize.imgWidth)*47/310)+ 'px',
+                                  'height': setSize.imgHeight,
+                                  'top':'-' + (parseInt(setSize.imgHeight) + vSpace) + 'px',
+                                  'background-size': setSize.imgWidth + ' ' + setSize.imgHeight,
+                                  }">
+                        <img :src="'data:image/png;base64,'+blockBackImgBase" alt=""  style="width:100%;height:100%;display:block">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script type="text/babel">
+    /**
+     * VerifySlide
+     * @description 滑块
+     * */
+    import {aesEncrypt} from "./../utils/ase"
+    import {resetSize} from './../utils/util'
+    import {reqGet,reqCheck}  from "./../api/index"
+
+    //  "captchaType":"blockPuzzle",
+    export default {
+        name: 'VerifySlide',
+        props: {
+            captchaType:{
+                type:String,
+            },
+            type: {
+                type: String,
+                default: '1'
+            },
+            //弹出式pop，固定fixed
+            mode: {
+                type: String,
+                default: 'fixed'
+            },
+            vSpace: {
+                type: Number,
+                default: 5
+            },
+            explain: {
+                type: String,
+                default: '向右滑动完成验证'
+            },
+            imgSize: {
+                type: Object,
+                default() {
+                    return {
+                        width: '310px',
+                        height: '155px'
+                    }
+                }
+            },
+            blockSize: {
+                type: Object,
+                default() {
+                    return {
+                        width: '50px',
+                        height: '50px'
+                    }
+                }
+            },
+            barSize: {
+                type: Object,
+                default() {
+                    return {
+                        width: '310px',
+                        height: '40px'
+                    }
+                }
+            }
+        },
+        data() {
+            return {
+                secretKey:'',        //后端返回的加密秘钥 字段
+                passFlag:'',         //是否通过的标识
+                backImgBase:'',      //验证码背景图片
+                blockBackImgBase:'', //验证滑块的背景图片
+                backToken:"",        //后端返回的唯一token值
+                startMoveTime:"",    //移动开始的时间
+                endMovetime:'',      //移动结束的时间
+                tipsBackColor:'',    //提示词的背景颜色
+                tipWords:'',
+                text: '',
+                finishText:'',
+                setSize: {
+                    imgHeight: 0,
+                    imgWidth: 0,
+                    barHeight: 0,
+                    barWidth: 0
+                },
+                top: 0,
+                left: 0,
+                moveBlockLeft: undefined,
+                leftBarWidth: undefined,
+                // 移动中样式
+                moveBlockBackgroundColor: undefined,
+                leftBarBorderColor: '#ddd',
+                iconColor: undefined,
+                iconClass: 'icon-right',
+                status: false,	    //鼠标状态
+                isEnd: false,		//是够验证完成
+                showRefresh: true,
+                transitionLeft: '',
+                transitionWidth: ''
+            }
+        },
+        computed: {
+            barArea() {
+                return this.$el.querySelector('.verify-bar-area')
+            },
+            resetSize() {
+                return resetSize
+            }
+        },
+        methods: {
+            init() {
+                this.text = this.explain
+                this.getPictrue();
+                this.$nextTick(() => {
+                    let setSize = this.resetSize(this)	//重新设置宽度高度
+                    for (let key in setSize) {
+                        this.$set(this.setSize, key, setSize[key])
+                    }
+                    this.$parent.$emit('ready', this)
+                })
+
+                var _this = this
+
+                window.removeEventListener("touchmove", function (e) {
+                    _this.move(e);
+                });
+                window.removeEventListener("mousemove", function (e) {
+                    _this.move(e);
+                });
+
+                //鼠标松开
+                window.removeEventListener("touchend", function () {
+                    _this.end();
+                });
+                window.removeEventListener("mouseup", function () {
+                    _this.end();
+                });
+
+                window.addEventListener("touchmove", function (e) {
+                    _this.move(e);
+                });
+                window.addEventListener("mousemove", function (e) {
+                    _this.move(e);
+                });
+
+                //鼠标松开
+                window.addEventListener("touchend", function () {
+                    _this.end();
+                });
+                window.addEventListener("mouseup", function () {
+                    _this.end();
+                });
+            },
+
+            //鼠标按下
+            start: function (e) {
+                e = e || window.event
+                if (!e.touches) {  //兼容PC端 
+                    var x = e.clientX;
+                } else {           //兼容移动端
+                    var x = e.touches[0].pageX;
+                }
+                this.startLeft =Math.floor(x - this.barArea.getBoundingClientRect().left);
+                this.startMoveTime = +new Date();    //开始滑动的时间
+                if (this.isEnd == false) {
+                    this.text = ''
+                    this.moveBlockBackgroundColor = '#337ab7'
+                    this.leftBarBorderColor = '#337AB7'
+                    this.iconColor = '#fff'
+                    e.stopPropagation();
+                    this.status = true;
+                }
+            },
+            //鼠标移动
+            move: function (e) {
+                e = e || window.event
+                if (this.status && this.isEnd == false) {
+                    if (!e.touches) {  //兼容PC端 
+                        var x = e.clientX;
+                    } else {           //兼容移动端
+                        var x = e.touches[0].pageX;
+                    }
+                    var bar_area_left = this.barArea.getBoundingClientRect().left;
+                    var move_block_left = x - bar_area_left //小方块相对于父元素的left值
+                    if (move_block_left >= this.barArea.offsetWidth - parseInt(parseInt(this.blockSize.width) / 2) - 2) {
+                        move_block_left = this.barArea.offsetWidth - parseInt(parseInt(this.blockSize.width) / 2) - 2;
+                    }
+                    if (move_block_left <= 0) {
+                        move_block_left = parseInt(parseInt(this.blockSize.width) / 2);
+                    }
+                    //拖动后小方块的left值
+                    this.moveBlockLeft = (move_block_left - this.startLeft) + "px"
+                    this.leftBarWidth = (move_block_left - this.startLeft) + "px"
+                }
+            },
+
+            //鼠标松开
+            end: function () {
+                this.endMovetime = +new Date(); 
+                var _this = this;
+                //判断是否重合
+                if (this.status && this.isEnd == false) {
+                    var moveLeftDistance = parseInt((this.moveBlockLeft || '').replace('px', ''));
+                    moveLeftDistance = moveLeftDistance * 310/ parseInt(this.setSize.imgWidth)
+                    let data = {
+                        captchaType:this.captchaType,
+                        "pointJson":this.secretKey ? aesEncrypt(JSON.stringify({x:moveLeftDistance,y:5.0}),this.secretKey):JSON.stringify({x:moveLeftDistance,y:5.0}),
+                        "token":this.backToken
+                    }
+                    reqCheck(data).then(res=>{
+                        if (res.repCode == "0000") {
+                            this.moveBlockBackgroundColor = '#5cb85c'
+                            this.leftBarBorderColor = '#5cb85c'
+                            this.iconColor = '#fff'
+                            this.iconClass = 'icon-check'
+                            this.showRefresh = false
+                            this.isEnd = true;   
+                            if (this.mode=='pop') {
+                                setTimeout(()=>{
+                                    this.$parent.clickShow = false;
+                                    this.refresh();
+                                },1500)
+                            }
+                            this.passFlag = true
+                            this.tipWords = `${((this.endMovetime-this.startMoveTime)/1000).toFixed(2)}s验证成功`
+                            var captchaVerification = this.secretKey ? aesEncrypt(this.backToken+'---'+JSON.stringify({x:moveLeftDistance,y:5.0}),this.secretKey):this.backToken+'---'+JSON.stringify({x:moveLeftDistance,y:5.0})
+                            setTimeout(()=>{
+                                this.tipWords = ""
+                                this.$parent.closeBox();
+                                this.$parent.$emit('success', {captchaVerification})
+                            },1000)
+                        }else{
+                            this.moveBlockBackgroundColor = '#d9534f'
+                            this.leftBarBorderColor = '#d9534f'
+                            this.iconColor = '#fff'
+                            this.iconClass = 'icon-close'
+                            this.passFlag = false
+                            setTimeout(function () {
+                                _this.refresh();
+                            }, 1000);
+                            this.$parent.$emit('error',this)
+                            this.tipWords = "验证失败"
+                            setTimeout(()=>{
+                                    this.tipWords = ""
+                            },1000)
+                        }
+                    })
+                    this.status = false;
+                }
+            },
+
+            refresh: function () {
+                this.showRefresh = true
+                this.finishText = ''
+
+                this.transitionLeft = 'left .3s'
+                this.moveBlockLeft = 0
+
+                this.leftBarWidth = undefined
+                this.transitionWidth = 'width .3s'
+
+                this.leftBarBorderColor = '#ddd'
+                this.moveBlockBackgroundColor = '#fff'
+                this.iconColor = '#000'
+                this.iconClass = 'icon-right'
+                this.isEnd = false
+
+                this.getPictrue()
+                setTimeout(() => {
+                    this.transitionWidth = ''
+                    this.transitionLeft = ''
+                    this.text = this.explain
+                }, 300)
+            },
+
+            // 请求背景图片和验证图片
+            getPictrue(){
+                let data = {
+                    captchaType:this.captchaType
+                }
+                reqGet(data).then(res=>{
+                    if (res.repCode == "0000") {
+                        this.backImgBase = res.repData.originalImageBase64
+                        this.blockBackImgBase = res.repData.jigsawImageBase64
+                        this.backToken = res.repData.token
+                        this.secretKey = res.repData.secretKey
+                    }else{
+                        this.tipWords = res.repMsg;
+                    }
+                })
+            },
+        },
+        watch: {
+            // type变化则全面刷新
+            type: {
+                immediate: true,
+                handler() {
+                    this.init()
+                }
+            }
+        },
+        mounted() {
+            // 禁止拖拽
+            this.$el.onselectstart = function () {
+                return false
+            }
+        },
+    }
+</script>
+

src/components/verifition/api/index.js

@@ -0,0 +1,25 @@
+/**
+ * 此处可直接引用自己项目封装好的 axios 配合后端联调
+ */
+
+
+// import request from "./../utils/axios"  //组件内部封装的axios
+import request from '@/utils/request'
+
+//获取验证图片  以及token
+export function reqGet(data) {
+	return  request({
+        url: '/system/captcha/get',
+        method: 'post',
+        data
+    })
+}
+
+//滑动或者点选验证
+export function reqCheck(data) {
+	return  request({
+        url: '/system/captcha/check',
+        method: 'post',
+        data
+    })
+}

src/components/verifition/utils/ase.js

@@ -0,0 +1,11 @@
+import CryptoJS from 'crypto-js'
+/**
+ * @word 要加密的内容
+ * @keyWord String  服务器随机返回的关键字
+ *  */
+export function aesEncrypt(word,keyWord="XwKsGlMcdPMEhR1B"){
+  var key = CryptoJS.enc.Utf8.parse(keyWord);
+  var srcs = CryptoJS.enc.Utf8.parse(word);
+  var encrypted = CryptoJS.AES.encrypt(srcs, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7});
+  return encrypted.toString();
+}

src/components/verifition/utils/axios.js

@@ -0,0 +1,30 @@
+import axios from 'axios';
+
+axios.defaults.baseURL = process.env.BASE_API;
+
+const service = axios.create({
+  timeout: 40000,
+  headers: {
+    'X-Requested-With': 'XMLHttpRequest',
+    'Content-Type': 'application/json; charset=UTF-8'
+  },
+})
+service.interceptors.request.use(
+  config => {
+    return config
+  },
+  error => {
+    Promise.reject(error)
+  }
+)
+
+// response interceptor
+service.interceptors.response.use(
+  response => {
+    const res = response.data;
+    return res
+  },
+  error => {
+  }
+)
+export default service

src/components/verifition/utils/util.js

@@ -0,0 +1,36 @@
+export function resetSize(vm) {
+    var img_width, img_height, bar_width, bar_height;	//图片的宽度、高度，移动条的宽度、高度
+
+    var parentWidth = vm.$el.parentNode.offsetWidth || window.offsetWidth
+    var parentHeight = vm.$el.parentNode.offsetHeight || window.offsetHeight
+
+    if (vm.imgSize.width.indexOf('%') != -1) {
+        img_width = parseInt(this.imgSize.width) / 100 * parentWidth + 'px'
+    } else {
+        img_width = this.imgSize.width;
+    }
+
+    if (vm.imgSize.height.indexOf('%') != -1) {
+        img_height = parseInt(this.imgSize.height) / 100 * parentHeight + 'px'
+    } else {
+        img_height = this.imgSize.height
+    }
+
+    if (vm.barSize.width.indexOf('%') != -1) {
+        bar_width = parseInt(this.barSize.width) / 100 * parentWidth + 'px'
+    } else {
+        bar_width = this.barSize.width
+    }
+
+    if (vm.barSize.height.indexOf('%') != -1) {
+        bar_height = parseInt(this.barSize.height) / 100 * parentHeight + 'px'
+    } else {
+        bar_height = this.barSize.height
+    }
+
+    return {imgWidth: img_width, imgHeight: img_height, barWidth: bar_width, barHeight: bar_height}
+}
+
+export const _code_chars = [1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
+export const _code_color1 = ['#fffff0', '#f0ffff', '#f0fff0', '#fff0f0']
+export const _code_color2 = ['#FF0033', '#006699', '#993366', '#FF9900', '#66CC66', '#FF33CC']

src/main.js

@@ -33,7 +33,8 @@ Vue.prototype.addDateRange = addDateRange
 Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectDictLabels = selectDictLabels
 Vue.prototype.download = download
-Vue.prototype.handleTree = handleTree
+Vue.prototype.handleTree = handleTree
+Vue.prototype.imgRequest = "http://fqn.hongweisoft.com/";
 
 Vue.prototype.msgSuccess = function (msg) {
   this.$message({ showClose: true, message: msg, type: "success" });

src/store/modules/user.js

@@ -35,11 +35,12 @@ const user = {
     // 登录
     Login({ commit }, userInfo) {
       const username = userInfo.username.trim()
-      const password = userInfo.password
-      const code = userInfo.code
-      const uuid = userInfo.uuid
+      const password = userInfo.password
+      const captchaVerification = userInfo.captchaVerification
+      // const code = userInfo.code
+      // const uuid = userInfo.uuid
       return new Promise((resolve, reject) => {
-        login(username, password, code, uuid).then(res => {
+        login(username, password, captchaVerification).then(res => {
           let data = res.data
           setToken(data.access_token)
           commit('SET_TOKEN', data.access_token)

src/views/baseManage/productType/index.vue

@@ -3,7 +3,7 @@
       <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
         <el-form-item prop="phonenumber">
           <el-input
-            v-model="queryParams.povertyAreaName"
+            v-model="queryParams.condition"
             placeholder="请输入类别名称"
             clearable
             size="small"
@@ -11,32 +11,6 @@
             @keyup.enter.native="handleQuery"
           />
         </el-form-item>
-        <!-- <el-form-item prop="status">
-          <el-select
-            v-model="queryParams.status"
-            placeholder="状态"
-            clearable
-            size="small"
-            style="width: 240px"
-          >
-            <el-option
-              v-for="dict in statusOptions"
-              :key="dict.dictValue"
-              :label="dict.dictLabel"
-              :value="dict.dictValue"
-            />
-          </el-select>
-        </el-form-item> -->
-       <!-- <el-form-item>
-          <el-date-picker
-            v-model="queryParams.dateRange"
-            size="small"
-            placeholder="时间"
-            style="width: 240px"
-            value-format="yyyy-MM-dd"
-            type="date"
-          ></el-date-picker>
-        </el-form-item> -->
         <el-form-item>
           <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
           <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -49,7 +23,6 @@
             icon="el-icon-plus"
             size="mini"
             @click="handleAdd"
-            v-hasPermi="['system:user:add']"
           >新增方案</el-button>
         </el-col>
         <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
@@ -57,10 +30,10 @@
       <el-table v-loading="loading" :data="list">
         <el-table-column label="序号" type="index" width="50" align="center" />
         <el-table-column label="产品类别" align="center" prop="typeName" />
-        <el-table-column label="类别说明" align="center" prop="desc" :show-overflow-tooltip="true" />
-        <el-table-column label="修改时间" align="center" prop="time" width="160">
+        <el-table-column label="类别说明" align="center" prop="typeDesc" :show-overflow-tooltip="true" />
+        <el-table-column label="修改时间" align="center" prop="createTime" width="160">
           <template slot-scope="scope">
-            <span>{{ parseTime(scope.row.time) }}</span>
+            <span>{{ parseTime(scope.row.modifiedTime) }}</span>
           </template>
         </el-table-column>
         <el-table-column
@@ -74,15 +47,18 @@
               size="mini"
               type="primary"
               icon="el-icon-view"
+              @click="handleView(scope.row)"
             >查看</el-button>
             <el-button
               size="mini"
               type="success"
               icon="el-icon-edit"
+              @click="handleEdit(scope.row)"
             >编辑</el-button>
             <el-button
               size="mini"
               type="danger"
+              @click="handleDelete(scope.row)"
               icon="el-icon-delete"
             >删除</el-button>
           </template>
@@ -91,11 +67,10 @@
       <pagination
         v-show="total>0"
         :total="total"
-        :page.sync="queryParams.pageNum"
+        :page.sync="queryParams.pageNo"
         :limit.sync="queryParams.pageSize"
         @pagination="getList"
       />
-
       <add-mobiel
       			v-if="modal.visibleModal"
       			:title="modal.title"
@@ -108,7 +83,7 @@
 </template>
 56757
 <script>
-import { listProductType } from "@/api/baseManage/productType";
+import { listProductType , delProductType } from "@/api/baseManage/productType";
 import addMobiel from './modal/addMobiel'
 export default {
   name: "productType",
@@ -118,7 +93,7 @@ export default {
   data() {
     return {
       // 遮罩层
-      loading: true,
+      loading: false,
       // 显示搜索条件
       showSearch: true,
       // 总条数
@@ -138,107 +113,70 @@ export default {
       },
       // 查询参数
       queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        userName: undefined,
-        phonenumber: undefined,
-        status: undefined,
-        deptId: undefined
+        pageNo: 1,
+        pageSize: 10
       }
     };
   },
   created() {
-    // this.getDicts("sys_normal_disable").then(response => {
-    //   this.statusOptions = response.data;
-    // });
     this.getList();
   },
   methods: {
     /** 查询产婆类别列表 */
     getList() {
-      this.loading = false;
-      this.list = [
-        {
-          id:"1",
-          typeName:'test1',
-          desc:'说明说明',
-          time:'2015.10.11',
-        },
-        {
-          id:"2",
-          typeName:'test1',
-          desc:'说明说明',
-          time:'2015.10.11',
-        },
-        {
-          id:"3",
-          typeName:'test1',
-          desc:'说明说明',
-          time:'2015.10.11',
-        },
-        {
-          id:"3",
-          typeName:'test1',
-          desc:'说明说明',
-          time:'2015.10.11',
+      this.loading = true;
+      listProductType(this.queryParams).then(res => {
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody
+            this.total = res.retHead.total;
+          }
+          this.loading = false;
         }
-      ]
-      // listProductType(this.queryParams).then(response => {
-      //     this.userList = response.rows;
-      //     this.total = response.total;
-      //     this.loading = false;
-      //   }
-      // );
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        userId: undefined,
-        deptId: undefined,
-        userName: undefined,
-        nickName: undefined,
-        password: undefined,
-        phonenumber: undefined,
-        email: undefined,
-        sex: undefined,
-        status: "0",
-        remark: undefined,
-        postIds: [],
-        roleIds: []
-      };
-      this.resetForm("form");
+      );
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.queryParams.page = 1;
+      this.queryParams.pageNo = 1;
       this.getList();
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.dateRange = [];
       this.resetForm("queryForm");
       this.handleQuery();
     },
     /** 新增按钮操作 */
     handleAdd() {
         this.modal.visibleModal = true
-        this.modal.title = '新建方案'
+        this.modal.title = '新增产品类别'
         this.modal.action = 'add'
     },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.visibleModal = true
+        this.modal.title = '产品类别详情'
+        this.modal.action = 'view'
+        this.modal.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.visibleModal = true
+        this.modal.title = '编辑产品类别'
+        this.modal.action = 'edit'
+        this.modal.selectRow = item
+    },
     /** 删除按钮操作 */
-    handleDelete(row) {
-      const userIds = row.userId || this.ids;
-      this.$confirm('是否确认删除用户编号为"' + userIds + '"的数据项?', "警告", {
+    handleDelete(item) {
+      console.log(item)
+      let params = {
+        guid:item.guid,
+        typeVal:item.typeVal
+      }
+      this.$confirm('是否确认删除该数据项?', "警告", {
           confirmButtonText: "确定",
           cancelButtonText: "取消",
           type: "warning"
         }).then(function() {
-          return delUser(userIds);
+          return delProductType(params);
         }).then(() => {
           this.getList();
           this.msgSuccess("删除成功");
@@ -248,12 +186,6 @@ export default {
     closeModal(flag = false){
       this.modal.visibleModal = false
       flag && this.getList()
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('system/user/export', {
-        ...this.queryParams
-      }, `user_${new Date().getTime()}.xlsx`)
     }
   }
 };

src/views/baseManage/productType/modal/addMobiel.vue

@@ -8,88 +8,55 @@
     <div class="mobile">
       <div class="hc-box add">
         <div class="hc-box-header">
-          新建核查方案
+            产品类别信息
         </div>
         <div class="hc-box-wrap">
             <el-form label-width="90px" :model="form" :rules="rules" ref="from" class="from">
-                <el-form-item label="方案编号:" prop="status">
-                    <el-input type="text" v-model="form.remark" :disabled="true"></el-input>
+                <el-form-item label="类别名称:" prop="typeName">
+                    <el-input type="text" v-model="form.typeName" :disabled="limit.isRead"></el-input>
                 </el-form-item>
-                <el-form-item label="审核结果:" prop="status">
-                    <el-select
-                      v-model="form.status"
-                      placeholder="请选择"
-                      clearable
-                      :disabled="limit.isRead"
-                      size="small">
-                      <el-option
-                        v-for="dict in statusOptions"
-                        :key="dict.dictValue"
-                        :label="dict.dictLabel"
-                        :value="dict.dictValue"
-                      />
-                    </el-select>
+                <el-form-item label="类别值:">
+                    <el-input type="text" v-model="form.typeVal" :disabled="true" placeholder="类别值后台自动生成"></el-input>
+                </el-form-item>
+                <el-form-item label="方法学名称:">
+                    <el-input type="text" v-model="form.methodology" :disabled="limit.isRead"></el-input>
                 </el-form-item>
                 <el-form-item label="备注:">
                     <el-input type="textarea"
                               :rows="3"
-                              v-model="form.remark"
+                              v-model="form.typeDesc"
                               :disabled="limit.isRead"></el-input>
                 </el-form-item>
+
             </el-form>
         </div>
       </div>
       <div class="hc-box taskList">
         <div class="hc-box-header">
-          核查任务 <span class="action">添加</span>
+           类别结构信息
         </div>
         <div class="hc-box-wrap">
-            <el-table v-loading="loading" :data="list" border>
-              <el-table-column label="序号" type="index" width="50" align="center" />
-              <el-table-column label="方案编号" align="center" prop="userName" />
-              <el-table-column label="案事件分组" align="center" prop="userName" :show-overflow-tooltip="true" />
-              <el-table-column label="核查企业数" align="center" prop="nickName" :show-overflow-tooltip="true" />
-              <el-table-column label="创建账号" align="center" prop="dept.deptName" :show-overflow-tooltip="true" />
-              <el-table-column label="创建时间" align="center" prop="createTime" width="160">
-                <template slot-scope="scope">
-                  <span>{{ parseTime(scope.row.createTime) }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column label="状态" align="center" prop="phonenumber" width="120" />
-              <el-table-column
-                label="操作"
-                align="center"
-                width="180"
-                class-name="small-padding fixed-width"
-              >
-                <template slot-scope="scope">
-                  <el-button
-                    size="mini"
-                    type="primary"
-                    icon="el-icon-download"
-                    @click="handleExport(scope.row)"
-                    v-hasPermi="['system:user:remove']"
-                  >下载</el-button>
-                  <el-button
-                    size="mini"
-                    type="success"
-                    icon="el-icon-delete"
-                    v-hasPermi="['system:user:remove']"
-                  >详情</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-            <pagination
-              v-show="total>0"
-              :total="total"
-              :page.sync="queryParams.pageNum"
-              :limit.sync="queryParams.pageSize"
-              @pagination="getList"
-            />
-
+            <el-tag
+              :key="index"
+              v-for="(tag,index) in form.productTypeExpansions"
+              :closable="!limit.isRead"
+              :disable-transitions="false"
+              @close="handleClose(tag)">
+              {{tag.expansionItem}}
+            </el-tag>
+            <el-input
+              class="input-new-tag"
+              v-if="inputVisible"
+              v-model="inputValue"
+              ref="saveTagInput"
+              size="small"
+              @keyup.enter.native="handleInputConfirm"
+              @blur="handleInputConfirm"
+            >
+            </el-input>
+            <el-button v-else class="button-new-tag" size="small" @click="showInput" v-show="!limit.isRead">+ 添加类型属性</el-button>
         </div>
       </div>
-
     </div>
     <div slot="footer" class="dialog-footer">
       <el-button @click="handleCancel">取 消</el-button>
@@ -99,7 +66,7 @@
 </template>
 
 <script>
-// import { updateRecordChek } from "@/api/system/recordCheck";
+import { addProductType , updateProductType } from "@/api/baseManage/productType";
 export default {
   name: 'addMobiel',
   props: {
@@ -117,7 +84,7 @@ export default {
     },
     selectRow: {
       type: Object,
-      default: {}
+      default:null
     }
   },
   watch: {
@@ -146,97 +113,116 @@ export default {
         isRead: false, //是否只读
         isAdd: false //是否可写
       },
+      //验证
       rules: {
-        status: [{ required: true, message: '审核结果不能为空!', trigger: 'blur' }]
-      },
-      total: 0,
-      //审核状态
-      statusOptions: [],
-      // 性别状态数据字典
-      sexTypeOptions: [],
-      list:[],
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        userName: undefined,
-        phonenumber: undefined,
-        status: undefined,
-        deptId: undefined
+        typeName: [{ required: true, message: '类别名称不能为空!', trigger: 'blur' }]
       },
-      loading:false,
-      form: {}
+      //属性
+      inputVisible: false,
+      inputValue:'',
+      //表单
+      form: {
+        productTypeExpansions:[]
+      }
     };
   },
   created() {
-    this.initPage();
-    this.form = Object.assign({},this.modalSelectRow)
+    // console.log(this.selectRow)
+    console.log(this.modalSelectRow)
     switch (this.modalAction) {
       case 'add':
         this.limit.isAdd = true;
         break;
+      case 'edit':
+        this.limit.isAdd = true;
+        this.form = Object.assign({},this.modalSelectRow)
+        break;
       case 'view':
         this.limit.isRead = true;
+        this.form = Object.assign({},this.modalSelectRow)
         break;
       default:
         break;
     }
   },
   methods: {
-    //强制视图渲染
-    forceUpdate() {
-      this.$forceUpdate();
+    //删除类型属性
+    handleClose(tag) {
+      this.form.productTypeExpansions.splice(this.form.productTypeExpansions.indexOf(tag), 1);
     },
-    //初始化默认值
-    initPage() {
-      //审核字典查询
-      this.getDicts("user_ext_status").then(response => {
-        this.statusOptions = response.data;
-      });
-      //性别字典查询
-      this.getDicts("sys_user_sex").then(response => {
-        this.sexTypeOptions = response.data;
+    //打开属性填写框
+    showInput() {
+      this.inputVisible = true;
+      this.$nextTick(_ => {
+        this.$refs.saveTagInput.$refs.input.focus();
       });
     },
+    //输入属性确定
+    handleInputConfirm() {
+      let inputValue = this.inputValue;
+      console.log(inputValue)
+      if (inputValue) {
+        this.form.productTypeExpansions.push({
+          "expansionItem":inputValue
+        });
+      }
+      this.inputVisible = false;
+      this.inputValue = '';
+    },
+    //表单提交
     submit() {
       this.$refs.from.validate(valid => {
         if (valid) {
-          let params = {
-            id:this.form.id,
-            status:this.form.status,
-            remark:this.form.remark
+          let params = Object.assign({},this.form)
+          console.log(params)
+          if(this.modalAction === 'add'){
+            addProductType(params).then(res => {
+                if (res.retHead.errCode === 0) {
+                  this.msgSuccess("操作成功");
+                  this.modalVisible = false
+                 	this.$emit('closeModal', true);
+                }
+            });
+          }else{
+            updateProductType(params).then(res => {
+                if (res.retHead.errCode === 0) {
+                  this.msgSuccess("操作成功");
+                  this.modalVisible = false
+                 	this.$emit('closeModal', true);
+                }
+            });
           }
-          updateRecordChek(params).then(response => {
-              if (response.code === 200) {
-                this.msgSuccess("操作成功");
-                this.modalVisible = false
-               	this.$emit('closeModal', true);
-              }
-          });
         } else {
           return false;
         }
       });
     },
+    //窗口关闭
     handleCancel() {
       this.$emit('closeModal', false);
-    },
-    getList(){
-
-    }
-  },
-  computed:{
-    // 性别状态字典翻译
-    sexFormat() {
-       return function(val){
-         return this.selectDictLabel(this.sexTypeOptions, val);
-       }
     }
   }
 };
 </script>
 
 <style lang="scss" scoped>
+
+  .el-tag + .el-tag {
+      margin-left: 10px;
+    }
+    .button-new-tag {
+      margin-left: 10px;
+      height: 32px;
+      line-height: 30px;
+      padding-top: 0;
+      padding-bottom: 0;
+    }
+    .input-new-tag {
+      width: 90px;
+      margin-left: 10px;
+      vertical-align: bottom;
+    }
+
   .hc-box{
     border:1px solid #e9e9e9;
     margin-bottom:20px;
@@ -252,8 +238,6 @@ export default {
           color:#304FFE
         }
     }
-
-
   }
   .add{
     .hc-box-wrap{

src/views/belongToSubject/area/index.vue

@@ -1,8 +1,249 @@
 <template>
+  <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form-item prop="phonenumber">
+          <el-input
+            v-model="queryParams.povertyAreaName"
+            placeholder="请输入类别名称"
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handleAdd"
+          >新增</el-button>
+        </el-col>
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+      <el-table v-loading="loading" :data="list">
+        <el-table-column label="序号" type="index" width="50" align="center" />
+        <el-table-column label="区域名称" align="center" prop="povertyAreaName" />
+        <el-table-column label="区域地址" align="center" prop="areaAddress" :show-overflow-tooltip="true" />
+        <el-table-column label="区域描述" align="center" prop="areaDesc" :show-overflow-tooltip="true" />
+        <el-table-column
+          label="操作"
+          align="center"
+          width="280"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-view"
+              @click="handleView(scope.row)"
+            >查看</el-button>
+            <el-button
+              size="mini"
+              type="success"
+              icon="el-icon-edit"
+              @click="handleEdit(scope.row)"
+            >编辑</el-button>
+            <el-button
+              size="mini"
+              type="danger"
+              @click="handleDelete"
+              icon="el-icon-delete"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+      <add-mobiel
+      			v-if="modal.visibleModal"
+      			:title="modal.title"
+      			:action="modal.action"
+      			:visible="modal.visibleModal"
+      			:selectRow="modal.selectRow"
+      			@closeModal="closeModal">
+      		</add-mobiel>
+  </div>
 </template>
-
+56757
 <script>
+import { listArea } from "@/api/belongToSubject/area";
+import addMobiel from './modal/addMobiel'
+export default {
+  name: "area",
+  components: {
+    addMobiel
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 表格数据
+      list: null,
+      // 状态数据字典
+      statusOptions: [],
+      // 表单参数
+      form: {},
+      //弹出层
+      modal:{
+        action:'',
+        title:'',
+        visibleModal:false,
+        selectRow:null
+      },
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询产婆类别列表 */
+    getList() {
+      this.loading = false;
+      this.list = [
+        {
+          id:"1",
+          typeName:'test1',
+          typeVal:'n019284423',
+          methodology:'花菜',
+          typeDesc:'备注描述',
+          createTime:'2015.10.11',
+          productTypeExpansionForms:[
+            {
+                expansionItem:'白菜'
+            },
+            {
+                expansionItem:'花菜'
+            }
+          ]
+        },
+        {
+          id:"2",
+          typeName:'test1',
+          typeVal:'n019284423',
+          methodology:'花菜',
+          typeDesc:'备注描述',
+          createTime:'2015.10.11',
+          productTypeExpansionForms:[
+            {
+                expansionItem:'白菜'
+            },
+            {
+                expansionItem:'花菜'
+            }
+          ]
+        },
+        {
+          id:"3",
+          typeName:'test1',
+          typeVal:'n019284423',
+          methodology:'花菜',
+          typeDesc:'备注描述',
+          createTime:'2015.10.11',
+          productTypeExpansionForms:[
+            {
+                expansionItem:'白菜'
+            },
+            {
+                expansionItem:'花菜'
+            }
+          ]
+        },
+        {
+          id:"3",
+          typeName:'test1',
+          typeVal:'n019284423',
+          methodology:'花菜',
+          typeDesc:'备注描述',
+          createTime:'2015.10.11',
+          productTypeExpansionForms:[
+            {
+                expansionItem:'白菜'
+            },
+            {
+                expansionItem:'花菜'
+            }
+          ]
+        }
+      ]
+      listArea(this.queryParams).then(res => {
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody
+            this.total = res.retHead.total
+          }
+        }
+      );
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.page = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+        this.modal.visibleModal = true
+        this.modal.title = '新增产品类别'
+        this.modal.action = 'add'
+    },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.visibleModal = true
+        this.modal.title = '产品类别详情'
+        this.modal.action = 'view'
+        this.modal.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.visibleModal = true
+        this.modal.title = '编辑产品类别'
+        this.modal.action = 'edit'
+        this.modal.selectRow = item
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      // const userIds = row.userId || this.ids;
+      this.$confirm('是否确认删除该数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          // return delUser(userIds);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {});
+    },
+    //窗口关闭
+    closeModal(flag = false){
+      this.modal.visibleModal = false
+      flag && this.getList()
+    }
+  }
+};
 </script>
-
-<style>
-</style>

src/views/belongToSubject/area/modal/addMobiel.vue

@@ -0,0 +1,360 @@
+<template>
+  <el-dialog
+    :title="modalTitle"
+    :visible.sync="modalVisible"
+    :width="formLabelWidth"
+    top="2vh"
+    @close="handleCancel">
+    <div class="mobile">
+      <div class="hc-box add">
+        <div class="hc-box-header">
+            产品类别信息
+        </div>
+        <div class="hc-box-wrap">
+            <el-form label-width="90px" :model="form" :rules="rules" ref="from" class="from">
+                <el-form-item label="行政区域:" prop="areaAdd">
+                   <el-cascader
+                    ref="areaSelect"
+                    v-model="form.areaAdd"
+                    style="width:100%;"
+                    :props="areaProps"
+                    @change="handleSelectArea($event)"
+                    clearable
+                    ></el-cascader>
+                </el-form-item>
+                <el-form-item label="区域名称:" prop="povertyAreaName">
+                    <el-input type="text" v-model="form.povertyAreaName" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+                <el-form-item label="区域描述:">
+                    <el-input type="textarea"
+                              :rows="3"
+                              v-model="form.areaDesc"
+                              :disabled="limit.isRead"></el-input>
+                </el-form-item>
+            </el-form>
+            <el-row :gutter="20">
+              <el-col :span="24">
+                  <el-divider content-position="left">贫困户图片</el-divider>
+                  <div class="uploadImg">
+                     <el-upload
+                       v-if="!limit.isRead"
+                       accept=".jpg, .png"
+                       :headers="upload.headers"
+                       :action="upload.url"
+                       :disabled="upload.isUploading"
+                       :on-progress="handleFileUploadProgress"
+                       :on-success="handleFileSuccess"
+                       :file-list="fileList">
+                       <el-button size="small" type="primary">点击上传</el-button>
+                       <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                     </el-upload>
+                     <ul class="uploadImgList">
+                       <li v-for="(item,index) in form.areaImages" :key="index">
+                         <img :src="imgRequest + item + '?imageView2/1/w/200/h/200'">
+                         <span class="del" @click="handelImgRemove(index)" v-if="!limit.isRead"><i class="el-icon-delete-solid"></i></span>
+                       </li>
+                     </ul>
+                  </div>
+              </el-col>
+            </el-row>
+        </div>
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { getToken } from "@/utils/auth";
+import { areaTree , saveArea , updateArea} from "@/api/belongToSubject/area";
+export default {
+  name: 'addMobiel',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    action: {
+      type: String,
+      default: 'add'
+    },
+    selectRow: {
+      type: Object,
+      default:null
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    action(newVal, oldVal) {
+      this.modalAction = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalAction: this.action,
+      modalSelectRow: this.selectRow,
+      formLabelWidth: '1024px',
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      //验证
+      rules: {
+        povertyAreaName: [{ required: true, message: '区域名称不能为空!', trigger: 'blur' }],
+        areaAdd: [{ required: true, message: '行政区域 不能为空!', trigger: 'blur' }]
+      },
+      //属性
+      inputVisible: false,
+      inputValue:'',
+      //行政区域
+      areaProps:{
+        lazy: true,
+        checkStrictly:true,
+        lazyLoad (node, resolve) {
+          if (node.level === 0) {
+             resolve( [{ label: '重庆市',value:'156050',leaf:false }] );
+          }else{
+             let params = {
+               upCode:node.data.value
+             }
+             areaTree(params).then(res => {
+                const areas = res.retBody.map((value,i) => ({
+                   value:value.code,
+                   label:value.name,
+                   leaf:value.level >= 5
+                }))
+                resolve(areas)
+             })
+          }
+        }
+      },
+      upload: {
+        // 是否禁用上传
+        isUploading: false,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/system/upload/fileImg",
+      },
+      //图片列表
+      fileList:[],
+      //表单
+      form: {
+        areaImages:[],
+        areaAdd:[]
+      }
+    };
+  },
+  created() {
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        console.log(this.modalSelectRow)
+        let datas = Object.assign({},this.modalSelectRow)
+        datas.areaAdd = [datas.provinceId,datas.cityId,datas.countyId,datas.townId,datas.villageId]
+        datas.areaImages = datas.areaImages === '' ? [] : datas.areaImages.split(';')
+        this.form = datas
+        console.log(datas)
+
+
+        break;
+      default:
+        break;
+    }
+  },
+  methods: {
+    //区域code赋值
+    handleSelectArea(event){
+      let nodesCode = this.$refs.areaSelect.getCheckedNodes()[0].data.value;
+      let nodesLable = this.$refs.areaSelect.getCheckedNodes()[0].data.label;
+      let activeIndex = event.length
+      if(activeIndex == 1){
+        this.form.provinceName = nodesLable
+        this.form.provinceId = nodesCode
+        this.form.cityName = ''
+        this.form.countyName = ''
+        this.form.townName = ''
+        this.form.villageName = ''
+        this.form.cityId = ''
+        this.form.countyId = ''
+        this.form.townId = ''
+        this.form.villageId = ''
+      }else if(activeIndex == 2){
+        this.form.cityId  = nodesCode
+        this.form.countyName = nodesLable
+        this.form.countyName = ''
+        this.form.townName = ''
+        this.form.villageName = ''
+        this.form.countyId = ''
+        this.form.townId = ''
+        this.form.villageId = ''
+      }else if(activeIndex == 3){
+        this.form.countyId = nodesCode
+        this.form.cityName = nodesLable
+        this.form.townName = ''
+        this.form.villageName = ''
+        this.form.townId = ''
+        this.form.villageId = ''
+      }else if(activeIndex == 4){
+        this.form.townId = nodesCode
+        this.form.townName = nodesLable
+        this.form.villageName = ''
+        this.form.villageId = ''
+      }else if(activeIndex == 5){
+        this.form.villageId = nodesCode
+        this.form.villageName = nodesLable
+      }
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+       this.upload.isUploading = true;
+    },
+    // 上传成功处理
+    handleFileSuccess(response, file, fileList){
+       this.fileList = []
+       this.form.areaImages.push(response.retBody)
+       this.upload.isUploading = false;
+    },
+    // 图片删除
+    handelImgRemove(i){
+      this.form.areaImages.splice(i,1)
+    },
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let params = Object.assign({},this.form)
+          params.areaAddress = params.provinceName  + params.cityName + params.townName + params.villageName
+          params.areaImages = params.areaImages.join(";")
+          console.log(params,this.modalAction)
+          if(this.modalAction === 'add'){
+             saveArea(params).then(res => {
+                 if (res.retHead.errCode === 0) {
+                     this.msgSuccess("操作成功");
+                     this.modalVisible = false
+                    this.$emit('closeModal', true);
+                 }else{
+                   this.msgError("保存失败，请检查!");
+                 }
+             });
+          }else{
+            updateArea(params).then(res => {
+                if (res.retHead.errCode === 0) {
+                    this.msgSuccess("操作成功");
+                    this.modalVisible = false
+                   this.$emit('closeModal', true);
+                }else{
+                  this.msgError("保存失败，请检查!");
+                }
+            });
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closeModal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+
+  .el-cascader-menu .el-radio {
+    display: table;
+    vertical-align: middle;
+    width: 90%;
+    height: 100%;
+    position: absolute;
+    box-sizing: border-box;
+    margin-left:-20px;
+    padding-left:10px;
+  }
+  .el-cascader-menu .el-radio .el-radio__input {
+    display: table-cell;
+    vertical-align: middle;
+  }
+
+  .hc-box{
+    border:1px solid #e9e9e9;
+    margin-bottom:20px;
+    .hc-box-header{
+        height:40px;
+        line-height:40px;
+        background:#fafafa;
+        font-weight:bold;
+        color:#333;
+        padding:0 15px;
+        .action{
+          margin-left:10px;
+          color:#304FFE
+        }
+    }
+    .uploadImg{
+      padding:0 30px 30px 30px;
+      .uploadImgList{
+        list-style:none;
+        margin:0;
+        padding:15px 0;
+        display:flex;
+        flex-flow: row;
+        li{
+          position:relative;
+          border:1px solid #ddd;
+          border-radius:6px;
+          width:120px;
+          height:120px;
+          margin-right:13px;
+          img{
+            width:100%;
+            height:100%;
+            border-radius:6px;
+          }
+          .del{
+            display:none;
+            position:absolute;
+            top: -9px;
+            right: -9px;
+            cursor:pointer;
+            i{
+              font-size:20px;
+              color:red;
+            }
+          }
+          &:hover{
+            .del{
+              display:block;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/belongToSubject/org/index.vue

@@ -1,8 +1,336 @@
 <template>
+  <div class="people">
+      <el-container class="people-container">
+          <!--搜索栏-->
+          <el-aside class="people-container-left">
+               <el-row :gutter="10" class="classHouse-container-left-row">
+                        <el-col :span="24" class="mt10 mb20">
+                          <el-divider content-position="left" class="classHouse-container-left-row-title">所处区域</el-divider>
+                        </el-col>
+                        <el-col :span="24">
+                          <el-tree
+                            class="filter-tree classHouse-container-left-row-tree"
+                            :props="peopleTreeObj.defaultProps"
+                            :load="loadNode"
+                            lazy
+                            empty-text="暂无数据"
+                            @node-click="handleNodeClick"
+                            :highlight-current="true"
+                            ref="classHouseTreeRef"
+                          ></el-tree>
+                        </el-col>
+                </el-row>
+          </el-aside>
+          <!--主体内容区域-->
+          <el-main class="classHouse-container-right">
+              <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+                <el-form-item prop="phonenumber">
+                  <el-input
+                    v-model="queryParams.condition"
+                    placeholder="贫困集体名称"
+                    clearable
+                    size="small"
+                    style="width: 240px"
+                    @keyup.enter.native="handleQuery"
+                  />
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                  <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                </el-form-item>
+              </el-form>
+              <el-row :gutter="10" class="mb8">
+                <el-col :span="1.5">
+                  <el-button
+                    type="primary"
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                  >新增</el-button>
+                </el-col>
+                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+              </el-row>
+              <el-table v-loading="loading" :data="list">
+                <el-table-column label="序号" type="index" width="50" align="center" />
+                <el-table-column label="归属集体编号" align="center" prop="collectiveCode" />
+                <el-table-column label="归属集体名称" align="center" prop="collectiveName"/>
+                <el-table-column label="关联户数" align="center" prop="collectivePersonNum"/>
+                <el-table-column label="集体账户单位" align="center" prop="orgUnit"/>
+                <el-table-column label="银行卡号" align="center" prop="bankCardNo"/>
+                <el-table-column label="备注说明" align="center" prop="remark"/>
+                <el-table-column
+                  label="操作"
+                  align="center"
+                  width="280"
+                  class-name="small-padding fixed-width"
+                >
+                  <template slot-scope="scope">
+                    <el-button
+                      size="mini"
+                      type="primary"
+                      icon="el-icon-view"
+                      @click="handleView(scope.row)"
+                    >查看</el-button>
+                    <el-button
+                      size="mini"
+                      type="success"
+                      icon="el-icon-edit"
+                      @click="handleEdit(scope.row)"
+                    >编辑</el-button>
+                    <el-button
+                      size="mini"
+                      type="danger"
+                      @click="handleDelete(scope.row)"
+                      icon="el-icon-delete"
+                    >删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <pagination
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNo"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+              />
+          </el-main>
+      </el-container>
+      <!--弹窗口-->
+      <add-mobiel
+      			v-if="modal.visibleModal"
+      			:title="modal.title"
+      			:action="modal.action"
+      			:visible="modal.visibleModal"
+      			:selectRow="modal.selectRow"
+      			@closeModal="closeModal">
+      		</add-mobiel>
+  </div>
 </template>
 
 <script>
+import { getTree , listOrg , delCollectiveFarmer} from "@/api/belongToSubject/org";
+import addMobiel from './modal/addMobiel'
+export default {
+  name: "org",
+  components: {
+    addMobiel
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 40,
+      // 表格数据
+      list: null,
+      //树形菜单配置
+      peopleTreeObj:{
+        defaultProps: {
+          label: 'name',
+          children: 'children',
+          isLeaf: false
+        }
+      },
+      // 表单参数
+      form: {},
+      //弹出层
+      modal:{
+        action:'',
+        title:'',
+        visibleModal:false,
+        selectRow:null
+      },
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    //菜单节点载入
+    loadNode(node, resolve) {
+      if (node.level === 0) {
+        return resolve( [{ name: '重庆市',code:'156050',level:0 }] );
+      }else{
+         this.getChildrenNode(node,resolve)
+      }
+    },
+    //查询子节点
+    getChildrenNode(node,resolve){
+      if(node.data.level <= 4){
+        let params = {
+          code:node.data.code
+        }
+        getTree(params).then(res => {
+            let arr = res.retBody
+            const list = arr.map(item => {
+              if(item.level > 4){
+                item.isLeaf = false
+                item.children = null
+              }else{
+                item.isLeaf = true
+              }
+              return item
+            })
+            resolve(list)
+          }
+        );
+      }else{
+        resolve([])
+      }
+    },
+    //节点点击
+    handleNodeClick(node){
+      this.queryParams = {
+        pageNo: 1,
+        pageSize: 10
+      }
+      switch(node.level){
+        case 0:
+           this.queryParams.provinceId = node.code
+           break;
+        case 2:
+           this.queryParams.cityId = node.code
+           break;
+        case 3:
+           this.queryParams.countyId = node.code
+           break;
+        case 4:
+           this.queryParams.townId = node.code
+           break;
+        case 5:
+           this.queryParams.villageId = node.code
+           break;
+      }
+      this.getList()
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      listOrg(this.queryParams).then(res => {
+          this.loading = false;
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody;
+            this.total = res.retHead.total;
+          }
+        }
+      );
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+        this.modal.visibleModal = true
+        this.modal.title = '新增归属集体信息'
+        this.modal.action = 'add'
+    },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.visibleModal = true
+        this.modal.title = '归属集体信息详情'
+        this.modal.action = 'view'
+        this.modal.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.visibleModal = true
+        this.modal.title = '编辑归属集体信息'
+        this.modal.action = 'edit'
+        this.modal.selectRow = item
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$confirm('是否确认删除该数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delCollectiveFarmer(row);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {
+          this.msgError("删除失败")
+        });
+    },
+    //窗口关闭
+    closeModal(flag = false){
+      this.modal.visibleModal = false
+      flag && this.getList()
+    }
+  }
+};
 </script>
-
-<style>
+<style scoped lang="scss">
+  .people {
+    width: 100%;
+    height: 100%;
+    margin: 10px 10px 0 0;
+    padding: 0 10px 0 0;
+    &-container {
+      width: 100%;
+      height: 100%;
+      &-left {
+        background: #fff;
+        padding: 0 20px;
+        width: 320px !important;
+        min-height: 850px;
+        height: auto;
+        &-row {
+          margin: 0 !important;
+          &-title .el-divider__text {
+            font-size: 18px;
+            font-weight: 700;
+            font-style: normal;
+          }
+          &-tree {
+          }
+        }
+      }
+      &-switch {
+        font-size: 28px;
+        cursor: pointer;
+        color: #1890ff;
+        &-leftbtn {
+          position: absolute;
+          top: 50%;
+          left: 325px;
+          cursor: pointer;
+        }
+        &-rightbtn {
+          position: absolute;
+          top: 50%;
+          left: -5px;
+          cursor: pointer;
+        }
+      }
+      &-right {
+        padding:20px;
+        &-main {
+          background: #fff;
+          height: auto;
+          min-height: 850px;
+          &-defaultMl {
+            margin-left: 10px;
+          }
+          &-nodefaultMl {
+            margin-left: 0;
+          }
+        }
+      }
+    }
+  }
 </style>

src/views/belongToSubject/org/modal/addMobiel.vue

@@ -0,0 +1,436 @@
+<template>
+  <el-dialog :title="modalTitle" :visible.sync="modalVisible" :width="formLabelWidth" top="2vh" @close="handleCancel">
+    <div class="mobile">
+      <div class="hc-box add">
+        <div class="hc-box-header">贫困户信息</div>
+        <div class="hc-box-wrap">
+          <el-form label-width="100px" :model="form" :rules="rules" ref="from" class="from">
+            <el-form-item label="编号:"><el-input type="text" v-model="form.farmerCode" :disabled="true" placeholder="类别值后台自动生成"></el-input></el-form-item>
+            <el-form-item label="姓名:" prop="collectiveName">
+              <el-input type="text" v-model="form.collectiveName" placeholder="贫困户姓名" :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-row :gutter="20">
+              <el-col :span="12">
+                <el-form-item label="联系电话">
+                  <el-input type="text" v-model="form.phone" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="银行卡号">
+                  <el-input type="text" v-model="form.bankCardNo" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="12">
+                <el-form-item label="银行名称">
+                  <el-input type="text" v-model="form.bankName" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="银行机构代码">
+                  <el-input type="text" v-model="form.bankCode" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="24">
+                <el-form-item label="单位">
+                  <el-input type="text" v-model="form.orgUnit" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="备注:">
+              <el-input type="textarea" :rows="3" v-model="form.remark" :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-divider content-position="left">帮扶区域</el-divider>
+            <el-form-item label="已选区域" prop="fkPovertyAreaName">
+              <el-input type="text" v-model="form.fkPovertyAreaName" :disabled="true" placeholder="请使用表格选择"></el-input>
+            </el-form-item>
+            <div class="methodologyMain" v-if="modalAction !== 'view'">
+              <div class="methodologyMain-header">
+                <el-form :inline="true" :model="searchParams" @submit.native.prevent>
+                  <el-input type="text" v-model="searchParams.povertyAreaName" size="mini" clearable placeholder="请输入帮扶区域" style="width:200px;margin-right:10px;"></el-input>
+                  <el-button type="primary" size="mini" @click="onSearch">搜索</el-button>
+                </el-form>
+              </div>
+              <div class="methodologyMain-wrap">
+                <el-table :data="areaList" v-loading="areaLoading" border>
+                  <el-table-column label="序号" type="index" width="50" align="center" />
+                  <el-table-column label="区域名称" align="center" prop="povertyAreaName" />
+                  <el-table-column label="区域地址" align="center" prop="areaAddress" />
+                  <el-table-column label="区域描述" align="center" prop="areaDesc" />
+                  <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
+                    <template slot-scope="scope">
+                      <el-button size="mini" type="success" @click="selectArea(scope.row)">选择</el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+                <pagination v-show="total > 0" :total="total" :page.sync="searchParams.pageNo" :limit.sync="searchParams.pageSize" @pagination="onSearch" />
+              </div>
+            </div>
+            <el-divider content-position="left">关联贫困组员</el-divider>
+            <!-- v-if="modalAction !== 'view'" -->
+            <div class="methodologyMain">
+              <div class="methodologyMain-header" v-if="modalAction !== 'view'">
+                <el-form :inline="true" :model="searchParams2" @submit.native.prevent>
+                  <el-input type="text" v-model="searchParams2.condition" size="mini" clearable placeholder="请输入帮扶区域" style="width:200px;margin-right:10px;"></el-input>
+                  <el-button type="primary" size="mini" @click="onPeople">搜索</el-button>
+                </el-form>
+              </div>
+              <div class="methodologyMain-wrap">
+                <el-table :data="peopleList" v-loading="peopleLoading" border v-if="modalAction !== 'view'">
+                  <el-table-column label="序号" type="index" width="50" align="center" />
+                  <el-table-column label="归属人编号" align="center" prop="farmerCode" />
+                  <el-table-column label="归属人姓名" align="center" prop="farmerName" />
+                  <el-table-column label="家庭人数" align="center" prop="familyNum" />
+                  <el-table-column label="家庭年收入" align="center" prop="incomeVal" />
+                  <el-table-column label="归属人类型" align="center" prop="farmerType" />
+                  <el-table-column label="联系电话" align="center" prop="phone" />
+                  <el-table-column label="银行卡号" align="center" prop="bankCardNo" />
+                  <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
+                    <template slot-scope="scope">
+                      <el-button size="mini" type="success" @click="selectPerson(scope.row)">选择</el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+                <pagination
+                  v-show="peopleTotal > 0"
+                  :total="peopleTotal"
+                  v-if="modalAction !== 'view'"
+                  :page.sync="searchParams2.pageNo"
+                  :limit.sync="searchParams2.pageSize"
+                  @pagination="onPeople" />
+                <h2 v-if="modalAction !== 'view'">已选：</h2>
+                <el-table :data="form.farmerInfos" border>
+                  <el-table-column label="序号" type="index" width="50" align="center" />
+                  <el-table-column label="归属人编号" align="center" prop="farmerCode" />
+                  <el-table-column label="归属人姓名" align="center" prop="farmerName" />
+                  <el-table-column label="家庭人数" align="center" prop="familyNum" />
+                  <el-table-column label="家庭年收入" align="center" prop="incomeVal" />
+                  <el-table-column label="归属人类型" align="center" prop="farmerType" />
+                  <el-table-column label="联系电话" align="center" prop="phone" />
+                  <el-table-column label="银行卡号" align="center" prop="bankCardNo" />
+                  <el-table-column label="操作" align="center" width="180" v-if="modalAction !== 'view'" class-name="small-padding fixed-width">
+                    <template slot-scope="scope">
+                      <el-button size="mini" type="danger" @click="delSelPerson(index)">删除</el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </div>
+            <el-row :gutter="20">
+              <el-col :span="24">
+                <el-divider content-position="left">图片附件</el-divider>
+                <div class="uploadImg">
+                  <el-upload
+                    v-if="!limit.isRead"
+                    accept=".jpg, .png"
+                    :headers="upload.headers"
+                    :action="upload.url"
+                    :disabled="upload.isUploading"
+                    :on-progress="handleFileUploadProgress"
+                    :on-success="handleFileSuccess"
+                    :file-list="fileList"
+                  >
+                    <el-button size="small" type="primary">点击上传</el-button>
+                    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                  </el-upload>
+                  <ul class="uploadImgList">
+                    <li v-for="(item, index) in form.collectiveImages" :key="index">
+                      <img :src="imgRequest + item + '?imageView2/1/w/200/h/200'" />
+                      <span class="del" @click="handelImgRemove(index)" v-if="!limit.isRead"><i class="el-icon-delete-solid"></i></span>
+                    </li>
+                  </ul>
+                </div>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { getToken } from '@/utils/auth';
+import { peopleType, nation, sexList } from '@/api/CONST.js';
+import { listArea, listPeople, saverCollectiveFarmer, updateCollectiveFarmer } from '@/api/belongToSubject/org';
+export default {
+  name: 'addMobiel',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    action: {
+      type: String,
+      default: 'add'
+    },
+    selectRow: {
+      type: Object,
+      default: null
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    action(newVal, oldVal) {
+      this.modalAction = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalAction: this.action,
+      modalSelectRow: this.selectRow,
+      formLabelWidth: '1024px',
+      peopleTypeList: peopleType,
+      nationList: nation,
+      sexLists: sexList,
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      upload: {
+        // 是否禁用上传
+        isUploading: false,
+        // 设置上传的请求头部
+        headers: { Authorization: 'Bearer ' + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + '/system/upload/fileImg'
+      },
+      //验证
+      rules: {
+        collectiveName: [{ required: true, message: '姓名不能为空!', trigger: 'blur' }],
+        fkPovertyAreaName: [{ required: true, message: '帮扶区域不能为空!', trigger: 'blur' }]
+      },
+      //图片列表
+      fileList: [],
+      restaurants: [],
+      searchParams: {
+        povertyAreaName: '',
+        pageNo: 1,
+        pageSize: 10
+      },
+      total: 0,
+      areaList: [],
+      areaLoading: true,
+      //贫困户
+      searchParams2: {
+        pageNo: 1,
+        pageSize: 10
+      },
+      peopleList:[],
+      peopleLoading:true,
+      peopleTotal:0,
+      //表单
+      form: {
+        collectiveImages: [],
+        fkPovertyAreaId: '',
+        fkPovertyAreaName: '',
+        farmerInfos:[]
+      }
+    };
+  },
+  created() {
+    this.onSearch();
+    this.onPeople();
+    let datas;
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        console.log(this.modalSelectRow);
+        datas = Object.assign({}, this.modalSelectRow);
+        console.log(datas)
+        datas.collectiveImages = datas.collectiveImages.split(';');
+        datas.fkPovertyAreaName = datas.povertyArea.povertyAreaName;
+        this.form = datas;
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        datas = Object.assign({}, this.modalSelectRow);
+        console.log(datas)
+        datas.collectiveImages = datas.collectiveImages.split(';');
+        datas.fkPovertyAreaName = datas.povertyArea.povertyAreaName;
+        this.form = datas;
+        break;
+      default:
+        break;
+    }
+  },
+  methods: {
+    //区域搜索
+    onSearch() {
+      this.areaLoading = true;
+      listArea(this.searchParams).then(res => {
+        this.areaLoading = false;
+        this.areaList = res.retBody;
+        this.total = res.retHead.total;
+      });
+    },
+    //贫困人员
+    onPeople(){
+      this.peopleLoading = true;
+      listPeople(this.searchParams).then(res => {
+        this.peopleLoading = false;
+        this.peopleList = res.retBody;
+        this.peopleTotal = res.retHead.total;
+      });
+    },
+    //贫困人员确定
+    selectPerson(item){
+      this.form.farmerInfos.push(item)
+    },
+    //删除已选择的人
+    delSelPerson(index){
+      this.form.farmerInfos.splice(index,1)
+    },
+    //区域确定
+    selectArea(item) {
+      this.form.fkPovertyAreaId = item.guid;
+      this.form.fkPovertyAreaName = item.povertyAreaName;
+    },
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let params = Object.assign({}, this.form);
+          params.collectiveImages = params.collectiveImages.join(';');
+          console.log(params);
+          if (this.modalAction === 'add') {
+            saverCollectiveFarmer(params).then(res => {
+              console.log(res);
+              if (res.retHead.errCode === 0) {
+                this.msgSuccess('操作成功');
+                this.modalVisible = false;
+                this.$emit('closeModal', true);
+              } else {
+                this.msgError('保存失败，请检查!');
+              }
+            });
+          } else {
+            updateCollectiveFarmer(params).then(res => {
+              console.log(res);
+              if (res.retHead.errCode === 0) {
+                this.msgSuccess('操作成功');
+                this.modalVisible = false;
+                this.$emit('closeModal', true);
+              } else {
+                this.msgError('保存失败，请检查!');
+              }
+            });
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+      this.upload.isUploading = true;
+    },
+    // 上传成功处理
+    handleFileSuccess(response, file, fileList) {
+      this.fileList = [];
+      this.form.collectiveImages.push(response.retBody);
+      this.upload.isUploading = false;
+    },
+    // 图片删除
+    handelImgRemove(i) {
+      this.form.collectiveImages.splice(i, 1);
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closeModal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.hc-box {
+  border: 1px solid #e9e9e9;
+  margin-bottom: 20px;
+  .hc-box-header {
+    height: 40px;
+    line-height: 40px;
+    background: #fafafa;
+    font-weight: bold;
+    color: #333;
+    padding: 0 15px;
+    margin-bottom: 20px;
+    .action {
+      margin-left: 10px;
+      color: #304ffe;
+    }
+  }
+  .hc-box-wrap {
+    .methodologyMain {
+      padding: 0 16px;
+      &-header {
+        margin-bottom: 10px;
+      }
+    }
+    .uploadImg {
+      padding: 0 30px 30px 30px;
+      .uploadImgList {
+        list-style: none;
+        margin: 0;
+        padding: 15px 0;
+        display: flex;
+        flex-flow: row;
+        li {
+          position: relative;
+          border: 1px solid #ddd;
+          border-radius: 6px;
+          width: 120px;
+          height: 120px;
+          margin-right: 13px;
+          img {
+            width: 100%;
+            height: 100%;
+            border-radius: 6px;
+          }
+          .del {
+            display: none;
+            position: absolute;
+            top: -9px;
+            right: -9px;
+            cursor: pointer;
+            i {
+              font-size: 20px;
+              color: red;
+            }
+          }
+          &:hover {
+            .del {
+              display: block;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/views/belongToSubject/people/index.vue

@@ -1,8 +1,352 @@
 <template>
+  <div class="people">
+      <el-container class="people-container">
+          <!--搜索栏-->
+          <el-aside class="people-container-left">
+               <el-row :gutter="10" class="classHouse-container-left-row">
+                        <el-col :span="24" class="mt10 mb20">
+                          <el-divider content-position="left" class="classHouse-container-left-row-title">所处区域</el-divider>
+                        </el-col>
+                        <!-- <el-col :span="24" class="mb20">
+                          <el-input
+                            placeholder="请输入区域名称"
+                            clearable
+                            size="small"
+                            style="text-align: center;"
+                          >
+                            <el-button slot="append" icon="el-icon-search"></el-button>
+                          </el-input>
+                        </el-col> -->
+                        <el-col :span="24">
+                          <el-tree
+                            class="filter-tree classHouse-container-left-row-tree"
+                            :props="peopleTreeObj.defaultProps"
+                            :load="loadNode"
+                            lazy
+                            empty-text="暂无数据"
+                            @node-click="handleNodeClick"
+                            :highlight-current="true"
+                            ref="classHouseTreeRef"
+                          ></el-tree>
+                        </el-col>
+                </el-row>
+          </el-aside>
+          <!--主体内容区域-->
+          <el-main class="classHouse-container-right">
+              <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+                <el-form-item prop="phonenumber">
+                  <el-input
+                    v-model="queryParams.povertyAreaName"
+                    placeholder="贫困户姓名"
+                    clearable
+                    size="small"
+                    style="width: 240px"
+                    @keyup.enter.native="handleQuery"
+                  />
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                  <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                </el-form-item>
+              </el-form>
+              <el-row :gutter="10" class="mb8">
+                <el-col :span="1.5">
+                  <el-button
+                    type="primary"
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                  >新增</el-button>
+                </el-col>
+                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+              </el-row>
+              <el-table v-loading="loading" :data="list">
+                <el-table-column label="序号" type="index" width="50" align="center" />
+                <el-table-column label="归属人编号" align="center" prop="farmerCode" />
+                <el-table-column label="归属人姓名" align="center" prop="farmerName"/>
+                <el-table-column label="家庭人数" align="center" prop="familyNum"/>
+                <el-table-column label="家庭年收入" align="center" prop="incomeVal"/>
+                <el-table-column label="归属人类型" align="center" prop="farmerType"/>
+                <el-table-column label="联系电话" align="center" prop="phone"/>
+                <el-table-column label="银行卡号" align="center" prop="bankCardNo"/>
+                <el-table-column label="银行状态" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.bankStatus == 0 ? '可用' : '不可用'}}
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  label="操作"
+                  align="center"
+                  width="280"
+                  class-name="small-padding fixed-width"
+                >
+                  <template slot-scope="scope">
+                    <el-button
+                      size="mini"
+                      type="primary"
+                      icon="el-icon-view"
+                      @click="handleView(scope.row)"
+                    >查看</el-button>
+                    <el-button
+                      size="mini"
+                      type="success"
+                      icon="el-icon-edit"
+                      @click="handleEdit(scope.row)"
+                    >编辑</el-button>
+                    <el-button
+                      size="mini"
+                      type="danger"
+                      @click="handleDelete(scope.row)"
+                      icon="el-icon-delete"
+                    >删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <pagination
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNo"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+              />
+          </el-main>
+      </el-container>
+      <!--弹窗口-->
+      <add-mobiel
+      			v-if="modal.visibleModal"
+      			:title="modal.title"
+      			:action="modal.action"
+      			:visible="modal.visibleModal"
+      			:selectRow="modal.selectRow"
+      			@closeModal="closeModal">
+      		</add-mobiel>
+  </div>
 </template>
 
 <script>
+import { getTree , listPeople , delPerson} from "@/api/belongToSubject/people";
+import addMobiel from './modal/addMobiel'
+export default {
+  name: "people",
+  components: {
+    addMobiel
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 40,
+      // 表格数据
+      list: null,
+      //树形菜单配置
+      peopleTreeObj:{
+        defaultProps: {
+          label: 'name',
+          children: 'children',
+          isLeaf: false
+        }
+      },
+      // 表单参数
+      form: {},
+      //弹出层
+      modal:{
+        action:'',
+        title:'',
+        visibleModal:false,
+        selectRow:null
+      },
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    //菜单节点载入
+    loadNode(node, resolve) {
+      if (node.level === 0) {
+        return resolve( [{ name: '重庆市',code:'156050',level:0 }] );
+      }else{
+         this.getChildrenNode(node,resolve)
+      }
+    },
+    //查询子节点
+    getChildrenNode(node,resolve){
+      if(node.data.level <= 4){
+        let params = {
+          code:node.data.code
+        }
+        getTree(params).then(res => {
+            let arr = res.retBody
+            const list = arr.map(item => {
+              if(item.level > 4){
+                item.isLeaf = false
+                item.children = null
+              }else{
+                item.isLeaf = true
+              }
+              return item
+            })
+            resolve(list)
+          }
+        );
+      }else{
+        resolve([])
+      }
+    },
+    //节点点击
+    handleNodeClick(node){
+      this.queryParams = {
+        pageNo: 1,
+        pageSize: 10
+      }
+      switch(node.level){
+        case 0:
+           this.queryParams.provinceId = node.code
+           break;
+        case 2:
+           this.queryParams.cityId = node.code
+           break;
+        case 3:
+           this.queryParams.countyId = node.code
+           break;
+        case 4:
+           this.queryParams.townId = node.code
+           break;
+        case 5:
+           this.queryParams.villageId = node.code
+           break;
+      }
+      this.getList()
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      listPeople(this.queryParams).then(res => {
+          this.loading = false;
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody;
+            this.total = res.retHead.total;
+          }
+        }
+      );
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+        this.modal.visibleModal = true
+        this.modal.title = '新增归属人信息'
+        this.modal.action = 'add'
+    },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.visibleModal = true
+        this.modal.title = '归属人信息详情'
+        this.modal.action = 'view'
+        this.modal.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.visibleModal = true
+        this.modal.title = '编辑归属人信息'
+        this.modal.action = 'edit'
+        this.modal.selectRow = item
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$confirm('是否确认删除该数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delPerson(row);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {
+          this.msgError("删除失败")
+        });
+    },
+    //窗口关闭
+    closeModal(flag = false){
+      this.modal.visibleModal = false
+      flag && this.getList()
+    }
+  }
+};
 </script>
-
-<style>
+<style scoped lang="scss">
+  .people {
+    width: 100%;
+    height: 100%;
+    margin: 10px 10px 0 0;
+    padding: 0 10px 0 0;
+    &-container {
+      width: 100%;
+      height: 100%;
+      &-left {
+        background: #fff;
+        padding: 0 20px;
+        width: 320px !important;
+        min-height: 850px;
+        height: auto;
+        &-row {
+          margin: 0 !important;
+          &-title .el-divider__text {
+            font-size: 18px;
+            font-weight: 700;
+            font-style: normal;
+          }
+          &-tree {
+          }
+        }
+      }
+      &-switch {
+        font-size: 28px;
+        cursor: pointer;
+        color: #1890ff;
+        &-leftbtn {
+          position: absolute;
+          top: 50%;
+          left: 325px;
+          cursor: pointer;
+        }
+        &-rightbtn {
+          position: absolute;
+          top: 50%;
+          left: -5px;
+          cursor: pointer;
+        }
+      }
+      &-right {
+        padding:20px;
+        &-main {
+          background: #fff;
+          height: auto;
+          min-height: 850px;
+          &-defaultMl {
+            margin-left: 10px;
+          }
+          &-nodefaultMl {
+            margin-left: 0;
+          }
+        }
+      }
+    }
+  }
 </style>

src/views/belongToSubject/people/modal/addMobiel.vue

@@ -0,0 +1,432 @@
+<template>
+  <el-dialog :title="modalTitle" :visible.sync="modalVisible" :width="formLabelWidth" top="2vh" @close="handleCancel">
+    <div class="mobile">
+      <div class="hc-box add">
+        <div class="hc-box-header">贫困户信息</div>
+        <div class="hc-box-wrap">
+          <el-form label-width="100px" :model="form" :rules="rules" ref="from" class="from">
+            <el-form-item label="编号:">
+              <el-input type="text" v-model="form.farmerCode" :disabled="true" placeholder="类别值后台自动生成"></el-input>
+            </el-form-item>
+            <el-form-item label="姓名:" prop="farmerName">
+              <el-input type="text" v-model="form.farmerName" placeholder="贫困户姓名" :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="性别">
+                  <el-radio-group v-model="form.sex" :disabled="limit.isRead">
+                    <el-radio :label="item.id" v-for="(item,index) in sexLists">{{item.name}}</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="村名组号">
+                    <el-input type="text" v-model="form.fkCollectiveId" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="民族">
+                    <el-select v-model="form.nation" placeholder="请选择民族" :disabled="limit.isRead">
+                      <el-option v-for="(item,index) in nationList" :key="index" :label="item.name" :value="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="人均年收入">
+                    <el-input type="text" v-model="form.incomeVal" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="文化程度">
+                    <el-input type="text" v-model="form.education" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="联系电话">
+                    <el-input type="text" v-model="form.phone" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="家庭人数">
+                    <el-input type="text" v-model="form.familyNum" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="身份证号">
+                    <el-input type="text" v-model="form.pid" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="银行卡号">
+                    <el-input type="text" v-model="form.bankCardNo" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="贫困户类型">
+                    <el-select v-model="form.farmerType" placeholder="请贫困户类型" :disabled="limit.isRead">
+                      <el-option
+                        v-for="(item,index) in peopleTypeList"
+                        :key="index"
+                        :label="item.name"
+                        :value="item.name"></el-option>
+                    </el-select>
+                  </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="银行名称">
+                    <el-input type="text" v-model="form.bankName" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="银行机构代码">
+                    <el-input type="text" v-model="form.bankCode" :disabled="limit.isRead"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-form-item label="备注:">
+                <el-input type="textarea"
+                          :rows="3"
+                          v-model="form.farmerRemark"
+                          :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-form-item label="帮扶区域" prop="fkPovertyAreaName">
+              <el-input type="text" v-model="form.fkPovertyAreaName" :disabled="true"></el-input>
+            </el-form-item>
+            <div class="methodologyMain" v-if="modalAction !== 'view'">
+                <div class="methodologyMain-header">
+                  <el-form :inline="true" :model="searchParams" @submit.native.prevent>
+                    <el-input
+                      type="text"
+                      v-model="searchParams.povertyAreaName"
+                      size="mini"
+                      clearable
+                      placeholder="请输入帮扶区域"
+                      style="width:200px;margin-right:10px;"></el-input>
+                    <el-button
+                      type="primary"
+                      size="mini"
+                      @click="onSearch">搜索</el-button>
+                  </el-form>
+                </div>
+                <div class="methodologyMain-wrap">
+                  <el-table   :data="areaList" v-loading="areaLoading" border>
+                    <el-table-column label="序号" type="index" width="50" align="center" />
+                    <el-table-column label="区域名称" align="center" prop="povertyAreaName" />
+                    <el-table-column label="区域地址" align="center" prop="areaAddress"/>
+                    <el-table-column label="区域描述" align="center" prop="areaDesc"/>
+                    <el-table-column
+                      label="操作"
+                      align="center"
+                      width="180"
+                      class-name="small-padding fixed-width"
+                    >
+                      <template slot-scope="scope">
+                        <el-button
+                          size="mini"
+                          type="success"
+                          @click="selectArea(scope.row)"
+                        >选择</el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                  <pagination
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="searchParams.pageNo"
+                    :limit.sync="searchParams.pageSize"
+                    @pagination="onSearch"
+                  />
+                </div>
+            </div>
+
+            <el-row :gutter="20">
+              <el-col :span="24">
+                  <el-divider content-position="left">贫困户图片</el-divider>
+                  <div class="uploadImg">
+                     <el-upload
+                       v-if="!limit.isRead"
+                       accept=".jpg, .png"
+                       :headers="upload.headers"
+                       :action="upload.url"
+                       :disabled="upload.isUploading"
+                       :on-progress="handleFileUploadProgress"
+                       :on-success="handleFileSuccess"
+                       :file-list="fileList">
+                       <el-button size="small" type="primary">点击上传</el-button>
+                       <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                     </el-upload>
+                     <ul class="uploadImgList">
+                       <li v-for="(item,index) in form.farmerImages" :key="index">
+                         <img :src="imgRequest + item + '?imageView2/1/w/200/h/200'">
+                         <span class="del" @click="handelImgRemove(index)" v-if="!limit.isRead"><i class="el-icon-delete-solid"></i></span>
+                       </li>
+                     </ul>
+                  </div>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { getToken } from "@/utils/auth";
+import {peopleType , nation , sexList} from "@/api/CONST.js"
+import { listArea ,saverAreaPeople , updateAreaPeople} from "@/api/belongToSubject/people";
+export default {
+  name: 'addMobiel',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    action: {
+      type: String,
+      default: 'add'
+    },
+    selectRow: {
+      type: Object,
+      default: null
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    action(newVal, oldVal) {
+      this.modalAction = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalAction: this.action,
+      modalSelectRow: this.selectRow,
+      formLabelWidth: '1024px',
+      peopleTypeList:peopleType,
+      nationList:nation,
+      sexLists:sexList,
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      upload: {
+        // 是否禁用上传
+        isUploading: false,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/system/upload/fileImg",
+      },
+      //验证
+      rules: {
+        farmerName: [{ required: true, message: '姓名不能为空!', trigger: 'blur' }],
+        methodology: [{ required: true, message: '帮扶区域不能为空!', trigger: 'blur' }]
+      },
+      //图片列表
+      fileList:[],
+      restaurants:[],
+      searchParams:{
+        povertyAreaName:'',
+        pageNo: 1,
+        pageSize: 10
+      },
+      total:0,
+      areaList:[],
+      areaLoading:true,
+      //表单
+      form: {
+        farmerImages:[],
+        fkPovertyAreaId:'',
+        fkPovertyAreaName:''
+      }
+    };
+  },
+  created() {
+    this.onSearch()
+    let datas;
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        console.log(this.modalSelectRow)
+        datas = Object.assign({},this.modalSelectRow)
+        datas.farmerImages = datas.farmerImages.split(';')
+        datas.fkPovertyAreaName = datas.povertyArea.povertyAreaName
+        this.form = datas
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        datas = Object.assign({},this.modalSelectRow)
+        datas.farmerImages = datas.farmerImages.split(';')
+        datas.fkPovertyAreaName = datas.povertyArea.povertyAreaName
+        this.form = datas
+        break;
+      default:
+        break;
+    }
+  },
+  methods: {
+    //区域搜索
+    onSearch(){
+      this.areaLoading = true;
+      listArea(this.searchParams).then(res => {
+          this.areaLoading = false
+          this.areaList = res.retBody
+          this.total = res.retHead.total
+      });
+    },
+    //区域确定
+    selectArea(item){
+      this.form.fkPovertyAreaId = item.guid
+      this.form.fkPovertyAreaName = item.povertyAreaName
+    },
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let params = Object.assign({}, this.form);
+          params.farmerImages = params.farmerImages.join(";")
+          console.log(params);
+          if(this.modalAction === 'add'){
+            saverAreaPeople(params).then(res => {
+                console.log(res)
+                if (res.retHead.errCode === 0) {
+                    this.msgSuccess("操作成功");
+                    this.modalVisible = false
+                  	this.$emit('closeModal', true);
+                }else{
+                  this.msgError("保存失败，请检查!");
+                }
+            });
+          }else{
+            updateAreaPeople(params).then(res => {
+                console.log(res)
+                if (res.retHead.errCode === 0) {
+                    this.msgSuccess("操作成功");
+                    this.modalVisible = false
+                  	this.$emit('closeModal', true);
+                }else{
+                  this.msgError("保存失败，请检查!");
+                }
+            });
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+       this.upload.isUploading = true;
+    },
+    // 上传成功处理
+    handleFileSuccess(response, file, fileList){
+       this.fileList = []
+       this.form.farmerImages.push(response.retBody)
+       this.upload.isUploading = false;
+    },
+    // 图片删除
+    handelImgRemove(i){
+      this.form.farmerImages.splice(i,1)
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closeModal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.hc-box {
+  border: 1px solid #e9e9e9;
+  margin-bottom: 20px;
+  .hc-box-header {
+    height: 40px;
+    line-height: 40px;
+    background: #fafafa;
+    font-weight: bold;
+    color: #333;
+    padding: 0 15px;
+    margin-bottom:20px;
+    .action {
+      margin-left: 10px;
+      color: #304ffe;
+    }
+  }
+  .hc-box-wrap{
+    .methodologyMain{
+        padding:0 16px;
+        &-header{
+          margin-bottom:10px;
+        }
+    }
+    .uploadImg{
+      padding:0 30px 30px 30px;
+      .uploadImgList{
+        list-style:none;
+        margin:0;
+        padding:15px 0;
+        display:flex;
+        flex-flow: row;
+        li{
+          position:relative;
+          border:1px solid #ddd;
+          border-radius:6px;
+          width:120px;
+          height:120px;
+          margin-right:13px;
+          img{
+            width:100%;
+            height:100%;
+            border-radius:6px;
+          }
+          .del{
+            display:none;
+            position:absolute;
+            top: -9px;
+            right: -9px;
+            cursor:pointer;
+            i{
+              font-size:20px;
+              color:red;
+            }
+          }
+          &:hover{
+            .del{
+              display:block;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/views/login.vue

@@ -46,20 +46,30 @@
         </el-button>
       </el-form-item>
     </el-form>
+
     <!--  底部  -->
     <div class="el-login-footer">
-      <span>Copyright © 2018-2020 ruoyi.vip All Rights Reserved.</span>
+      <Verify
+      	@success="success"
+      	:mode="'pop'"
+      	:captchaType="'blockPuzzle'"
+        :imgSize="{ width: '330px', height: '155px' }"
+        ref="verify"></Verify>
+      <!-- <span>Copyright © 2018-2020 ruoyi.vip All Rights Reserved.</span> -->
     </div>
   </div>
 </template>
 
 <script>
-import { getCodeImg } from "@/api/login";
+import Verify from "@/components/verifition/Verify"
 import Cookies from "js-cookie";
 import { encrypt, decrypt } from '@/utils/jsencrypt'
 
 export default {
   name: "Login",
+  components:{
+    Verify
+  },
   data() {
     return {
       codeUrl: "",
@@ -93,16 +103,30 @@ export default {
     }
   },
   created() {
-    // this.getCode();
     this.getCookie();
   },
   methods: {
-    // getCode() {
-    //   getCodeImg().then(res => {
-    //     this.codeUrl = "data:image/gif;base64," + res.img;
-    //     this.loginForm.uuid = res.uuid;
-    //   });
-    // },
+    success(params){
+      this.loading = true;
+      if (this.loginForm.rememberMe) {
+        Cookies.set("username", this.loginForm.username, { expires: 30 });
+        Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
+        Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
+      } else {
+        Cookies.remove("username");
+        Cookies.remove("password");
+        Cookies.remove('rememberMe');
+      }
+      this.loginForm.captchaVerification = params.captchaVerification
+      this.$store
+        .dispatch("Login", this.loginForm)
+        .then(() => {
+          this.$router.push({ path: this.redirect || "/" });
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
     getCookie() {
       const username = Cookies.get("username");
       const password = Cookies.get("password");
@@ -116,25 +140,8 @@ export default {
     handleLogin() {
       this.$refs.loginForm.validate(valid => {
         if (valid) {
-          this.loading = true;
-          if (this.loginForm.rememberMe) {
-            Cookies.set("username", this.loginForm.username, { expires: 30 });
-            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
-            Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
-          } else {
-            Cookies.remove("username");
-            Cookies.remove("password");
-            Cookies.remove('rememberMe');
-          }
-          this.$store
-            .dispatch("Login", this.loginForm)
-            .then(() => {
-              this.$router.push({ path: this.redirect || "/" });
-            })
-            .catch(() => {
-              this.loading = false;
-              // this.getCode();
-            });
+
+          this.$refs.verify.show()
         }
       });
     }

src/views/productManage/commodity/index.vue

@@ -1,8 +1,236 @@
 <template>
+  <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form-item prop="phonenumber">
+          <el-select
+            size="small"
+            v-model="queryParams.productTypeName"
+            style="margin-right:8px;"
+            clearable
+            placeholder="商品类型">
+            <el-option
+              v-for="(item,index) in productTypelist"
+              :key="index"
+              :label="item.typeName"
+              :value="item.guid"></el-option>
+          </el-select>
+          <el-select
+            size="small"
+            style="margin-right:8px;"
+            v-model="queryParams.isSale"
+            clearable
+            placeholder="商品状态">
+            <el-option
+              v-for="(item,index) in productStatus"
+              :key="index"
+              :label="item.lable"
+              :value="item.id"></el-option>
+          </el-select>
+          <el-input
+            v-model="queryParams.goodsName"
+            placeholder="请输入类别名称"
+            clearable
+            size="small"
+            style="width: 240px;margin-right:8px;"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handelProductAction(1)"
+          >上架</el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handelProductAction(0)"
+          >下架</el-button>
+        </el-col>
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+      <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
+        <el-table-column
+          type="selection"
+          width="55">
+        </el-table-column>
+        <el-table-column label="序号" type="index" width="50" align="center" />
+        <el-table-column label="商品首图" align="center" prop="typeName" width="160">
+          <template slot-scope="scope">
+            <el-image
+                style="width:50px; height:50px"
+                :src="imgRequest + scope.row.goodsImages.split(';')[0] + '?imageView2/1/w/200/h/200'"
+                :preview-src-list="scope.row.goodsImages.split(';').map(item => imgRequest + item + '?imageView2/1/w/400/h/400')">
+              </el-image>
+          </template>
+        </el-table-column>
+        <el-table-column label="商品名称" align="center" prop="goodsName" />
+        <el-table-column label="商品类别" align="center" prop="productTypeName" />
+        <el-table-column label="售出量" align="center" prop="saledCarbonSkin" />
+        <el-table-column label="剩余量" align="center" prop="carbonVal" />
+        <el-table-column label="认购期" align="center" prop="goodsSaleDate" width="160">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.goodsSaleDate) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="创建日期" align="center" prop="createTime" width="160">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="是否上架" align="center" prop="isSale" width="160">
+          <template slot-scope="scope">
+            <span>{{ scope.row.isSale == 1 ? '已上架' : '已下架'}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          width="120"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="danger"
+              @click="handleDelete(scope.row)"
+              icon="el-icon-delete"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNo"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+  </div>
 </template>
 
 <script>
+import { listProduct ,listProductType , delProduct ,productAc} from "@/api/productManage/commodity";
+export default {
+  name: "commodity",
+  data() {
+    return {
+      // 遮罩层
+      loading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 表格数据
+      list: null,
+      // 商品类型
+      productTypelist: [],
+      productStatus:[
+        {
+          lable:'下架',
+          id:'0'
+        },
+        {
+          lable:'上架',
+          id:'1'
+        }
+      ],
+      // 表单参数
+      form: {},
+      //表格选中列表
+      checkedList:[],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.initPages();
+    this.getList();
+  },
+  methods: {
+    initPages(){
+       //获取产品类型
+       let typeParams = {
+         state: 1
+       }
+       listProductType(typeParams).then(res => {
+           if(res.retHead.errCode == 0){
+             this.productTypelist = res.retBody
+           }
+       });
+    },
+    /** 查询产婆类别列表 */
+    getList() {
+      this.loading = true;
+      listProduct(this.queryParams).then(res => {
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody
+            this.total = res.retHead.total;
+          }
+          this.loading = false;
+        }
+      );
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams.isSale = null
+      this.queryParams.productTypeName = null
+      this.queryParams.goodsName = ""
+      this.handleQuery();
+    },
+    /** 多选**/
+    handleSelectionChange(val){
+       this.checkedList = val;
+    },
+    /*商品状态操作*/
+    handelProductAction(status){
+      if(this.checkedList.length != 0){
+        this.checkedList.map(item => item.isSale = status)
+        productAc(this.checkedList).then(res => {
+            this.msgSuccess(res.retHead.errMsg)
+            this.getList();
+          }
+        );
+      }else{
+        this.msgError("请先选择你想要操作的商品!")
+      }
+      console.log(status)
+    },
+    /** 删除按钮操作 */
+    handleDelete(item) {
+      if(item.isSale == 1){
+        this.msgError("上架的商品不能删除，若要删除，请先下架商品!")
+        return;
+      }else{
+        let params = item
+        this.$confirm('是否确认删除该数据项?', "警告", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(function() {
+            return delProduct(params);
+          }).then(() => {
+            this.getList();
+            this.msgSuccess("删除成功");
+          }).catch(function() {});
+      }
+    }
+  }
+};
 </script>
-
-<style>
-</style>

src/views/productManage/productInfo/index.vue

@@ -1,8 +1,373 @@
 <template>
+  <div class="product">
+      <el-container class="product-container">
+          <!--搜索栏-->
+          <el-aside class="product-container-left">
+               <el-row :gutter="10" class="product-container-left-row">
+                    <el-col :span="24" class="mt10 mb10">
+                      <el-divider content-position="left" class="product-container-left-row-title">产品类别</el-divider>
+                    </el-col>
+                    <el-col :span="24">
+                        <div class="product-container-left-row-content" v-loading="typeLoading">
+                            <ul class="product-container-left-row-content-typelist">
+                              <li
+                                v-for="(item,index) in typeList"
+                                @click="selMenu(item,index)"
+                                :class="{active:typeIndex == index}"
+                                :key="index">
+                                {{item.typeName}}
+                              </li>
+                            </ul>
+                        </div>
+                    </el-col>
+                </el-row>
+          </el-aside>
+          <!--主体内容区域-->
+          <el-main class="product-container-right">
+              <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+                <el-form-item prop="phonenumber">
+                  <el-input
+                    v-model="queryParams.farmerName"
+                    placeholder="产品名称"
+                    clearable
+                    size="small"
+                    style="width: 240px"
+                    @keyup.enter.native="handleQuery"
+                  />
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+                  <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                </el-form-item>
+              </el-form>
+              <el-row :gutter="10" class="mb8">
+                <el-col :span="1.5">
+                  <el-button
+                    type="primary"
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                  >新增</el-button>
+                </el-col>
+                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+              </el-row>
+              <el-table v-loading="loading" :data="list">
+                <el-table-column label="序号" type="index" width="50" align="center" />
+                <el-table-column label="产品编码" align="center" prop="productCode" />
+                <el-table-column label="产品名称" align="center" prop="productName" />
+                <el-table-column label="归属区域" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.povertyArea === null ? '-' : scope.row.povertyArea.povertyAreaName}}
+                  </template>
+                </el-table-column>
+                <el-table-column label="归属主体" align="center">
+                  <template slot-scope="scope">
+                    {{scope.row.productBelongs.length == 0 ? '-' : scope.row.productBelongs[0].farmerName}}
+                  </template>
+                </el-table-column>
+                <el-table-column label="创建人" align="center" prop="createUserName"/>
+                <el-table-column label="创建时间" align="center" prop="createTime"/>
+                <el-table-column
+                  label="操作"
+                  align="center"
+                  width="280"
+                  class-name="small-padding fixed-width"
+                >
+                  <template slot-scope="scope">
+                    <el-button
+                      size="mini"
+                      v-if="scope.row.isEnable === 1"
+                      type="warning"
+                      icon="el-icon-s-check"
+                      @click="handleExportPd(scope.row)"
+                    >生成商品</el-button>
+                    <el-button
+                      size="mini"
+                      v-if="scope.row.isEnable === 2"
+                      icon="el-icon-s-check"
+                      type="info"
+                    >商品已生成</el-button>
+                    <el-button
+                      size="mini"
+                      type="primary"
+                      icon="el-icon-view"
+                      @click="handleView(scope.row)"
+                    >查看</el-button>
+                    <el-button
+                      size="mini"
+                      type="success"
+                      icon="el-icon-edit"
+                      @click="handleEdit(scope.row)"
+                    >编辑</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+              <pagination
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNo"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+              />
+          </el-main>
+      </el-container>
+      <!--crud弹窗口-->
+      <add-mobiel
+      			v-if="modal.crud.visibleModal"
+      			:title="modal.crud.title"
+      			:action="modal.crud.action"
+      			:visible="modal.crud.visibleModal"
+      			:selectRow="modal.crud.selectRow"
+            :fkProductTypeId="fkProductType"
+      			@closecrudmodal="closecrudmodal">
+      		</add-mobiel>
+      <!--产品生成弹窗口-->
+      <export-product
+        v-if="modal.export.visibleModal"
+        :title="modal.export.title"
+        :visible="modal.export.visibleModal"
+        :selectRow="modal.export.selectRow"
+        @closeexportmodal="closeexportmodal"
+      ></export-product>
+  </div>
 </template>
-
 <script>
+import { listType , listProduct } from "@/api/productManage/productInfo";
+import addMobiel from './modal/addMobiel'
+import exportProduct from "./modal/exportProduch"
+export default {
+  name: "productInfo",
+  components: {
+    addMobiel,
+    exportProduct
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      typeLoading:true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      //种类类型
+      typeList:null,
+      typeIndex:null,
+      // 表格数据
+      list: null,
+      // 表单参数
+      form: {},
+      //弹出层
+      modal:{
+        crud:{
+          action:'',
+          title:'',
+          visibleModal:false,
+          selectRow:null
+        },
+        export:{
+          title:'',
+          visibleModal:false,
+          selectRow:null
+        }
+      },
+      //类型id
+      fkProductType:'',
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.getTypelist();
+    this.getList();
+  },
+  methods: {
+    //菜单加载
+    getTypelist(){
+        let params = {
+          state:1
+        }
+        listType(params).then(res => {
+            this.typeLoading = false;
+            if(res.retHead.errCode == 0){
+              this.typeList = res.retBody
+            }
+          }
+        );
+    },
+    //菜单选择
+    selMenu(item,i){
+      this.queryParams.fkProductType = item.guid
+      this.fkProductType = item.guid
+      this.typeIndex = i
+      this.getList()
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      listProduct(this.queryParams).then(res => {
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody
+          }
+          this.total = res.retHead.total;
+          this.loading = false;
+        }
+      );
+    },
+    //产品生成
+    handleExportPd(item){
+      this.modal.export.visibleModal = true
+      this.modal.export.title = '生成商品'
+      this.modal.export.selectRow = item
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.queryParams.condition = this.queryParams.farmerName
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams.condition = "";
+      this.queryParams.farmerName = "";
+      this.queryParams.fkProductType = ""
+      this.typeIndex = null;
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+        this.modal.crud.visibleModal = true
+        this.modal.crud.title = '新增产品信息'
+        this.modal.crud.action = 'add'
+    },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.crud.visibleModal = true
+        this.modal.crud.title = '产品信息详情'
+        this.modal.crud.action = 'view'
+        this.modal.crud.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.crud.visibleModal = true
+        this.modal.crud.title = '编辑产品信息'
+        this.modal.crud.action = 'edit'
+        this.modal.crud.selectRow = item
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$confirm('是否确认删除该数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          // return delUser(userIds);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {});
+    },
+    //增加编辑窗口关闭
+    closecrudmodal(flag = false){
+      this.modal.crud.visibleModal = false
+      flag && this.getList()
+    },
+    //产品生成窗口关闭
+    closeexportmodal(flag = false){
+      this.modal.export.visibleModal = false
+      flag && this.getList()
+    }
+  }
+};
 </script>
+<style scoped lang="scss">
+  .product {
+    width: 100%;
+    height: 100%;
+    margin: 10px 10px 0 0;
+    padding: 0 10px 0 0;
+    &-container {
+      width: 100%;
+      height: 100%;
+      &-left {
+        background: #fff;
+        padding: 0 20px;
+        width: 280px !important;
+        min-height: 850px;
+        height: auto;
+        &-row {
+          margin: 0 !important;
+          &-title .el-divider__text {
+            font-size: 18px;
+            font-weight: 700;
+            font-style: normal;
+          }
+          &-content{
+            &-typelist{
+              list-style:none;
+              margin:0;
+              padding:0;
+              li{
+                display:block;
+                height:50px;
+                line-height:50px;
+                padding:0 15px;
+                border: 1px solid #e6e6e6;
+                background-color: #f2f2f2;
+                margin-bottom:10px;
+                cursor:pointer;
+                font-size:14px;
+                &:hover{
+                    border: 1px solid #2B2F3B;
+                    background-color: #304156;
+                    color:#fff;
+                }
+              }
+              li.active{
+                  border: 1px solid #2B2F3B;
+                  background-color: #304156;
+                  color:#fff;
+              }
+            }
+          }
+        }
+      }
+      &-switch {
+        font-size: 28px;
+        cursor: pointer;
+        color: #1890ff;
+        &-leftbtn {
+          position: absolute;
+          top: 50%;
+          left: 325px;
+          cursor: pointer;
+        }
+        &-rightbtn {
+          position: absolute;
+          top: 50%;
+          left: -5px;
+          cursor: pointer;
+        }
+      }
+      &-right {
+        padding:20px;
+        &-main {
+          background: #fff;
+          height: auto;
+          min-height: 850px;
+          &-defaultMl {
+            margin-left: 10px;
+          }
+          &-nodefaultMl {
+            margin-left: 0;
+          }
+        }
+      }
+    }
+  }
 
-<style>
 </style>

src/views/productManage/productInfo/modal/addMobiel.vue

@@ -0,0 +1,644 @@
+<template>
+  <el-dialog :title="modalTitle" :visible.sync="modalVisible" :width="formLabelWidth" top="2vh" @close="handleCancel">
+    <div class="mobile">
+      <div class="hc-box add">
+        <div class="hc-box-header">信息</div>
+        <div class="hc-box-wrap">
+          <el-divider content-position="left">产品基础信息</el-divider>
+          <el-form label-width="90px" :model="form" :rules="rules" ref="from" class="from">
+            <el-form-item label="产品类型" prop="fkProductType">
+              <el-select
+                v-model="form.fkProductType"
+                @change="getProductAux"
+                :disabled="limit.isRead"
+                placeholder="请选择产品类型">
+                <el-option
+                  v-for="(item,index) in productTypelist"
+                  :key="index"
+                  :label="item.typeName"
+                  :value="item.guid"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="产品名称:" prop="productName">
+              <el-input
+                type="text"
+                v-model="form.productName"
+                :disabled="limit.isRead"
+                placeholder="产品名称"></el-input>
+            </el-form-item>
+            <el-form-item label="有效时间:" prop="carbonGenerateDate">
+               <el-date-picker
+                    v-model="form.carbonGenerateDate"
+                    type="date"
+                    :disabled="limit.isRead"
+                    value-format="yyyy-MM-dd HH:mm:ss"
+                    placeholder="选择日期">
+               </el-date-picker>
+            </el-form-item>
+            <el-form-item label="有效周期:" prop="productValidateNum">
+              <el-input
+                type="number"
+                v-model="form.productValidateNum"
+                :disabled="limit.isRead"
+                placeholder="产品有效周期(年)"></el-input>
+            </el-form-item>
+            <el-form-item label="碳汇量:" prop="carbonSink">
+              <el-input
+                type="number"
+                v-model="form.carbonSink"
+                :disabled="limit.isRead"
+                placeholder="产品产生的碳汇量(公斤)"></el-input>
+            </el-form-item>
+            <el-form-item label="产品备注:">
+                <el-input type="textarea"
+                          :rows="3"
+                          v-model="form.remark"
+                          :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-row :gutter="20">
+              <el-col :span="24">
+                  <el-divider content-position="left">产品图片</el-divider>
+                  <div class="uploadImg">
+                      <el-upload
+                        v-if="!limit.isRead"
+                        accept=".jpg, .png"
+                        :headers="upload.headers"
+                        :action="upload.url"
+                        :disabled="upload.isUploading"
+                        :on-progress="handleFileUploadProgress"
+                        :on-success="handleFileSuccess"
+                        :file-list="fileList">
+                        <el-button size="small" type="primary">点击上传</el-button>
+                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                      </el-upload>
+                      <ul class="uploadImgList">
+                        <li v-for="(item,index) in form.productImgs" :key="index">
+                          <img :src="imgRequest + item + '?imageView2/1/w/200/h/200'">
+                          <span class="del" @click="handelImgRemove(index)" v-if="!limit.isRead"><i class="el-icon-delete-solid"></i></span>
+                        </li>
+                      </ul>
+                  </div>
+              </el-col>
+            </el-row>
+          </el-form>
+          <el-divider content-position="left">产品附属信息</el-divider>
+          <div class="productAux">
+            <div v-if="productAuxlist.length == 0 " class="productAux-error">
+               请注意，该项你可能没选产品类型或该产品类型没有数据，请仔细核对!
+            </div>
+            <ul v-else>
+              <li v-for="(item,index) in productAuxlist">
+                  <div class="title">
+                    <span class="key">类型属性:</span>
+                    <span class="value">{{item.expansionItem}}</span>
+                  </div>
+                  <div class="value">
+                    <el-input v-model="item.expansionVal" placeholder="属性值" :disabled="limit.isRead"></el-input>
+                  </div>
+              </li>
+            </ul>
+          </div>
+          <el-divider content-position="left">关联帮扶主体</el-divider>
+          <div class="relevanceMain">
+              <div class="header">
+                  <el-radio-group v-model="activeHelpType">
+                    <el-radio-button v-for="(item,index) in helpType" :label="item.val">{{item.key}}</el-radio-button>
+                  </el-radio-group>
+                  <div class="linkSelected">
+                    <el-popover
+                      placement="top-start"
+                      width="900"
+                      trigger="hover">
+                      <el-table border :data="selecLinksTable">
+                          <!--index-->
+                          <el-table-column label="序号" type="index" width="50" align="center" fixed/>
+                          <!--row name-->
+                          <template v-for="(tableTitleItem,index) in activeTabField">
+                            <el-table-column
+                              :key="index"
+                              fixed
+                              :align="tableTitleItem.fieldAlign || 'left'"
+                              :prop="tableTitleItem.fieldKey"
+                              :label="tableTitleItem.fieldName">
+                              <template slot-scope="scope">
+                                  <span v-if="'povertyArea' === tableTitleItem.fieldKey">{{scope.row.povertyArea.areaAddress}}</span>
+                                  <span v-else>{{scope.row[tableTitleItem.fieldKey]}}</span>
+                              </template>
+                            </el-table-column>
+                          </template>
+                          <!--action-->
+                          <el-table-column
+                            label="操作"
+                            align="center"
+                            width="80"
+                            class-name="small-padding fixed-width"
+                          >
+                            <template slot-scope="scope">
+                              <el-button
+                                size="mini"
+                                v-if="!limit.isRead"
+                                type="danger"
+                                @click="handleAcdel(scope.row)"
+                              >删除</el-button>
+                            </template>
+                          </el-table-column>
+                      </el-table>
+                     <el-button type="success" slot="reference" size="small" round>已选({{selecLinksTable.length}})</el-button>
+                    </el-popover>
+                  </div>
+              </div>
+              <div class="container">
+                  <el-table
+                    :data="tableList"
+                    ref="linkTable"
+                    highlight-current-row
+                    v-loading="tableLoading"
+                    border
+                    max-height="500">
+                    <!--index-->
+                    <el-table-column label="序号" type="index" width="50" align="center" fixed/>
+                    <!--row name-->
+                    <template v-for="(tableTitleItem,index) in tabField">
+                      <el-table-column
+                        :key="index"
+                        fixed
+                        :align="tableTitleItem.fieldAlign || 'left'"
+                        :prop="tableTitleItem.fieldKey"
+                        :label="tableTitleItem.fieldName">
+                        <template slot-scope="scope">
+                            <span v-if="'povertyArea' === tableTitleItem.fieldKey">{{scope.row.povertyArea.areaAddress}}</span>
+                            <span v-else>{{scope.row[tableTitleItem.fieldKey]}}</span>
+                        </template>
+                      </el-table-column>
+                    </template>
+                    <!--action-->
+                    <el-table-column
+                      label="操作"
+                      align="center"
+                      width="120"
+                      class-name="small-padding fixed-width"
+                    >
+                      <template slot-scope="scope">
+                        <el-button
+                          v-if="!limit.isRead"
+                          size="mini"
+                          type="primary"
+                          @click="handleSelect(scope.row)"
+                        >选择</el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                  <pagination
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNo"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getHelpInfo"
+                  />
+              </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import tableHeader from "../tableHeader.js"
+import { getToken } from "@/utils/auth";
+import {
+  listProductType ,
+  listProductAuxiliary ,
+  listCollectiveFarmer ,
+  listFarmer ,
+  saveProductType,
+  detailProduct,
+  updateProduct} from "@/api/productManage/productInfo";
+export default {
+  name: 'addMobiel',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    action: {
+      type: String,
+      default: 'add'
+    },
+    selectRow: {
+      type: Object,
+      default: null
+    },
+    fkProductTypeId:{
+      type:String,
+      default:''
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    action(newVal, oldVal) {
+      this.modalAction = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    },
+    activeHelpType(newVal,oldVal){
+      this.queryParams.pageNo = 1
+      this.getHelpInfo()
+    },
+    fkProductTypeId(newVal,oldVal){
+      this.modalTypeid = newVal
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalAction: this.action,
+      modalSelectRow: this.selectRow,
+      modalTypeid:this.fkProductTypeId,
+      formLabelWidth: '1024px',
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      // 图片上传
+      upload: {
+        // 是否禁用上传
+        isUploading: false,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/system/upload/fileImg",
+      },
+      //产品类型
+      productTypelist:[],
+      //产品附属信息
+      productAuxlist:[],
+      //帮扶主体类型
+      helpType:[
+        {
+           key:"关联单个贫困户",
+           val:0
+        },
+        {
+           key:"关联贫困集体",
+           val:1
+        }
+      ],
+      activeHelpType:0,
+      loading:true,
+      tabField:[],
+      tableList:[],
+      tableLoading:false,
+      activeTabField:[],
+      selecLinksTable:[],
+      //验证
+      rules: {
+        fkProductType: [{ required: true, message: '产品类型不能为空!', trigger: 'blur' }],
+        productName: [{ required: true, message: '产品名称不能为空!', trigger: 'blur' }],
+        carbonGenerateDate: [{ required: true, message: '有效期不能为空!', trigger: 'blur' }],
+        productValidateNum: [{ required: true, message: '有效周期不能为空!', trigger: 'blur' }],
+        carbonSink: [{ required: true, message: '碳汇量不能为空!', trigger: 'blur' }]
+      },
+      //图片列表
+      fileList: [],
+      // 关联帮扶分页
+      total: 0,
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      },
+      //表单
+      form: {
+        productImgs:[],
+        productBelongs:[],
+        collectiveFarmerForm:[]
+      }
+    };
+  },
+  created() {
+    this.initPage();
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        //是否选择类型
+        if(this.modalTypeid !== ""){
+          this.form.fkProductType = this.modalTypeid
+          this.getProductAux(this.modalTypeid)
+        }
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        this.getDetail(this.selectRow.guid)
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        this.getDetail(this.selectRow.guid)
+        break;
+      default:
+        break;
+    }
+  },
+  mounted() {
+    //初始化帮扶主体
+    this.getHelpInfo()
+  },
+  methods: {
+    //初始化默认值
+    initPage() {
+        //获取产品类型
+        let typeParams = {
+          state: 1
+        }
+        listProductType(typeParams).then(res => {
+            if(res.retHead.errCode == 0){
+              this.productTypelist = res.retBody
+            }
+        });
+    },
+    //详情查询
+    getDetail(id){
+      let params = {
+        productGuid:id
+      }
+      detailProduct(params).then(res => {
+          if(res.retHead.errCode == 0){
+            this.form = res.retBody
+            this.form.productImgs = res.retBody.productImgs.split(';')
+            this.productAuxlist = res.retBody.productExpansions
+            if(res.retBody.productBelongs){
+                console.log("productBelongs")
+                this.activeHelpType = 0
+                this.activeTabField =  tableHeader.singleUser
+                this.selecLinksTable = res.retBody.productBelong
+                this.form.productBelongs = res.retBody.productBelong
+                this.form.collectiveFarmerForm = []
+            }else{
+                console.log("collectiveFarmerForm")
+                this.activeHelpType = 1
+                this.activeTabField =  tableHeader.gatherUser
+                this.selecLinksTable = res.retBody.collectiveFarmer
+                this.form.collectiveFarmerForm = res.retBody.collectiveFarme
+                this.form.productBelongs = []
+            }
+            console.log(this.form)
+          }
+      });
+    },
+    //获取产品附属信息
+    getProductAux(value){
+        let params = {
+          guid:value
+        }
+        listProductAuxiliary(params).then(res => {
+            if(res.retHead.errCode == 0){
+              this.productAuxlist = res.retBody
+            }
+        });
+    },
+    //获取帮扶主体
+    getHelpInfo(){
+      this.tableList = []
+      this.tabField = []
+      this.tableLoading = true
+      if(this.activeHelpType == 0){
+        this.tabField = tableHeader.singleUser
+        listFarmer(this.queryParams).then(res => {
+            if(res.retHead.errCode == 0){
+              this.tableList = res.retBody
+              this.total = res.retHead.total
+              this.tableLoading = false
+            }
+        });
+      }else{
+        this.tabField = tableHeader.gatherUser
+        listCollectiveFarmer(this.queryParams).then(res => {
+            if(res.retHead.errCode == 0){
+              this.tableList = res.retBody
+              this.total = res.retHead.total
+              this.tableLoading = false
+            }
+        });
+      }
+    },
+    //帮扶人家选择
+    handleSelect(row){
+      this.$refs.linkTable.setCurrentRow(row); //选中高亮
+      if(this.form.productBelongs.length > 0 || this.form.collectiveFarmerForm.length > 0){
+         this.msgError("当前只能选择一个平困户，请先删除后选择!")
+         return;
+      }else{
+         this.selecLinksTable = []  //选中展示
+         this.activeTabField = this.activeHelpType == 0 ? tableHeader.singleUser : tableHeader.gatherUser
+         this.selecLinksTable.push(row)
+         this.form.fkPovertyArea = row.fkPovertyAreaId
+         if(this.activeHelpType == 0){
+           this.form.productBelongs.push(row)
+         }else{
+           this.form.collectiveFarmerForm.push(row)
+         }
+         console.log(this.form)
+      }
+    },
+    //删除已选择帮扶家庭
+    handleAcdel(){
+      this.activeTabField = []
+      this.form.productBelongs = []
+      this.form.collectiveFarmerForm = []
+      this.selecLinksTable = []
+    },
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let params = Object.assign({}, this.form);
+          params.productImgs = params.productImgs.join(";")
+          params.productExpansions = this.productAuxlist
+          console.log("未各式前: ",params)
+          if(params.collectiveFarmerForm.length == 0) {
+            delete params.collectiveFarmerForm
+          }
+          if(params.productBelongs.length == 0){
+            delete params.productBelongs
+          }
+          console.log("格式化后:",params)
+          if(this.selecLinksTable.length == 0){
+            this.msgError("请选择关联帮扶主体!")
+            return;
+          }else{
+            if(this.modalAction === 'add'){
+              saveProductType(params).then(response => {
+                  if (response.retHead.errCode === 0) {
+                    this.msgSuccess("操作成功");
+                    this.modalVisible = false
+                    this.$emit('closecrudmodal', true);
+                  }else{
+                    this.msgError("保存失败，请检查!");
+                  }
+              });
+            }else{
+              updateProduct(params).then(response => {
+                  if (response.retHead.errCode === 0) {
+                    this.msgSuccess("操作成功");
+                    this.modalVisible = false
+                    this.$emit('closecrudmodal', true);
+                  }else{
+                    this.msgError("保存失败，请检查!");
+                  }
+              });
+            }
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+       this.upload.isUploading = true;
+    },
+    // 上传成功处理
+    handleFileSuccess(response, file, fileList){
+       this.fileList = []
+       this.form.productImgs.push(response.retBody)
+       this.upload.isUploading = false;
+    },
+    // 图片删除
+    handelImgRemove(i){
+      this.form.productImgs.splice(i,1)
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closecrudmodal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.hc-box {
+  border: 1px solid #e9e9e9;
+  margin-bottom: 20px;
+  .hc-box-header {
+    height: 40px;
+    line-height: 40px;
+    background: #fafafa;
+    font-weight: bold;
+    color: #333;
+    padding: 0 15px;
+    margin-bottom:20px;
+    .action {
+      margin-left: 10px;
+      color: #304ffe;
+    }
+  }
+  .hc-box-wrap{
+    padding-bottom:30px;
+    .uploadImg{
+      padding:0 30px 30px 30px;
+      .uploadImgList{
+        list-style:none;
+        margin:0;
+        padding:15px 0;
+        display:flex;
+        flex-flow: row;
+        li{
+          position:relative;
+          border:1px solid #ddd;
+          border-radius:6px;
+          width:120px;
+          height:120px;
+          margin-right:13px;
+          img{
+            width:100%;
+            height:100%;
+            border-radius:6px;
+          }
+          .del{
+            display:none;
+            position:absolute;
+            top: -9px;
+            right: -9px;
+            cursor:pointer;
+            i{
+              font-size:20px;
+              color:red;
+            }
+          }
+          &:hover{
+            .del{
+              display:block;
+            }
+          }
+        }
+      }
+    }
+    .productAux{
+      &-error{
+        text-align:center;
+        padding:20px 0px
+      }
+      ul,li{
+        list-style: none;
+        margin:0;
+        padding:0;
+      }
+      li{
+        overflow:hidden;
+        margin-bottom:15px;
+        div{
+          float:left;
+          height:36px;
+        }
+        .title{
+          width:180px;
+          border:1px solid #E6E6E6;
+          margin:0 15px 0 20px;
+          span{
+            display:inline-block;
+            height:100%;
+            line-height:36px;
+            font-size:12px;
+            text-align:center;
+          }
+          .key{
+            width:40%;
+            border-right:1px solid #E6E6E6;
+            background:#FBFBFB;
+          }
+          .value{
+            width:60%;
+          }
+        }
+      }
+    }
+    .relevanceMain{
+      .header{
+        padding:0 20px;
+        margin-bottom:20px;
+        .linkSelected{
+          float:right;
+        }
+      }
+      .container{
+        padding:0 20px;
+      }
+    }
+  }
+}
+</style>

src/views/productManage/productInfo/modal/exportProduch.vue

@@ -0,0 +1,217 @@
+<template>
+  <el-dialog
+    :title="modalTitle"
+    :visible.sync="modalVisible" :width="formLabelWidth" top="2vh" @close="handleCancel">
+    <div class="mobile">
+        <el-form label-width="90px" :model="form" :rules="rules" ref="from" class="from">
+          <el-form-item label="碳汇量:" prop="carbonVal">
+            <el-input type="text" v-model="form.carbonVal" :disabled="true"></el-input>
+          </el-form-item>
+          <el-form-item label="认购期:" prop="goodsSaleDate">
+             <el-date-picker
+                v-model="form.goodsSaleDate"
+                value-format="yyyy-MM-dd HH:mm:ss"
+                type="date"
+                placeholder="选择日期">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="销售方式">
+            <el-radio-group v-model="form.saleType">
+              <el-radio v-for="(item,index) in saleTypeList" :label="item.val">{{item.label}}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="销售价格:" prop="price">
+            <el-input type="number" v-model="form.price"></el-input>
+          </el-form-item>
+          <el-form-item label="商品用途:" prop="goodsUse">
+           <el-checkbox-group v-model="form.goodsUse">
+               <el-checkbox
+                  v-for="(item,index) in goodsUseList"
+                  :label="item.val">{{item.lable}}</el-checkbox>
+           </el-checkbox-group>
+          </el-form-item>
+          <el-form-item label="销售对象:" prop="saleTargets">
+            <el-checkbox-group v-model="form.saleTargets">
+                <el-checkbox
+                   v-for="(item,index) in saleTargetsList"
+                   :label="item.val">{{item.lable}}</el-checkbox>
+            </el-checkbox-group>
+          </el-form-item>
+        </el-form>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { createProduct } from "@/api/productManage/productInfo";
+export default {
+  name: 'addMobiel',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    selectRow: {
+      type: Object,
+      default:null
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalSelectRow: this.selectRow,
+      formLabelWidth: '624px',
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      //验证
+      rules: {
+        carbonVal: [{ required: true, message: '碳汇量不能为空!', trigger: 'blur' }],
+        goodsSaleDate: [{ required: true, message: '认购期不能为空!', trigger: 'blur' }],
+        price: [{ required: true, message: '销售价格不能为空!', trigger: 'blur' }],
+        goodsUse: [{ required: true, message: '商品用途不能为空!', trigger: 'blur' }],
+        saleTargets: [{ required: true, message: '销售对象不能为空!', trigger: 'blur' }]
+      },
+      //销售方式
+      saleTypeList:[
+        {
+          label:"按整体销售",
+          val:1
+        },
+        {
+          label:"按公斤销售",
+          val:2
+        }
+      ],
+      //商品用途
+      goodsUseList:[
+        {
+          lable:'履约',
+          val:1
+        },
+        {
+          lable:'中和',
+          val:2
+        },
+        {
+          lable:'普惠',
+          val:3
+        }
+      ],
+      //销售对象
+      saleTargetsList:[
+        {
+          lable:'自然人',
+          val:'1'
+        },
+        {
+          lable:'履约企业',
+          val:'2'
+        },
+        {
+          lable:'认证企业',
+          val:'3'
+        }
+      ],
+      //表单
+      form: {
+        goodsUse:[],
+        saleTargets:[]
+      }
+    };
+  },
+  created() {
+    this.form.carbonVal = this.modalSelectRow.carbonSink
+    // this.form.productInfoForm = this.modalSelectRow
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        break;
+      default:
+        break;
+    }
+  },
+  methods: {
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let goodsInfoForm = Object.assign({}, this.form);
+          goodsInfoForm.goodsUse = goodsInfoForm.goodsUse.join(";")
+          goodsInfoForm.saleTargets = goodsInfoForm.saleTargets.join(";")
+          let params = {
+            goodsInfoForm:goodsInfoForm,
+            productInfoForm:this.modalSelectRow
+          }
+          createProduct(params).then(response => {
+              if (response.retHead.errCode === 0) {
+                this.msgSuccess("操作成功");
+                this.modalVisible = false
+               	this.$emit('closeexportmodal', true);
+              }
+          });
+        } else {
+          return false;
+        }
+      });
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closeexportmodal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.hc-box {
+  border: 1px solid #e9e9e9;
+  margin-bottom: 20px;
+  .hc-box-header {
+    height: 40px;
+    line-height: 40px;
+    background: #fafafa;
+    font-weight: bold;
+    color: #333;
+    padding: 0 15px;
+    margin-bottom:20px;
+    .action {
+      margin-left: 10px;
+      color: #304ffe;
+    }
+  }
+  .hc-box-wrap{
+    .uploadImg{
+      padding:0 30px 30px 30px;
+    }
+  }
+}
+</style>

src/views/productManage/productInfo/tableHeader.js

@@ -0,0 +1,76 @@
+module.exports = {
+  singleUser:[
+      {
+        fieldKey:'farmerCode',
+        fieldName:'贫困户编号',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'farmerName',
+        fieldName:'归属人姓名',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'familyNum',
+        fieldName:'家庭人数',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'incomeVal',
+        fieldName:'家庭年收入',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'farmerType',
+        fieldName:'归属类型',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'povertyArea',
+        fieldName:'归属区域',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'phone',
+        fieldName:'联系电话',
+        fieldAlign: "center"
+      },
+      {
+        fieldKey:'modifiedUser',
+        fieldName:'银行卡号',
+        fieldAlign: "center"
+      }
+    ],
+  gatherUser:[
+    {
+       fieldKey:'collectiveCode',
+       fieldName:'归属集体编号',
+       fieldAlign: "center"
+    },
+    {
+       fieldKey:'collectiveName',
+       fieldName:'归属集体名称',
+       fieldAlign: "center"
+    },
+    {
+       fieldKey:'collectivePersonNum',
+       fieldName:'关联户数',
+       fieldAlign: "center"
+    },
+    {
+       fieldKey:'orgUnit',
+       fieldName:'集体账户单位',
+       fieldAlign: "center"
+    },
+    {
+       fieldKey:'remark',
+       fieldName:'备注说明',
+       fieldAlign: "center"
+    },
+    {
+       fieldKey:'bankCardNo',
+       fieldName:'银行卡号',
+       fieldAlign: "center"
+    }
+  ]
+}

vue.config.js

@@ -34,7 +34,10 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://172.16.90.102:9098`,
+        // target: `http://172.16.90.94:21998`,
+        // target: `http://bobo.hw.hongweisoft.com/lymcq`,
+        // target: `http://172.16.90.64:21998`,
+        target: `http://172.16.90.102:21998`, //qiubo
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''