添加贸易服务

src/components/mapdrag/warehouseReceiptMap.vue

@@ -1,422 +1,160 @@
 <style lang='scss' scoped>
-  .mapContent {
-    position: relative;
-    height: 95%;
-    transition:.5s;
-    .center-add {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      margin: auto;
-      z-index: 999;
-      width: 30px;
-      height: 30px;
-    }
+.mapContent {
+  position: relative;
+  height: 95%;
+  transition: 0.5s;
+  .center-add {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    margin: auto;
+    z-index: 999;
+    width: 30px;
+    height: 30px;
   }
+}
 
-  #mapContainer {
-    width: 100%;
-    height: 100%;
-  }
+#mapContainer {
+  width: 100%;
+  height: 100%;
+}
 </style>
 
 <template>
   <div class="mapContent">
-    <div class="fixed">{{clickData}}</div>
     <div id="mapContainer"></div>
   </div>
 </template>
 
 <script>
-  import {
-    regionData,
-    CodeToText,
-    TextToCode
-  } from 'element-china-area-data'
-  import image from '../../../public/img/ic_locationmarker.jpg'
-  export default {
-    data() {
-      return {
-        clickData:{},
-        map: null,
-        provinces: [],
-        province: '',
-        districts: [],
-        district: '',
-        citys: [],
-        city: '',
-        polygons: [],
-        selectedOptions1: [],
-        areacode: '',
-        address: '',
-        objPoint: [],
-        markers: [],
-        zoomEnable: true,
-        dragEnable: true,
-        status: true,
-        center: '',
-      }
-    },
-    props: ['flagVisible', 'position', 'selectedOptions', 'isShowaddress', 'type'],
-    computed: {
-      showFlag() {
-        return this.flagVisible
-      },
-    },
-    watch: {
-      selectedOptions: {
-        handler(newValue, oldValue) {
-          this.province = CodeToText[newValue[0]]
-          this.selectP(this.province)
-          this.city = CodeToText[newValue[1]]
-          this.selectC(CodeToText[newValue[1]])
-          this.district = newValue[2]
-          this.selectD(this.district)
-        },
-        deep: true
-      }
-    },
-    async created() {
-      // 已载入高德地图API，则直接初始化地图
-      if (window.AMap && window.AMapUI) {
-        this.initMap()
-        // 未载入高德地图API，则先载入API再初始化
-      } else {
-        await remoteLoad(`http://webapi.amap.com/maps?v=1.3&key=${MapKey}`)
-        await remoteLoad('http://webapi.amap.com/ui/1.0/main.js')
-        this.initMap()
-      }
-    },
-    mounted() {
-      // console.log(this)
-      setTimeout(() => {
-        var that = this
-        this.map = new AMap.Map('mapContainer', {
-          resizeEnable: true,
-          zoom: 10,
-          zoomEnable: this.zoomEnable,
-          dragEnable: this.dragEnable,
-        })
-        this.map.on('click', function(e) {
-          // if (this.status) {
-          //   var marker = new AMap.Marker({
-          //     position: new AMap.LngLat(e.lnglat.getLng(), e.lnglat.getLat()), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
-          //   })
-          //   that.map.remove(that.markers)
-          //   that.$emit('marker', e)
-          //   that.markers.push(marker)
-          //   // 将创建的点标记添加到已有的地图实例：
-          //   that.map.add(marker)
-          // }
-        })
-        this.marker = new AMap.Marker({
-          icon: new AMap.Icon({
-            size: new AMap.Size(20, 20),
-            image: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_b.pngimage',
-          }),
-            // icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
-        position: [122.31016,40.670552]
+import { regionData, CodeToText, TextToCode } from 'element-china-area-data'
+import image from '../../../public/img/ic_locationmarker.jpg'
+export default {
+  data() {
+    return {
+      clickData: {},
+      map: null,
+      marker: null,
+      provinces: [],
+      province: '',
+      districts: [],
+      district: '',
+      citys: [],
+      city: '',
+      polygons: [],
+      selectedOptions1: [],
+      areacode: '',
+      address: '',
+      objPoint: [],
+      markers: [],
+      zoomEnable: true,
+      dragEnable: true,
+      status: true,
+      center: ''
+    }
+  },
+  props: [
+    'flagVisible',
+    'position',
+    'selectedOptions',
+    'isShowaddress',
+    'type'
+  ],
+  computed: {},
+  watch: {},
+  async created() {
+    // 已载入高德地图API，则直接初始化地图
+    if (window.AMap && window.AMapUI) {
+      this.initMap()
+      // 未载入高德地图API，则先载入API再初始化
+    } else {
+      // await remoteLoad(`http://webapi.amap.com/maps?v=1.3&key=${MapKey}`)
+      // await remoteLoad('http://webapi.amap.com/ui/1.0/main.js')
+      // this.initMap()
+    }
+  },
+  mounted() {
+    // console.log(this)
+    setTimeout(() => {
+      var that = this
+      this.map = new AMap.Map('mapContainer', {
+        resizeEnable: true,
+        zoom: 5,
+        center:[103.809074,36.051121],
+        zoomEnable: this.zoomEnable,
+        dragEnable: this.dragEnable
+      })
+      this.loadmap()
+    }, 500)
+  },
+  methods: {
+    loadmap(val) {
+      let that = this
+      AMap.plugin(['AMap.DistrictSearch', 'AMap.Polygon'], function() {
+        var geolocation = new AMap.Geolocation({
+          // 是否使用高精度定位，默认：true
+          enableHighAccuracy: true, // 设置定位超时时间，默认：无穷大
+          timeout: 10000, // 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
+          buttonOffset: new AMap.Pixel(10, 20), // 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
+          zoomToAccuracy: true, // 定位按钮的排放位置, RB表示右下
+          buttonPosition: 'RB'
         })
-        AMap.plugin(
-          ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Geocoder', 'AMap.DistrictSearch'],
-          function() {
-            // var autocomplete = new AMap.Autocomplete({
-            //   input: 'searchValue',
-            // })
-            // var placeSearch = new AMap.PlaceSearch({
-            //   city: that.acode,
-            //   citylimit: true,
-            //   pageSize: 1,
-            //   pageIndex: 1,
-            //   map: that.map,
-            // })
-            // var districtSearch = new AMap.DistrictSearch({
-            //   subdistrict: 1,
-            //   level: 'city',
-            //   showbiz: false,
-            // });
-
-            // AMap.event.addListener(autocomplete, 'select', function(e) {
-            //   that.marker.setMap(that.map)
-            //   if (e.poi.location) {
-            //     placeSearch.search() // 关键字查询查询
-            //     that.marker.setPosition(e.poi.location)
-            //     geocoder.getAddress(e.poi.location, function(status, result) {
-            //       console.log(e.poi.location, "klokolkjolk")
-            //       if (status === 'complete') {
-            //         var obj = {}
-            //         that.province = result.regeocode.addressComponent.province
-            //         that.city = result.regeocode.addressComponent.city
-            //         that.district = result.regeocode.addressComponent.district
-            //         obj.formattedAddress = result.regeocode.formattedAddress
-            //         obj.areacode = result.regeocode.addressComponent.adcode
-            //         that.address = result.regeocode.formattedAddress
-            //         obj.lat = e.poi.location.lat
-            //         obj.lng = e.poi.location.lng
-            //         that.$emit('searchAddress', obj)
-            //       } else {
-            //         that.$emit('searchAddress', '')
-            //       }
-            //       that.map.setFitView()
-            //     })
-            //   } else {
-            //     districtSearch.search(e.poi.name, (status, result1) => {
-            //       if (status == 'complete') {
-            //         that.marker.setPosition(result1.districtList[0].center)
-            //         geocoder.getAddress(result1.districtList[0].center, function(status, result) {
-            //           if (status === 'complete') {
-            //             var obj = {}
-            //             that.province = result.regeocode.addressComponent.province
-            //             that.city = result.regeocode.addressComponent.city
-            //             that.district = result.regeocode.addressComponent.district
-            //             obj.formattedAddress = result.regeocode.formattedAddress
-            //             obj.areacode = result.regeocode.addressComponent.adcode
-            //             that.address = result.regeocode.formattedAddress
-            //             obj.lat = result1.districtList[0].center.lat
-            //             obj.lng = result1.districtList[0].center.lng
-            //             that.$emit('searchAddress', obj)
-            //           } else {
-            //             that.$emit('searchAddress', '')
-            //           }
-            //           that.map.setFitView()
-            //         })
-
+        geolocation.getCurrentPosition()
+        AMap.event.addListener(geolocation, 'complete', e => {
+          console.log(e) // 定位成功之后做的事 // 定位成功之后再定位处添加一个marker
+          that.markers = [
+            [122.26399, 40.583527],
+            [122.527662, 40.581441],
+            [122.26811, 40.18498]
+          ]
+          var infoWindow = new AMap.InfoWindow({
+            offset: new AMap.Pixel(0, -30)
+          })
+          function infoOpen(e) {
+            infoWindow.setContent(e.target.content)
+            infoWindow.open(that.map, e.target.getPosition())
+          }
+          function infoClose(e) {
+            infoWindow.close(that.map, e.target.getPosition())
+          }
+              function toGetList(e) {
+            that.$parent.getList(e,1)
+          }
 
-            //       }
-            //     })
-            //   }
-            // })
-            // 经纬度
-            var geocoder = new AMap.Geocoder({
-              radius: 1000,
+          for (let i = 0; i < that.markers.length; i++) {
+            var marker = new AMap.Marker({
+              position: that.markers[i], // （e.position）--->定位点的点坐标, position ---> marker的定位点坐标，也就是marker最终显示在那个点上，
+              icon: '', // marker的图标，可以自定义，不写默认使用高德自带的
+              map: that.map // map ---> 要显示该marker的地图对象
             })
-            // that.map.on('moveend', function(e) {
-            //   //地图变动之后需要重新赋值省市区，未完成
-            //   that.center = that.map.getCenter(); //获取当前地图中心位置
-            //   that.center.lat = Number(that.center.lat.toFixed(3))
-            //   that.center.lng = Number(that.center.lng.toFixed(3))
-            //   that.center.Q = Number(that.center.Q.toFixed(3))
-            //   that.center.R = Number(that.center.R.toFixed(3))
-            //   for (var i = 0, l = that.polygons.length; i < l; i++) {
-            //     that.polygons[i].setMap(null)
-            //   }
-            //   that.marker.setMap(that.map)
-            //   that.marker.setPosition(that.center)
-            //   geocoder.getAddress(that.center, function(status, result) {
-            //     if (status === 'complete') {
-            //       var obj = {}
-            //       that.province = result.regeocode.addressComponent.province
-            //       that.city = result.regeocode.addressComponent.city
-            //       that.district = result.regeocode.addressComponent.district
-            //       obj.formattedAddress = result.regeocode.formattedAddress
-            //       obj.areacode = result.regeocode.addressComponent.adcode
-            //       that.address = result.regeocode.formattedAddress
-            //       obj.lat = that.center.lat
-            //       obj.lng = that.center.lng
-            //       that.$emit('pickedAddress', obj)
-            //     } else {
-            //       that.$emit('pickedAddress', '')
-            //     }
-            //   })
+            // marker.setMap(that.map);
+            // 设置鼠标划过点标记显示的文字提示
+            // marker.setTitle('我是marker的title');
+            marker.content = '<h4>我是第' + (i + 1) + '个</h4>'
+            marker.on('mouseover', infoOpen)
+            marker.on('mouseout', infoClose)
+            marker.on('click',toGetList)
+            // 设置label标签
+            // label默认蓝框白底左上角显示，样式className为：amap-marker-label
+            // marker.setLabel({
+            //     offset: new AMap.Pixel(20, 20),  //设置文本标注偏移量
+            //     content: "<div class='info'>我是 marker 的 label 标签</div>", //设置文本标注内容
+            //     direction: 'right' //设置文本标注方位
             // });
-            // that.map.on('zoomend', function() {
-            //   //地图变动之后需要重新赋值省市区，未完成
-            //   // this.zoom = map.getZoom(); //获取当前地图级别
-            //   that.center = that.map.getCenter(); //获取当前地图中心位置
-            //   that.center.lat = Number(that.center.lat.toFixed(3))
-            //   that.center.lng = Number(that.center.lng.toFixed(3))
-            //   that.center.Q = Number(that.center.Q.toFixed(3))
-            //   that.center.R = Number(that.center.R.toFixed(3))
-            //   for (var i = 0, l = that.polygons.length; i < l; i++) {
-            //     that.polygons[i].setMap(null)
-            //   }
-            //   that.marker.setMap(that.map)
-            //   that.marker.setPosition(that.center)
-            //   geocoder.getAddress(that.center, function(status, result) {
-            //     if (status === 'complete') {
-            //       var obj = {}
-            //       that.province = result.regeocode.addressComponent.province
-            //       that.city = result.regeocode.addressComponent.city
-            //       that.district = result.regeocode.addressComponent.district
-            //       obj.formattedAddress = result.regeocode.formattedAddress
-            //       obj.areacode = result.regeocode.addressComponent.adcode
-            //       that.address = result.regeocode.formattedAddress
-            //       obj.lat = that.center.lat
-            //       obj.lng = that.center.lng
-            //       that.$emit('pickedAddress', obj)
-            //     } else {
-            //       that.$emit('pickedAddress', '')
-            //     }
-            //   })
-            // });
-            that.map.on('click', function (e) {debugger
-              // for (var i = 0, l = that.polygons.length; i < l; i++) {
-              //   that.polygons[i].setMap(null)
-              // }
-              // that.marker.setMap(that.map)
-              // that.marker.setPosition(e.lnglat)
-              geocoder.getAddress(e.lnglat, function (status, result) {
-                if (status === 'complete') {
-                  that.clickData = result
-                  console.log(e.lnglat)
-                  var obj = {}
-                  that.province = result.regeocode.addressComponent.province
-                  that.city = result.regeocode.addressComponent.city
-                  that.district = result.regeocode.addressComponent.district
-                  obj.formattedAddress = result.regeocode.formattedAddress
-                  obj.areacode = result.regeocode.addressComponent.adcode
-                  that.address = result.regeocode.formattedAddress
-                  obj.lat = e.lnglat.lat
-                  obj.lng = e.lnglat.lng
-                  that.$emit('pickedAddress', obj)
-                } else {
-                  that.$emit('pickedAddress', '')
-                }
-              })
-            })
-            // 根据坐标点定位,获取地址的详细信息
-            if (that.position) {
-              that.marker.setMap(that.map)
-              that.marker.setPosition(that.position)
-              geocoder.getAddress(that.position, function(status, result) {
-                if (status === 'complete') {
-                  var obj = {}
-                  obj.formattedAddress = result.regeocode.formattedAddress
-                  obj.areacode = result.regeocode.addressComponent.adcode
-                  that.address = result.regeocode.formattedAddress
-                  that.$emit('positionAddress', obj)
-                  that.province = result.regeocode.addressComponent.province
-                  that.city = result.regeocode.addressComponent.city
-                  that.district = result.regeocode.addressComponent.district
-                }
-              })
-              that.map.setFitView()
-            } else {
-              return false
-            }
           }
-        )
-      }, 500)
-      this.loadmap()
-    },
-    methods: {
-      positions() {
-        this.status = false
-        var status = {
-          zoomEnable: false,
-          dragEnable: false,
-        }
-        this.map.setStatus(status)
-        this.loadmap()
-        let _data = []
-        _data.push(this.province)
-        _data.push(this.city)
-        _data.push(this.district)
-        _data.push(this.address)
-        _data.push(this.type)
-        this.$emit('addressListen', _data)
-      },
-      anewselect() {
-        this.status = true
-        var status = {
-          zoomEnable: true,
-          dragEnable: true,
-        }
-        this.map.setStatus(status)
-        this.loadmap()
-      },
-      loadmap(val) {
-        let params = val
-        var that = this // 插件
-        for (var j = 0, k = that.polygons.length; j < k; j++) {
-          that.polygons[j].setMap(null)
-        }
-        AMap.plugin(['AMap.DistrictSearch', 'AMap.Polygon'], function() {
-          // 标注
-          var opts = {
-            subdistrict: 1,
-            extensions: 'all',
-            showbiz: false,
-          }
-          var district = new AMap.DistrictSearch(opts) // 注意：需要使用插件同步下发功能才能这样直接使用
-          function getData(data) {
-            console.log(data)
-            that.$emit('selectedAddress', data)
-            // 清除地图上的所有覆盖物
-            that.areacode = data.citycode
-            var bounds = data.boundaries
-            if (data.level === 'country') {
-              that.provinces = data.districtList
-              that.citys = []
-              that.districts = []
-            } else if (data.level === 'province') {
-              that.map.remove(that.marker)
-              that.citys = data.districtList
-              that.districts = []
-              that.address = ''
-            } else if (data.level === 'city') {
-              that.districts = data.districtList
-            }
-            if (data.level === 'country' && bounds) {
-              return false
-            } else {
-              for (var i = 0, l = bounds.length; i < l; i++) {
-                var polygon = new AMap.Polygon({
-                  map: that.map,
-                  strokeWeight: 1,
-                  strokeColor: '#CC66CC',
-                  fillColor: '#CCF3FF',
-                  fillOpacity: 0.5,
-                  path: bounds[i],
-                })
-                that.polygons.push(polygon)
-              }
-              that.map.setFitView()
-            }
-          }
-          let sear = val ? params : '中国'
-          district.search(sear, function(status, result) {
-            if (status === 'complete') {
-              getData(result.districtList[0])
-            }
-          })
+          // var marker = new AMap.Marker({
+          //   position: e.position, // （e.position）--->定位点的点坐标, position ---> marker的定位点坐标，也就是marker最终显示在那个点上，
+          //   icon: '', // marker的图标，可以自定义，不写默认使用高德自带的
+          //   map: that.map // map ---> 要显示该marker的地图对象
+          // })
         })
-      },
-      selectP(val) {
-        this.province = CodeToText[val]
-        if (this.status) {
-          this.$emit('provinceChange', val)
-          this.loadmap(val)
-          this.city = ''
-          this.district = ''
-        }
-      },
-      selectC(val) {
-        console.log(val)
-        if (this.status) {
-          this.loadmap(val)
-          this.district = ''
-        }
-      },
-      selectD(val) {
-        this.district = CodeToText[val]
-        if (this.status) {
-          this.loadmap(val)
-        }
-      },
-      submit() {
-        let _data = []
-        _data.push(this.province)
-        _data.push(this.city)
-        _data.push(this.district)
-        _data.push(this.address)
-        _data.push(this.type)
-        this.$emit('addressListen', _data)
-        this.$parent.blurMap()
-        console.log("submit")
-      }
-    },
+        AMap.event.addListener(geolocation, 'error', e => {
+          console.log(e) // 定位失败做的事
+        })
+      })
+    }
   }
+}
 </script>

src/views/tradeServicesManagement/warehouseReceiptRegulation.vue

@@ -6,215 +6,237 @@
       <div class="bottom-content">
         <div class="bottom-item" @click="startHacking">查看申请记录</div>
         <div class="bottom-item">》》</div>
-        <el-checkbox v-model="checked" class="bottom-item">默认地图</el-checkbox>
+        <el-radio class="bottom-item" v-model="radio" label="1" @change="selectShowType">默认地图</el-radio>
       </div>
     </div>
     <div class="top">
       <div class="top-content">
         <div class="top-item" @click="startHacking1">查看地图</div>
         <div class="top-item">》》</div>
-        <el-checkbox v-model="checked" class="top-item">默认列表</el-checkbox>
+        <el-radio class="top-item" v-model="radio" label="2" @change="selectShowType">默认列表</el-radio>
       </div>
     </div>
-    <!-- <el-table :data="tableData" class="content2">
-      <el-table-column prop="date" label="日期" width="140"></el-table-column>
-      <el-table-column prop="name" label="姓名" width="120"></el-table-column>
-      <el-table-column prop="address" label="地址"></el-table-column>
-    </el-table>-->
     <div class="content2">
       <div class="header">
-        <el-button type="primary">全部</el-button>
-        <el-button type="primary">待审核</el-button>
-        <el-button type="primary">待审批</el-button>
-        <el-button type="primary">待还</el-button>
-        <el-button type="primary">已还</el-button>
-        <el-input placeholder="可按业务编号、合同编号、仓库名查找" class="search-input"></el-input>
-        <el-button type="primary">查找</el-button>
+        <el-button type="" :type="searchType == 1 ? 'primary' : ''" @click="handlestatus(1)">全部</el-button>
+        <el-button type="" :type="searchType == 2 ? 'primary' : ''" @click="handlestatus(2)">待审核</el-button>
+        <el-button type="" :type="searchType == 3 ? 'primary' : ''" @click="handlestatus(3)">待审批</el-button>
+        <el-button type="" :type="searchType == 4 ? 'primary' : ''" @click="handlestatus(4)">待还</el-button>
+        <el-button type="" :type="searchType == 5 ? 'primary' : ''" @click="handlestatus(5)">已还</el-button>
+        <el-input placeholder="可按业务编号、合同编号、仓库名查找" class="search-input" v-model="searchKeyWord"></el-input>
+        <el-button type="primary" @click='findList'>查找</el-button>
         <el-button type="primary" class="add" @click="add">添加</el-button>
       </div>
-      <el-table
-        :data="customertList"
-        style="width: 100%; margin-top: 20px"
-        ref="customertList"
-        border
-        height="600"
-      >
+      <el-table :data="tradeServicesList" style="width: 100%; margin-top: 20px" ref="tradeServicesList" border
+        height="calc(100% - 90px)">
         <el-table-column type="index" label="序号">
           <template scope="scope">
             <span v-if="scope.$index < 9">0{{ scope.$index + 1 }}</span>
             <span v-else>{{ scope.$index + 1 }}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="customerName" label="业务编号"></el-table-column>
-        <el-table-column prop="customerPhone" label="合同编号"></el-table-column>
-        <el-table-column prop="bankCard" label="仓库名"></el-table-column>
-        <el-table-column prop="bankDeposit" label="仓位号">
+        <el-table-column prop="authenticationStatus" label="业务编号"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="合同编号"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="仓库名"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="仓位号">
           <!-- <template slot-scope="scope">
             <div>{{scope.row.bankDeposit}}-{{scope.row.bankDepositBranch}}</div>
           </template> -->
         </el-table-column>
-        <el-table-column prop="payeeName" label="货名"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="货名"></el-table-column>
         <el-table-column prop="authenticationStatus" label="重量（吨）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="单价（元/吨）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="总价值（元）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="发放金额（元）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="应还金额（元）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="已还金额（元）"></el-table-column>
-		<el-table-column prop="authenticationStatus" label="待还金额（元）"></el-table-column>
-		 <el-table-column prop="bankDeposit" label="状态">
+        <el-table-column prop="authenticationStatus" label="单价（元/吨）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="总价值（元）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="发放金额（元）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="应还金额（元）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="已还金额（元）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="待还金额（元）"></el-table-column>
+        <el-table-column prop="authenticationStatus" label="状态">
           <!-- <template slot-scope="scope">
             <div>{{scope.row.bankDeposit}}-{{scope.row.bankDepositBranch}}</div>
           </template> -->
         </el-table-column>
-        <el-table-column prop="address" label="操作">
+        <el-table-column prop="address" label="操作" width="430">
           <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="createCustomer(scope.row, 2)"
-              v-show="scope.row.authenticationStatus!='已删除'"
-            >查看</el-button>
-			 <el-button
-              size="mini"
-              @click="createCustomer(scope.row, 2)"
-              v-show="scope.row.authenticationStatus!='已删除'"
-            >审核</el-button>
-			 <el-button
-              size="mini"
-              @click="createCustomer(scope.row, 2)"
-              v-show="scope.row.authenticationStatus!='已删除'"
-            >审批</el-button>
-			 <el-button
-              size="mini"
-              @click="createCustomer(scope.row, 2)"
-              v-show="scope.row.authenticationStatus!='已删除'"
-            >还款</el-button>
-            <el-button
-              size="mini"
-              @click="createCustomer(scope.row, 3)"
-              v-show="scope.row.authenticationStatus!='已删除'"
-              :disabled="!scope.row.isEdit"
-            >修改</el-button>
-            <el-button size="mini" type="danger" @click="handleDelete(scope.row, '')">删除</el-button>
+            <el-button size="mini" @click="lookBtnClick(scope.row, 2)" v-show="scope.row.authenticationStatus!='已删除'">
+              查看</el-button>
+            <el-button size="mini" @click="toExamineBtnClick(scope.row, 2)"
+              v-show="scope.row.authenticationStatus!='已删除'">
+              审核</el-button>
+            <el-button size="mini" @click="approveBtnClick(scope.row, 2)"
+              v-show="scope.row.authenticationStatus!='已删除'">
+              审批</el-button>
+            <el-button size="mini" @click="repaymentBtnClick(scope.row, 2)"
+              v-show="scope.row.authenticationStatus!='已删除'">
+              还款</el-button>
+            <el-button size="mini" @click="rowEditBtnClick(scope.row, 3)"
+              v-show="scope.row.authenticationStatus!='已删除'">修改</el-button>
+            <el-button size="mini" type="danger" @click="rowDeleteBtnClick(scope.row, '')">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
-	   <div class="paging">
-        <el-pagination
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          :page-size="deptCircularPage.pageSize"
-          layout="total, sizes, prev, pager, next, jumper"
-          :total="deptBudgetTotal"
-        ></el-pagination>
+      <div class="paging">
+        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
+          :page-size="deptCircularPage.pageSize" layout="total, sizes, prev, pager, next, jumper"
+          :total="deptBudgetTotal"></el-pagination>
       </div>
     </div>
   </div>
 </template>
 <script>
-import mapDrag from '@/components/mapdrag/warehouseReceiptMap'
-import { getList } from '@/model/tradeServicesManagement/index'
-export default {
-  components: { mapDrag },
-  data() {
-    const item = {
-      date: '2016-05-02',
-      name: '王小虎',
-      address: '上海市普陀区金沙江路 1518 弄'
-    }
-    return {
-      tableData: Array(20).fill(item),
-      isActive: false,
-      checked: true,
-	  customertList: [],
-	  currentPage: 1,
-      pageSize: 10,
-      deptBudgetTotal: 0,
-      deptCircularPage: {},
-    }
-  },
-  activated() {},
-  beforeCreate() {
-    document.querySelector('body').setAttribute('style', 'overflow:hidden;')
-  },
-  mounted() {
-    let height = document.body.offsetHeight - 57
-    document
-      .querySelector('.container')
-      .setAttribute('style', 'height:' + height + 'px;')
-    console.log('高度', height)
-  },
-  methods: {
-	     handleSizeChange(val) {
-      console.log(`每页 ${val} 条`)
-      this.pageSize = val
-      this.getList()
+  import mapDrag from '@/components/mapdrag/warehouseReceiptMap'
+  import {
+    getList
+  } from '@/model/tradeServicesManagement/index'
+  export default {
+    components: {
+      mapDrag
     },
-    handleCurrentChange(val) {
-      this.currentPage = val
-      console.log(`当前页: ${val}`)
-      this.getList()
+    data() {
+      return {
+        searchVal: '',
+        searchKeyWord: '',
+        isActive: false,
+        radio: '1',
+        tradeServicesList: [],
+        currentPage: 1,
+        pageSize: 10,
+        deptBudgetTotal: 0,
+        deptCircularPage: {},
+        searchType: '1',
+      }
     },
-    startHacking() {
-      this.isActive = true
+    activated() {},
+    beforeCreate() {
+      document.querySelector('body').setAttribute('style', 'overflow:hidden;')
     },
-    startHacking1() {
-      this.isActive = false
+    mounted() {
+      let height = document.body.offsetHeight - 57
+      document.querySelector('.container').setAttribute('style', 'height:' + height + 'px;')
+      let _showPage = sessionStorage.getItem('warehouseReceiptRegulation_selectShowType')
+      if (_showPage == "1") {
+        this.radio = '1'
+        this.isActive = false
+      } else if (_showPage == "2") {
+        this.radio = '2'
+        this.isActive = true
+      } else {
+        this.radio = '1'
+        this.isActive = false
+      }
+      // this.getList()
+      this.tradeServicesList = [{
+        authenticationStatus: 'test'
+      }]
     },
-    add() {}
+    methods: {
+      findList() {
+        // this.currentPage:=1
+        // this.pageSize=10
+        // this.getList()
+      },
+      handlestatus(status) {
+        this.searchType = status
+        // this.currentPage:=1
+        // this.pageSize=10
+        // this.getList()
+      },
+      lookBtnClick(val1, val2) {},
+      toExamineBtnClick(val1, val2) {},
+      approveBtnClick(val1, val2) {},
+      repaymentBtnClick(val1, val2) {},
+      rowEditBtnClick(val1, val2) {},
+      rowDeleteBtnClick(val1, val2) {},
+      handleSizeChange(val) {
+        console.log(`每页 ${val} 条`)
+        this.pageSize = val
+        this.getList()
+      },
+      handleCurrentChange(val) {
+        this.currentPage = val
+        console.log(`当前页: ${val}`)
+        this.getList()
+      },
+      startHacking() {
+        this.isActive = true
+      },
+      startHacking1() {
+        this.isActive = false
+      },
+      add() {},
+      getList(e, type) {
+        if (type == 1) {
+          this.isActive = true
+        }
+        getList({
+            compId: sessionStorage.getItem('ws-pf_compId'),
+            currentPage: this.currentPage,
+            pageSize: this.pageSize,
+            searchType: this.searchType,
+            searchKeyWord: this.searchKeyWord,
+          })
+          .toPromise()
+          .then((response) => {
+            console.log('列表数据', response)
+          })
+      },
+      selectShowType(e) {
+        this.activated = !this.activated;
+        sessionStorage.setItem('warehouseReceiptRegulation_selectShowType', e)
+      }
+    }
   }
-}
 </script>
-<style lang="scss">
-.container {
-}
-.active {
-  height: 0 !important;
-  overflow: hidden;
-}
-.bottom {
-  display: flex;
-  justify-items: flex-end;
-  height: 5%;
-  align-content: center;
-  .bottom-content {
-    display: flex;
-    justify-content: flex-end;
-    width: 100%;
-  }
-  .bottom-item {
-    display: flex;
-    align-items: center;
+<style lang="scss" scoped>
+  .container {}
+
+  .active {
+    height: 0 !important;
+    overflow: hidden;
   }
-}
-.top {
-  display: flex;
-  justify-items: flex-end;
-  height: 5%;
-  align-content: center;
-  .top-content {
+
+  .bottom,.top {
     display: flex;
-    justify-content: flex-end;
-    width: 100%;
-  }
-  .top-item {
-    display: flex;
-    align-items: center;
+    justify-items: flex-end;
+    height: 5%;
+    align-content: center;
+
+    .bottom-content,.top-content  {
+      display: flex;
+      justify-content: flex-end;
+      width: 100%;
+      padding-right: 25px;
+    }
+
+    .bottom-item,.top-item {
+      display: flex;
+      align-items: center;
+    }
   }
-}
-.content2 {
-  background: pink;
-  padding: 20px;
-  .header{
-	  position: relative;
-	  .add{
-		  position: absolute;
-		  right: 0;
-	  }
+
+
+  .content2 {
+    background: pink;
+    padding: 20px;
+    height: calc(100% - 44px);
+
+    .header {
+      position: relative;
+
+      .add {
+        position: absolute;
+        right: 0;
+      }
+    }
+
+    .search-input {
+      width: 300px;
+      margin-left: 10px;
+    }
   }
-  .search-input {
-	width: 300px;
-	margin-left: 10px;
+
+  .paging {
+    margin-top: 10px;
+    text-align: center;
   }
-}
-</style>
+</style>