Browse Source

账单列表与账单筛选页面通信交互;账单筛选表单数据结果改造;

Sinea 1 year ago
parent
commit
104b39d6c7
4 changed files with 52 additions and 58 deletions
  1. 6 1
      api/bill.js
  2. 7 4
      api/index.js
  3. 27 50
      pages/self/bill/filter.vue
  4. 12 3
      pages/self/bill/index.vue

+ 6 - 1
api/bill.js

@@ -1,8 +1,13 @@
 import request from '@/api'
 
+const openid = uni.getStorageSync('openid')
+
 const billService = {
 	// 获取我的账单列表
-	getBillList: params => request.post('/bill/list', params)
+	getBillList: params => request.post('/bill/list', {
+		...params,
+		openid
+	})
 }
 
 export default billService

+ 7 - 4
api/index.js

@@ -18,19 +18,22 @@ const baseRequest = async (url, method, data = {}, loading = true) => {
 						reslove(res)
 					} else {
 						uni.showToast({
-							title: '未知错误'
+							title: '未知错误',
+							icon: 'none'
 						})
 					}
 				} else {
 					uni.showToast({
-						title: '网络连接失败,请稍后重试'
+						title: '网络连接失败,请稍后重试',
+						icon: 'none'
 					})
 					reject(res)
 				}
 			},
 			fail: (msg) => {
 				uni.showToast({
-					title: '网络连接失败,请稍后重试'
+					title: '网络连接失败,请稍后重试',
+					icon: 'none'
 				})
 				reject(msg)
 			},
@@ -44,7 +47,7 @@ const request = {
 	get: (api, data, loading) => baseRequest(api, 'GET', data, loading),
 	getPath: (api, data, keys, loading) => {
 		let newRequestPath = api;
-		Object.keys(keys).forEach(function (key) {
+		Object.keys(keys).forEach(function(key) {
 			newRequestPath = newRequestPath.replace(
 				"{" + key + "}",
 				keys[key]

+ 27 - 50
pages/self/bill/filter.vue

@@ -3,20 +3,20 @@
 		<view class="filter-item">
 			<view class="label">开票状态</view>
 			<view class="tag-group">
-				<view :class="{ item: true, active: filterForm.state === item.value }" v-for="(item, index) in stateOption" :key="index" @click="filterForm.state = item.value">
-					{{ item.label }}
+				<view :class="{ item: true, active: filterForm.type === item }" v-for="(item, index) in typeOption" :key="index" @click="filterForm.type = item">
+					{{ item }}
 				</view>
 			</view>
 		</view>
 		<view class="filter-item">
 			<view class="label">日期范围</view>
 			<view class="tag-group">
-				<view :class="{ item: true, active: filterForm.timeType === item.value }" v-for="(item, index) in timeOption" :key="index" @click="filterForm.timeType = item.value">
-					{{ item.label }}
+				<view :class="{ item: true, active: filterForm.date === item }" v-for="(item, index) in dateOption" :key="index" @click="filterForm.date = item">
+					{{ item }}
 				</view>
-				<uni-datetime-picker v-model="filterForm.timeRanges" type="daterange">
-					<view :class="{ item: true, active: filterForm.timeType === 4}" @click="filterForm.timeType = 4">
-						自定义 {{ filterForm.timeRanges.length ? filterForm.timeRanges[0] + ' 至 ' + filterForm.timeRanges[1] : '' }}
+				<uni-datetime-picker v-model="filterForm.dateRanges" type="daterange">
+					<view :class="{ item: true, active: filterForm.date === '自定义' }" @click="filterForm.date = '自定义'">
+						自定义 {{ filterForm.dateRanges.length ? filterForm.dateRanges[0] + ' 至 ' + filterForm.dateRanges[1] : '' }}
 					</view>
 				</uni-datetime-picker>
 			</view>
@@ -39,58 +39,35 @@ export default {
 	data() {
 		return {
 			filterForm: {
-				state: 0,
-				timeType: 0,
-				timeRanges: [],
-				sort: 0
+				type: '',
+				dateType: '最近30天',
+				dateRanges: [],
+				sort: 'desc'
 			},
-			stateOption: [
-				{
-					label: '全部',
-					value: 0
-				},
-				{
-					label: '应付账单',
-					value: 1
-				},
-				{
-					label: '应收账单',
-					value: 2
-				}
-			],
-			timeOption: [
-				{
-					label: '最近30天',
-					value: 0
-				},
-				{
-					label: '最近90天',
-					value: 1
-				},
-				{
-					label: '本季度',
-					value: 2
-				},
-				{
-					label: '本年度',
-					value: 3
-				}
-			],
+			typeOption: ['全部', '应付账单', '应收账单'],
+			dateOption: ['最近30天', '最近90天', '本季度', '本年度'],
 			sortOption: [
 				{
 					label: '正序',
-					value: 0
+					value: 'asc'
 				},
 				{
 					label: '倒序',
-					value: 1
+					value: 'desc'
 				}
 			]
 		};
 	},
+	onLoad(option) {
+		const eventChannel = this.getOpenerEventChannel();
+		eventChannel.on('updateData', (data) => {
+			console.log(data);
+			// filterForm.
+		});
+	},
 	methods: {
-		handleSubmit(){
-			uni.navigateBack()
+		handleSubmit() {
+			uni.navigateBack();
 		}
 	}
 };
@@ -133,11 +110,11 @@ export default {
 		background: #eafffd;
 	}
 }
-.btn-group{
+.btn-group {
 	display: flex;
 	justify-content: center;
 	margin-top: 156.59rpx;
-	.btn{
+	.btn {
 		width: 247.25rpx;
 		height: 75.55rpx;
 		background: #079eff;
@@ -147,7 +124,7 @@ export default {
 		border: none;
 		margin: 0 13.74rpx;
 		line-height: 75.55rpx;
-		&-1{
+		&-1 {
 			color: #040404;
 			background: #ccc;
 		}

+ 12 - 3
pages/self/bill/index.vue

@@ -37,18 +37,27 @@
 import billService from '@/api/bill.js';
 export default {
 	data() {
-		return {};
+		return {
+			listForm: {
+				type: '',
+				date: '最近30天',
+				sort: 'desc'
+			}
+		};
 	},
 	onLoad() {
 		this.getBillList();
 	},
 	methods: {
 		async getBillList() {
-			const data = await billService.getBillList();
+			const data = await billService.getBillList(this.listForm);
 		},
 		handleOpenFilter() {
 			uni.navigateTo({
-				url: 'filter'
+				url: 'filter',
+				success: (res) => {
+					res.eventChannel.emit('updateData', this.listForm);
+				}
 			});
 		},
 		handleOpenDetail() {