集团详情-土地交易

dsk-operate-ui/src/views/detail/groupAccount/component/landtransaction.vue

@@ -11,6 +11,30 @@
       @handle-excel="clickDialog"
       @handle-search="handleSearch"
     >
+      <template slot="slot">
+        <div class="search-box">
+            <span class="search-box-t"
+                  @click="handleSearch1">筛选<i :class="searchState ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i></span>
+          <div v-show="searchState" id="showContent" class="search-main">
+            <div class="item">
+              <span class="wrap_label">供应方式</span>
+              <div class="item_ckquery">
+                <template v-for="(item,index) in supplyLandWayOptions">
+                  <span :class="{color_text:item.value == supplyLandWay}" @click="handleChange('1',item.value)">{{item.value}}</span>
+                </template>
+              </div>
+            </div>
+            <div class="item">
+              <span class="wrap_label">持股比例</span>
+              <div class="item_ckquery">
+                <template v-for="(item,index) in cgblList">
+                  <span :class="{color_text:item.label == cgblName}" @click="handleChange('2',item.label)">{{item.label}}</span>
+                </template>
+              </div>
+            </div>
+          </div>
+        </div>
+      </template>
     </head-form-new>
     <skeleton style="margin-left:16px;" v-if="isSkeleton"></skeleton>
     <tables
@@ -80,13 +104,13 @@
         formData: [
           { type: 7, fieldName: 'area', value: '',props: {multiple: true,value: 'id',expandTrigger: 'hover'}, placeholder: '行政区划', options:[], uid: this.getUid()},
           { type: 4, fieldName: 'landUse', value: '', placeholder: '土地用途', options: [], uid: this.getUid() },
-          { type: 4, fieldName: 'supplyLandWay', value: '', placeholder: '供应方式', options: [], uid: this.getUid() },
+          // { type: 4, fieldName: 'supplyLandWay', value: '', placeholder: '供应方式', options: [], uid: this.getUid() },
           { type: 8, fieldName: 'startAcreageList', value: '', placeholder: '出让面积', options: [], uid: this.getUid()},
-          { type: 1, fieldName: 'StockPercent', value: '', placeholder: '持股比例', options: [], uid: this.getUid()},
+          // { type: 1, fieldName: 'StockPercent', value: '', placeholder: '持股比例', options: [], uid: this.getUid()},
           { type: 9, fieldName: 'money', value: '', placeholder: '成交金额', startMoney: 'startTransactionPrice', endMoney: 'endTransactionPrice',moneyList:[], uid: this.getUid() },
           { type: 5, fieldName: 'time', value: '', placeholder: '合同签订时间', startTime: 'contractSignTimeStart', endTime: 'contractSignTimeEnd',timeList:[],dateTo:this.formatDate(new Date()) , uid: this.getUid()},
+          { type: 0, fieldName: 'penalizeReasonType', value: '', placeholder: '筛选', options: [], uid: this.getUid()},
           { type: 3, fieldName: 'keyword', value: '', placeholder: '输入关键词查询', uid: this.getUid()},
-          // { type: 0, fieldName: 'penalizeReasonType', value: '', placeholder: '筛选', options: [], uid: this.getUid()},
         ],
         acreageOptions: [
           {
@@ -130,6 +154,7 @@
           {name:'招标出让',value:'招标出让'},
           {name:'挂牌出让',value:'挂牌出让'},
         ],
+        supplyLandWay:'',
         tableData:[],
         tableDataTotal:0,
         cgblList:[
@@ -139,6 +164,7 @@
           {value:'5%以上',label:'5%以上'},
           {value:'1%-5%',label:'1%-5%'},
           ],
+        cgblName:'',
         paramsData:{},  //储存组件筛选的条件
         dataEXCEL:{},
         exportData:{
@@ -185,18 +211,28 @@
           exportEXCEL:false,
         },
         timeList: ['不限','近1个月', '近半年', '近1年',  '近3年', '自定义'],
+        searchState:false,
       }
     },
     watch:{
+      searchState:{
+        handler(newVal, olVal) {
+          if (newVal) {
+            setTimeout(() => {
+              document.addEventListener('click', this.handleSearch1);
+            }, 0);
+          } else {
+            document.removeEventListener('click', this.handleSearch1);
+          }
+        }
+      }
     },
     created() {
       this.searchDic()
       this.handleSearch()
       this.dataRegion()
-      this.formData[2].options=this.supplyLandWayOptions;
-      this.formData[3].options=this.acreageOptions;
-      this.formData[4].options=this.cgblList;
-      this.formData[6].timeList=this.timeList;
+      this.formData[2].options=this.acreageOptions;
+      this.formData[4].timeList=this.timeList;
     },
     methods: {
       //土地用途
@@ -213,6 +249,29 @@
         });
 
       },
+      // 筛选
+      handleSearch1(event){
+        // this.searchState=!this.searchState;
+        let dom = document.getElementById("showContent");
+        if(dom){
+          if (!dom.contains(event.target)) {
+            this.searchState = !this.searchState;
+            document.removeEventListener('click', this.handleQuery);
+          }
+        }
+      },
+      handleChange(key,name) {
+        if(key === '1'){
+          this.supplyLandWay = name
+          this.paramsData.supplyLandWay = name
+          this.handleSearch(this.paramsData,1)
+        }
+        if(key === '2'){
+          this.cgblName = name
+          // this.paramsData.StockPercent = name
+          this.handleSearch(this.paramsData,1)
+        }
+      },
       handleSearch(params=[],type){
         let arr = {}
           if(!type){
@@ -234,8 +293,8 @@
         if(arr){
           this.paramsData.landUse = arr.landUse?arr.landUse.toString():''
           this.paramsData.supplyLandWay = arr.supplyLandWay?arr.supplyLandWay.toString():''
-          if (arr.StockPercent) {
-            let StockPercent = parseFloat(arr.StockPercent)
+          if (this.cgblName) {
+            let StockPercent = parseFloat(this.cgblName)
             this.paramsData.minStockPercent = StockPercent / 100
             if (StockPercent == 1) {
               this.paramsData.maxStockPercent = 5 / 100