From 548b97b82e741b67c4258661352ae28462a34f66 Mon Sep 17 00:00:00 2001
From: 付延余 <f-yanyu@outlook.com>
Date: 星期四, 28 七月 2022 19:00:58 +0800
Subject: [PATCH] editDetails

---
 pages/my-have-todo/my-have-todo.vue | 1002 ++++++++++++++++++++++++++++++++++++----------------------
 1 files changed, 614 insertions(+), 388 deletions(-)

diff --git a/pages/my-have-todo/my-have-todo.vue b/pages/my-have-todo/my-have-todo.vue
index ab81089..445a07c 100644
--- a/pages/my-have-todo/my-have-todo.vue
+++ b/pages/my-have-todo/my-have-todo.vue
@@ -1,409 +1,635 @@
 <template>
-	<view class="my-have-todo">
-		<!-- 鎼滅储鍖哄煙 -->
-		<view class="searchBox">
-			<view class="search">
-				<u-search @clickIcon="searchIconClick" :clearabled="false" :showAction="false" placeholder="璇疯緭鍏ユ爣棰�" v-model="searchData" shape="square"></u-search>
-			</view>
-			<!-- 鐘舵�侀�夋嫨鍣� -->
-			<view class="data-selet" @click="statusSeletShow = true">
-				<view class="content">
-					<text>{{ dataSeletText }}</text>
-				</view>
-				<view class="uni-select__icon"><image src="@/static/icon/select.png" mode="鍔犺浇澶辫触"></image></view>
-			</view>
-		</view>
+  <view class="my-have-todo">
+    <!-- 鎼滅储鍖哄煙 -->
+    <view class="searchContainer">
 
-		<!-- 鏃堕棿鎼滅储鍖哄煙 -->
-		<view class="timeContiner">
-			<uni-datetime-picker class="time-picker" type="date" :clear-icon="false" v-model="createTime" @change="startDateChange" placeholder="寮�濮嬫椂闂�" />
-			<uni-datetime-picker class="time-picker" type="date" :clear-icon="false" v-model="endTime" @change="endDateChange" placeholder="缁撴潫鏃堕棿" />
-		</view>
+      <u-collapse :border="true"
+                  @change="searchChange"
+                  @close="searchClose"
+                  @open="searchOpen"
+      >
+        <u-collapse-item :border="false"
+                         title="鎼滅储妗�"
+                         name="Docs guide"
+        >
+          <view class="searchBox">
+            <view class="search">
+              <u-search :clearabled="true" :showAction="false" placeholder="璇疯緭鍏ユ爣棰�" v-model="haveTodoParams.title"
+                        shape="square"></u-search>
+            </view>
+            <!-- 鐘舵�侀�夋嫨鍣� -->
+            <!-- <view class="data-selet" @click="statusSeletShow = true">
+              <view class="content">
+                <text>{{ dataSeletText }}</text>
+              </view>
+              <view class="uni-select__icon"><image src="@/static/icon/select.png" mode="鍔犺浇澶辫触"></image></view>
+            </view> -->
+            <view class="search">
+              <u-search :clearabled="true" :showAction="false" placeholder="璇疯緭鍏ヤ换鍔″悕绉�" v-model="haveTodoParams.name"
+                        shape="square"></u-search>
+            </view>
+          </view>
 
-		<!-- 鎴戠殑宸插姙鍗$墖鍖哄煙 -->
-		<u-checkbox-group v-model="checkBoxValue" placement="column" @change="checkboxChange" style="margin-bottom:50px">
-		<combination-card v-for="(item, index) in yibanData" index="index">
-			<template v-slot:top>
-				<u-checkbox size="35" :key="item.id" :name="item.id"></u-checkbox>
-				<view>
-					<text>{{ item.actBusiness.title }}</text>
-				</view>
-			</template>
-			<template v-slot:center>
-				<view class="center-container">
-					<view class="center-content__one center-margin">
-						<view>
-							<text>浠诲姟鍚嶇О锛歿{ item.name }}</text>
-						</view>
-						<view>
-							<text>鎵�灞炴祦绋嬶細{{ item.processName }}</text>
-						</view>
-					</view>
-					<view class="center-content__two center-margin">
-						<view>
-							<text>鍙戣捣浜猴細{{ item.actBusiness.createByName }}</text>
-						</view>
-						<view>
-							<text>瀹℃壒鎿嶄綔锛歿{ item.deleteReason }}</text>
-						</view>
-					</view>
-					<view class="center-content__three center-margin">
-						<view class="">
-							<text>瀹℃壒鎰忚锛歿{ item.comment }}</text>
-						</view>
-						<view class="">
-							<text>鑰楁椂锛歿{
-									item.duration >= 86400000
-										? parseInt(item.duration / 86400000 + '澶�' + parseInt(item.duration % 86400000) / 3600000 + '鏃�' + parseInt(item.duration % 3600000) / 60000 + '鍒�')
-										: item.duration >= 3600000
-										? parseInt(item.duration / 3600000) + '鏃�' + parseInt(item.duration / 3600000 % 3600000)  + '鍒�'
-										: parseInt(item.duration / 60000) + '鍒�'
-								}}</text>
-						</view>
-					</view>
-					<view class="center-content__four">
-						<text>鍒涘缓鏃堕棿锛歿{ item.createTime }}</text>
-					</view>
-				</view>
-			</template>
-			<template v-slot:bottom>
-				<view class="bottom-container">
-					<!-- 宸插姙鎸夐挳 -->
-					<view class="bottom-content__item">
-						<view @click="theFormDataClick">
-							<image src="@/static/home/biaodan.png" mode=""></image>
-							<view>琛ㄥ崟鏁版嵁</view>
-						</view>
-						<view @click="approvalHistoryClick">
-							<image src="@/static/home/history.png" mode=""></image>
-							<view>瀹℃壒鍘嗗彶</view>
-						</view>
-						<view @click="deleteApplicationClick(item.id)">
-							<image src="@/static/home/delete.png" mode=""></image>
-							<view>鍒犻櫎</view>
-						</view>
-					</view>
-				</view>
-			</template>
-		</combination-card>
-		</u-checkbox-group>
+          <!-- 鏃堕棿鎼滅储鍖哄煙 -->
+          <view class="timeContiner">
+            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="haveTodoParams.startDate"
+                                 @change="startDateChange" placeholder="寮�濮嬫椂闂�"/>
+            <uni-datetime-picker class="time-picker" type="date" :clear-icon="true" v-model="haveTodoParams.endDate"
+                                 @change="endDateChange" placeholder="缁撴潫鏃堕棿"/>
+          </view>
 
-		<!-- 搴曢儴鍏ㄩ�� -->
-		<view class="bottomTabbar">
-			<view class="bottomTabbar_checkBox">
-				<u-checkbox-group size="35" v-model="totalSelectValue" placement="column" @change="totalSelectChange"><u-checkbox labelSize="13px" label="鍏ㄩ��" name="tatalSelect"></u-checkbox></u-checkbox-group>
-			</view>
-			<view class="bottomTabbar_button">
-				<u-button :plain="true" type="primary"  text="鎵归噺鍒犻櫎" @click="deleteApplicationClick()"></u-button>
-			</view>
-		</view>
-		
-		<!-- 鍒犻櫎宸插姙鐢宠妯℃�佹 -->
-		<view class="deleteApplicationModal">
-			<u-modal
-				:show="deleteApplicationModalShow"
-				title="鎻愮ず"
-				content="纭畾鍒犻櫎閫夋嫨鐢宠锛�"
-				:showCancelButton="true"
-				@confirm="deleteApplicationModalConfirm"
-				@cancel="deleteApplicationModalCancel"
-			></u-modal>
-		</view>
+          <view class="searchButton">
+            <u-button type="primary" text="鎼滅储" @click="searchButtonClick"></u-button>
+            <u-button type="primary" :plain="true" text="娓呯┖" @click="emptyButtonClick"></u-button>
+          </view>
 
-		<!-- 閫夋嫨鍣� -->
-		<u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker>
-		
-		<!-- 鑿滃崟鏍� -->
-		<popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
-	</view>
+        </u-collapse-item>
+      </u-collapse>
+    </view>
+    <!-- 鎴戠殑宸插姙鍗$墖鍖哄煙 -->
+    <u-checkbox-group v-model="checkBoxValue" placement="column" @change="checkboxChange" style="margin-bottom:50px">
+      <combination-card v-for="(item, index) in yibanData" index="index">
+        <template v-slot:top>
+          <u-checkbox size="35" :key="item.id" :name="item.id"></u-checkbox>
+          <view>
+            <text>{{ item.actBusiness.title }}</text>
+          </view>
+        </template>
+        <template v-slot:center>
+          <view class="center-container">
+            <view class="center-content__one center-margin">
+              <view>
+                <text>浠诲姟鍚嶇О锛歿{ item.name }}</text>
+              </view>
+              <view>
+                <text>鎵�灞炴祦绋嬶細{{ item.processName }}</text>
+              </view>
+            </view>
+            <view class="center-content__two center-margin">
+              <view>
+                <text>鍙戣捣浜猴細{{ item.actBusiness.createByName }}</text>
+              </view>
+              <view>
+                <text>瀹℃壒鎿嶄綔锛歿{ item.deleteReason }}</text>
+              </view>
+            </view>
+            <view class="center-content__three center-margin">
+              <view class="">
+                <text>瀹℃壒鎰忚锛歿{ item.comment }}</text>
+              </view>
+              <view class="">
+                <text>鑰楁椂锛歿{
+                    item.duration >= 86400000
+                        ? parseInt(item.duration / 86400000 + '澶�' + parseInt(item.duration % 86400000) / 3600000 + '鏃�' + parseInt(item.duration % 3600000) / 60000 + '鍒�')
+                        : item.duration >= 3600000
+                        ? parseInt(item.duration / 3600000) + '鏃�' + parseInt(item.duration / 3600000 % 3600000) + '鍒�'
+                        : parseInt(item.duration / 60000) + '鍒�'
+                  }}
+                </text>
+              </view>
+            </view>
+            <view class="center-content__four">
+              <text>鍒涘缓鏃堕棿锛歿{ item.createTime }}</text>
+            </view>
+          </view>
+        </template>
+        <template v-slot:bottom>
+          <view class="bottom-container">
+            <!-- 宸插姙鎸夐挳 -->
+            <view class="bottom-content__item">
+              <view @click="theFormDataClick(item.tableId)" v-if="item.procDefId == 'WAY_BILL:4:87504'">
+                <image src="@/static/home/biaodan.png" mode=""></image>
+                <view>鐢宠璇︽儏</view>
+              </view>
+              <view @click="approvalHistoryClick(item.procInstId)">
+                <image src="@/static/home/history.png" mode=""></image>
+                <view>瀹℃壒鍘嗗彶</view>
+              </view>
+              <view @click="deleteApplicationClick(item.id)">
+                <image src="@/static/home/delete.png" mode=""></image>
+                <view>鍒犻櫎</view>
+              </view>
+            </view>
+          </view>
+        </template>
+      </combination-card>
+    </u-checkbox-group>
+
+    <!-- 搴曢儴鍏ㄩ�� -->
+    <view class="bottomTabbar">
+      <view class="bottomTabbar_checkBox">
+        <u-checkbox-group size="35" v-model="totalSelectValue" placement="column" @change="totalSelectChange">
+          <u-checkbox labelSize="13px" label="鍏ㄩ��" name="tatalSelect"></u-checkbox>
+        </u-checkbox-group>
+      </view>
+      <view class="bottomTabbar_button">
+        <u-button :plain="true" type="primary" text="鎵归噺鍒犻櫎" @click="deleteApplicationClickAll()"></u-button>
+      </view>
+    </view>
+
+    <!-- 鍒犻櫎宸插姙鐢宠妯℃�佹 -->
+    <view class="deleteApplicationModal">
+      <u-modal
+          :show="deleteApplicationModalShow"
+          title="鎻愮ず"
+          content="纭畾鍒犻櫎閫夋嫨鐢宠锛�"
+          :showCancelButton="true"
+          @confirm="deleteApplicationModalConfirm"
+          @cancel="deleteApplicationModalCancel"
+      ></u-modal>
+    </view>
+
+    <!-- 閫夋嫨鍣� -->
+    <!-- <u-picker @cancel="statusSeletShow = false" @confirm="statusConfirm" :show="statusSeletShow" :columns="statusList"></u-picker> -->
+
+    <!--杩斿洖椤堕儴-->
+    <u-back-top :scroll-top="scrollTop"></u-back-top>
+
+    <!-- 鑿滃崟鏍� -->
+    <popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
+  </view>
 </template>
 
 <script>
 import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
 import combinationCard from '@/components/common/combination-card/combination-card.vue';
+
 export default {
-	data() {
-		return {
-			// 鏉′欢鎼滅储
-			searchData: '',
-			dataSeletText: '璇烽�夋嫨鐘舵��',
-			// 鏃堕棿閫夋嫨
-			createTime: '',
-			endTime: '',
-			// 澶嶉�夋
-			checkBoxValue:[],
-			totalSelectValue:[],
-			// 閫夋嫨鍣�
-			statusSeletShow: false,
-			statusList: [['涓浗', '缇庡浗', '鏃ユ湰']],
-			deleteApplicationModalShow:false,
-			yibanData: []
-		};
-	},
-	onShow(){
-		if(this.menuShow == true){
-			this.$refs.menuRef.menuClick()
-		}
-		this.init();
-	},
-	// 鐐瑰嚮瀵艰埅鏍忚彍鍗曞悗
-	onNavigationBarButtonTap(e) {
-		// console.log(e);
-		this.$refs.menuRef.menuClick()
-	},
-	components: {
-		combinationCard,
-		popupMenu
-	},
-	methods: {
-		init(){
-			this.doneList();
-		},
-		// 宸插姙
-		doneList() {
-			this.$reqGet('doneList', this.haveTodoParams).then(res => {
-				if (res.code === 0) {
-					// console.log('宸插姙', res);
-					this.yibanData = res.data.content;
-				}
-			});
-		},
-		menushow(e){
-			this.menuShow = e
-		},
-		deleteApplicationClick(id){
-			if(this.checkBoxValue.length > 0){
-				this.deleteApplicationModalShow = true;
-			}
-		},
-		// 鍒犻櫎鐢宠妯℃�佹
-		deleteApplicationModalConfirm() {
-			this.deleteApplicationModalShow = false;
-		},
-		deleteApplicationModalCancel() {
-			this.deleteApplicationModalShow = false;
-		},
-		// 鏃堕棿閫夋嫨鍣�
-		startDateChange() {
-			this.queryRealTimeShippingData.startDate = '';
-			this.$nextTick(() => {
-				console.log(this.queryRealTimeShippingData);
-				this.realTimeShipping();
-			});
-		},
-		endDateChange() {
-			this.queryRealTimeShippingData.endDate = '';
-			this.$nextTick(() => {
-				console.log(this.queryRealTimeShippingData);
-				this.realTimeShipping();
-			});
-		},
-		// 鎼滅储
-		searchIconClick() {
-			console.log(1111, this.searchData);
-		},
-		// 澶嶉�夋
-		checkboxChange(n){
-			console.log(n);
-		},
-		totalSelectChange(n){
-			if(n[0] == 'tatalSelect'){
-				this.yibanData.forEach(item=>{
-					this.totalSelectValue.push(item.id)
-				})
-				this.checkBoxValue = this.totalSelectValue
-			}else{
-				this.checkBoxValue = []
-			}
-		},
-		// 鐘舵��
-		statusConfirm(a){
-			this.statusSeletShow = false
-			console.log(a)
-		},
-		// 琛ㄥ崟鏁版嵁
-		theFormDataClick() {
-			uni.navigateTo({
-				url: '/pages/the-form-data/the-form-data'
-			});
-		},
-		// 瀹℃壒鍘嗗彶
-		approvalHistoryClick() {
-			uni.navigateTo({
-				url: '/pages/approval-history/approval-history'
-			});
-		}
-	}
+  data() {
+    return {
+      scrollTop: 0,
+      // 鏉′欢鎼滅储
+      // searchData: '',
+      // dataSeletText: '璇烽�夋嫨鐘舵��',
+      // 鏃堕棿閫夋嫨
+      // createTime: '',
+      // endTime: '',
+      // 澶嶉�夋
+      checkBoxValue: [],
+      totalSelectValue: [],
+      // 閫夋嫨鍣�
+      // statusSeletShow: false,
+      // statusList: [['涓浗', '缇庡浗', '鏃ユ湰']],
+      yibanData: [],
+      // 鍒犻櫎鐢宠
+      deleteIds: '',
+      deleteApplicationModalShow: false,
+      haveTodoParams: {
+        name: '',
+        pageNumber: 1,
+        pageSize: 10,
+        sort: 'createTime',
+        order: 'desc',
+        title: '',
+        startDate: '',
+        endDate: ''
+      },
+      // 涓婃媺鍔犺浇鏇村
+      timer: {},
+      load: 0,
+      loadingText: '鍔犺浇涓�...',
+      loadingType: 0,
+      contentText: {
+        contentDown: '涓婃媺鏄剧ず鏇村',
+        contentRefresh: '姝e湪鍔犺浇...',
+        contentNomore: '娌℃湁鏇村鏁版嵁浜�'
+      }
+    };
+  },
+  // 涓婃媺鍔犺浇鏇村
+  onReachBottom() {
+    if (this.timer != null) {
+      clearTimeout(this.timer);
+    }
+    this.timer = setTimeout(() => {
+      this.getMoreNews();
+    }, 1000);
+  },
+  // 杩斿洖椤堕儴
+  onPageScroll(e) {
+    this.scrollTop = e.scrollTop;
+  },
+  // 涓嬫媺鍔犺浇
+  onPullDownRefresh() {
+    console.log('refresh');
+    setTimeout(() => {
+      uni.stopPullDownRefresh();
+    }, 1000);
+    this.init();
+  },
+  onShow() {
+    if (this.menuShow == true) {
+      this.$refs.menuRef.menuClick()
+    }
+    this.init();
+  },
+  // 鐐瑰嚮瀵艰埅鏍忚彍鍗曞悗
+  onNavigationBarButtonTap(e) {
+    // console.log(e);
+    this.$refs.menuRef.menuClick()
+  },
+  components: {
+    combinationCard,
+    popupMenu
+  },
+  methods: {
+    init() {
+      this.haveTodoParams.pageNumber = 1;
+      this.loadingType = 0;
+      this.yibanData = [];
+      // this.doneList();
+      this.getMoreNews();
+    },
+    getMoreNews() {
+      if (this.loadingType !== 0) {
+        //loadingType!=0;鐩存帴杩斿洖
+        return false;
+      }
+      uni.showLoading({
+        title: '鍔犺浇涓�...'
+      })
+      this.loadingType = 1;
+      uni.showNavigationBarLoading(); //鏄剧ず鍔犺浇鍔ㄧ敾
+      this.$reqGet('doneList', this.haveTodoParams).then(response => {
+        uni.hideLoading();
+        this.haveTodoParams.pageNumber++; // 寰楀埌鏁版嵁涔嬪悗 page+1
+        if (response.data.content.length < 1) {
+          // 娌℃湁鏁版嵁
+          this.loadingType = 2;
+          uni.hideNavigationBarLoading(); // 鍏抽棴鍔犺浇鍔ㄧ敾
+          uni.showToast({
+            title: '娌℃湁鏇村鏁版嵁浜嗭紒',
+            icon: 'error'
+          });
+          return;
+        }
+        // this.myApplication.pageNumber++; // 姣忚Е搴曚竴娆� page +1
+        if (this.haveTodoParams.name || this.haveTodoParams.title || this.haveTodoParams.startDate || this.haveTodoParams.endTime  ) {
+          if(this.haveTodoParams.pageNumber == 1){
+            this.yibanData = response.data.content
+          } else{
+            this.yibanData = this.yibanData.concat(response.data.content);
+          }
+        } else {
+          if(this.haveTodoParams.pageNumber ==1){
+            this.yibanData = [];
+          }
+          this.yibanData = this.yibanData.concat(response.data.content);
+        }
+        //灏嗘暟鎹嫾鎺ュ湪涓�璧�
+        this.loadingType = 0; // 灏唋oadingType褰�0閲嶇疆
+        uni.hideNavigationBarLoading(); // 鍏抽棴鍔犺浇鍔ㄧ敾
+      });
+    },
+    // 宸插姙
+    // doneList() {
+    // 	uni.showLoading({
+    // 		title:'鍔犺浇涓�...'
+    // 	})
+    // 	this.$reqGet('doneList', this.haveTodoParams).then(res => {
+    // 		uni.hideLoading();
+    // 		if (res.code === 0) {
+    // 			// console.log('宸插姙', res);
+    // 			this.yibanData = res.data.content;
+    // 		}
+    // 	});
+    // },
+    searchChange(e){
+      console.log('e', e);
+    },
+    searchClose(e){
+      console.log('e', e);
+    },
+    searchOpen(e){
+      console.log('e', e);
+    },
+    // 鎼滅储
+    searchButtonClick() {
+      this.loadingType == 0;
+      this.haveTodoParams.pageNumber = 1;
+      this.init();
+    },
+    // 娓呯┖
+    emptyButtonClick() {
+      this.loadingType == 0;
+      this.haveTodoParams.pageNumber = 1;
+      this.haveTodoParams.name = '';
+      this.haveTodoParams.title = '';
+      this.haveTodoParams.startDate = '';
+      this.haveTodoParams.endDate = '';
+      this.init();
+    },
+    menushow(e) {
+      this.menuShow = e
+    },
+    deleteApplicationClick(id) {
+      this.deleteIds = id;
+      this.deleteApplicationModalShow = true;
+    },
+    deleteApplicationClickAll() {
+      if (this.checkBoxValue.length > 0) {
+        this.deleteIds = this.checkBoxValue.toString(',');
+        this.deleteApplicationModalShow = true;
+      } else {
+        this.$u.toast('鏈�変腑鐢宠')
+      }
+    },
+    // 鍒犻櫎鐢宠妯℃�佹
+    deleteApplicationModalConfirm() {
+      this.deleteApplicationModalShow = false;
+      this.$reqPost('deleteHistoric', {ids: this.deleteIds}, 'form').then(res => {
+        if (res.code == 0) {
+          this.$nextTick(() => {
+            this.$u.toast('鎿嶄綔鎴愬姛锛�')
+          })
+          this.yibanData = [];
+          this.init();
+        } else {
+          this.$u.toast('鎿嶄綔澶辫触锛侊紒锛�')
+        }
+      })
+    },
+    deleteApplicationModalCancel() {
+      this.deleteApplicationModalShow = false;
+    },
+    // 鏃堕棿閫夋嫨鍣�
+    startDateChange() {
+      // this.queryRealTimeShippingData.startDate = '';
+      // this.$nextTick(() => {
+      // 	console.log(this.queryRealTimeShippingData);
+      // 	this.realTimeShipping();
+      // });
+    },
+    endDateChange() {
+      // this.queryRealTimeShippingData.endDate = '';
+      // this.$nextTick(() => {
+      // 	console.log(this.queryRealTimeShippingData);
+      // 	this.realTimeShipping();
+      // });
+    },
+    // 澶嶉�夋
+    checkboxChange(n) {
+      console.log(n);
+    },
+    totalSelectChange(n) {
+      if (n[0] == 'tatalSelect') {
+        this.yibanData.forEach(item => {
+          this.totalSelectValue.push(item.id)
+        })
+        this.checkBoxValue = this.totalSelectValue
+      } else {
+        this.checkBoxValue = []
+      }
+    },
+    // 鐘舵��
+    // statusConfirm(a){
+    // 	this.statusSeletShow = false
+    // 	console.log(a)
+    // },
+    // 琛ㄥ崟鏁版嵁
+    theFormDataClick(v) {
+      uni.navigateTo({
+        url: `/pages/the-form-data/the-form-data?index=${v}`
+      });
+    },
+    // 瀹℃壒鍘嗗彶
+    approvalHistoryClick(v) {
+      uni.navigateTo({
+        url: `/pages/approval-history/approval-history?index=${v}`
+      });
+    }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
 ::v-deep.my-have-todo {
-	// 鎼滅储鍖哄煙
-	.searchBox {
-		width: 91%;
-		display: flex;
-		justify-content: space-between;
-		margin: vww(16) auto;
-		.search {
-			width: vww(160);
-			border: 1px solid #d1d1d1;
-			border-radius: vww(4);
-			.u-search {
-				.u-search__content {
-					height: 40px;
-					background-color: #ffffff !important;
-					.u-search__content__icon {
-						width: 10px;
-						height: 5.5px;
-					}
-					.u-search__content__input {
-						background-color: #ffffff !important;
-						.uni-input-placeholder{
-							color:#CCCCCC!important;
-						}
-					}
-				}
-			}
-		}
-		// 涓嬫媺鑿滃崟
-		.data-selet {
-			border: 1px solid #d1d1d1;
-			border-radius: 4px;
-			width: vww(160);
-			// width: 100%;
-			height: 40px;
-			display: flex;
-			align-items: center;
-			font-size: 13px;
-			color: #CCCCCC;
-			.uni-select__icon {
-				display: flex;
-				align-content: center;
-				margin: 0 10px;
-				image {
-					width: 10px;
-					height: 5.5px;
-				}
-			}
-			.content {
-				margin-left: vww(8);
-				width: vww(150);
-			}
-		}
-	}
+  // 鎼滅储鍖哄煙
+  .searchContainer {
+    width:91%;
+    margin:vww(16) auto;
+    .u-collapse {
+      .u-collapse-item {
+        .u-collapse-item__content {
 
-	// 鏃堕棿鎼滅储
-	.timeContiner {
-		width: 91%;
-		margin: 0 auto vww(16);
-		display: flex;
-		flex-direction: row;
-		justify-content: space-between;
-		.uni-date {
-			width: vww(160);
-			.uni-date-editor {
-				.uni-date-editor--x  {
-					.uni-date-x {
-						.uni-date__x-input {
-							.uni-input-wrapper{
-								.uni-input-placeholder{
-									color:#CCCCCC;
-									font-size: vww(13);
-								}
-							}
-						}
-					}
-				}
-				.uni-date-x--border{
-					border: 1px solid #d1d1d1!important;
-				}
-			}
-		}
-	}
+          .searchButton {
+            width: 100%;
+            margin: 0 auto;
+            display: flex;
 
-	// 鍗$墖涓棿
-	.center-container {
-		display: flex;
-		flex-direction: column;
-		.center-content__one {
-			display: flex;
-			view {
-				width: 50%;
-			}
-		}
-		.center-content__two {
-			display: flex;
-			// margin: vww(10) 0;
-			view {
-				width: 50%;
-			}
-		}
-		.center-content__three {
-			display: flex;
-			view {
-				width: 50%;
-			}
-		}
-		.center-content__four {
-		}
-	}
-	// 涓棿閮ㄥ垎鏍峰紡
-	.center-margin {
-		margin-bottom: vww(16);
-	}
+            .u-button {
+              width: 30%;
+            }
+          }
 
-	// 鍗$墖搴曢儴
-	.bottom-container {
-		.bottom-content__item {
-			display: flex;
-			justify-content: space-around;
-			view {
-				display: flex;
-				justify-content: center;
-				align-content: center;
-				margin-right: vww(10);
-				&:nth-last-child() {
-					margin-right: 0;
-				}
-				view {
-					display: inline-block;
-				}
-				image {
-					width: vww(16);
-					height: vww(16);
-					margin-right: vww(4);
-				}
-			}
-		}
-	}
-	
-	// 搴曢儴
-	.bottomTabbar{
-		position:fixed;
-		bottom:0;
-		width:100%;
-		height:vww(48);
-		display:flex;
-		align-items: center;
-		justify-content: space-between;
-		background-color:#F5F5F5;
-		.bottomTabbar_checkBox{
-			margin-left:vww(16);
-			.u-checkbox-group{
-				.u-checkbox{
-				}
-			}
-		}
-		.bottomTabbar_button{
-			display:flex;
-			.u-button{
-				font-size:13px;
-				margin-right:vww(14);
-				width:vww(90);
-				height:vww(32);
-			}
-		}
-	}
+          .searchBox {
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            margin:0 auto vww(16);
+
+            .search {
+              width: vww(150);
+              border: 1px solid #d1d1d1;
+              border-radius: vww(4);
+
+              .u-search {
+                .u-search__content {
+                  height: 40px;
+                  background-color: #ffffff !important;
+
+                  .u-search__content__icon {
+                    width: 10px;
+                    height: 5.5px;
+                  }
+
+                  .u-search__content__close {
+                    width: 16px !important;
+                    height: 16px !important;
+                    background-color: #cccccc !important;
+
+                    .u-icon {
+                      .u-icon__icon {
+                        font-size: 10px !important;
+                      }
+                    }
+                  }
+
+                  .u-search__content__input {
+                    background-color: #ffffff !important;
+
+                    .uni-input-placeholder {
+                      color: #CCCCCC !important;
+                    }
+                  }
+                }
+              }
+            }
+
+            // 涓嬫媺鑿滃崟
+            .data-selet {
+              border: 1px solid #d1d1d1;
+              border-radius: 4px;
+              width: vww(150);
+              // width: 100%;
+              height: 40px;
+              display: flex;
+              align-items: center;
+              font-size: 13px;
+              color: #CCCCCC;
+
+              .uni-select__icon {
+                display: flex;
+                align-content: center;
+                margin: 0 10px;
+
+                image {
+                  width: 10px;
+                  height: 5.5px;
+                }
+              }
+
+              .content {
+                margin-left: vww(8);
+                width: vww(150);
+              }
+            }
+          }
+
+          // 鏃堕棿鎼滅储
+          .timeContiner {
+            width: 100%;
+            margin: 0 auto vww(16);
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+
+            .uni-date {
+              width: vww(150);
+
+              .uni-date-editor {
+                .uni-date-editor--x {
+                  .uni-date-x {
+                    .uni-date__x-input {
+                      .uni-input-wrapper {
+                        .uni-input-placeholder {
+                          color: #CCCCCC;
+                          font-size: vww(13);
+                        }
+                      }
+                    }
+                  }
+                }
+
+                .uni-date-x--border {
+                  border: 1px solid #d1d1d1 !important;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+
+  // 鍗$墖涓棿
+  .center-container {
+    display: flex;
+    flex-direction: column;
+
+    .center-content__one {
+      display: flex;
+
+      view {
+        width: 50%;
+      }
+    }
+
+    .center-content__two {
+      display: flex;
+      // margin: vww(10) 0;
+      view {
+        width: 50%;
+      }
+    }
+
+    .center-content__three {
+      display: flex;
+
+      view {
+        width: 50%;
+      }
+    }
+
+    .center-content__four {
+    }
+  }
+
+  // 涓棿閮ㄥ垎鏍峰紡
+  .center-margin {
+    margin-bottom: vww(16);
+  }
+
+  // 鍗$墖搴曢儴
+  .bottom-container {
+    .bottom-content__item {
+      display: flex;
+      justify-content: space-around;
+
+      view {
+        display: flex;
+        justify-content: center;
+        align-content: center;
+        margin-right: vww(10);
+
+        &:nth-last-child(1) {
+          margin-right: 0;
+        }
+
+        view {
+          display: inline-block;
+        }
+
+        image {
+          width: vww(16);
+          height: vww(16);
+          margin-right: vww(4);
+        }
+      }
+    }
+  }
+
+  // 搴曢儴
+  .bottomTabbar {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    height: vww(48);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    background-color: #F5F5F5;
+
+    .bottomTabbar_checkBox {
+      margin-left: vww(16);
+
+      .u-checkbox-group {
+        .u-checkbox {
+        }
+      }
+    }
+
+    .bottomTabbar_button {
+      display: flex;
+
+      .u-button {
+        font-size: 13px;
+        margin-right: vww(14);
+        width: vww(90);
+        height: vww(32);
+      }
+    }
+  }
 }
 </style>

--
Gitblit v1.9.1