完成订单中心及需求大厅的搜索功能
This commit is contained in:
donqi
parent
c7ac112bdf
commit
5e6476967c
|
|
@ -10,7 +10,7 @@
|
|||
<view class="cu-bar search bg-white">
|
||||
<view class="search-form round">
|
||||
<text class="cuIcon-search"></text>
|
||||
<input @confirm="searchTasks" :adjust-position="true" v-model="searchInputVal" type="text" placeholder="输入搜索的内容"
|
||||
<input @confirm="searchTasks" v-model="inputGoodsName" :adjust-position="true" type="text" placeholder="输入搜索的内容"
|
||||
confirm-type="search"></input>
|
||||
</view>
|
||||
<view class="action">
|
||||
|
|
@ -22,27 +22,36 @@
|
|||
:scroll-left="scrollLeft">
|
||||
<view class="cu-item" v-for="(item,index) in taskConditions" v-if="item.type !== 1" :key="index"
|
||||
@tap="tabSelect" :data-id="index">
|
||||
<!-- 区域筛选picker -->
|
||||
<picker v-if="item.code === 'area'" :mode="'multiSelector'" @change="regionChange"
|
||||
:value="areaMultiIndex" :range-key="'name'" :range="areaList">
|
||||
{{item.title}}
|
||||
<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</picker>
|
||||
<!-- 品类筛选picker -->
|
||||
<picker v-else-if="item.code === 'category'" :mode="'multiSelector'" @change="categoryChange"
|
||||
:value="categoryMultiIndex" :range-key="'name'" :range="categoryList">
|
||||
{{item.title}}
|
||||
<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</picker>
|
||||
<text v-else>
|
||||
{{item.title}}
|
||||
<text v-if="item.type === 0" class="text-lg"><text
|
||||
:class="item.value === 0 ? 'cuIcon-triangleupfill' : 'cuIcon-triangledownfill'"></text></text>
|
||||
<text v-else class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</text>
|
||||
<!-- 区域筛选picker -->
|
||||
<picker v-if="item.code === 'countryId'" :mode="'multiSelector'" @change="regionChange" @columnchange="regionColChange"
|
||||
:value="areaMultiIndex" :range-key="'areaName'" :range="areaList">
|
||||
<view class="flex justify-start">
|
||||
<view class="text-cut search-nav-item-text">
|
||||
{{chosenArea && chosenArea.length ? chosenArea[2].areaName : item.title}}
|
||||
</view>
|
||||
<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</view>
|
||||
</picker>
|
||||
<!-- 品类筛选picker -->
|
||||
<picker v-else-if="item.code === 'goodsCategoryId'" :mode="'multiSelector'" @change="categoryChange"
|
||||
@columnchange="categoryColChange" :value="categoryMultiIndex" :range-key="'goodsCategoryName'"
|
||||
:range="categoryList">
|
||||
<view class="flex justify-start">
|
||||
<view class="text-cut search-nav-item-text">
|
||||
{{chosenCategory && chosenCategory.length ? chosenCategory[2].goodsCategoryName : item.title}}
|
||||
</view>
|
||||
<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</view>
|
||||
</picker>
|
||||
<view v-else class="flex justify-start">
|
||||
<view class="search-nav-item-text">{{item.title}}</view>
|
||||
<text v-if="item.type === 0" class="text-lg"><text
|
||||
:class="item.value === 0 ? 'cuIcon-triangleupfill' : 'cuIcon-triangledownfill'"></text></text>
|
||||
<text v-else class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cu-item" v-else>
|
||||
<button class="cu-btn bg-grey round shadow-blur">{{item.title}}</button>
|
||||
<view class="cu-item" v-else>
|
||||
<button class="cu-btn bg-grey round shadow-blur" @click="barBtnClick(index)">{{item.title}}</button>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
|
@ -188,40 +197,73 @@
|
|||
pageNum: 0,
|
||||
pageSize: 0,
|
||||
// type: 0=升降序，1=功能按钮；order: 0=升序，1=降序；
|
||||
taskConditions: [{
|
||||
code: 'area',
|
||||
title: '区域'
|
||||
}, {
|
||||
code: 'category',
|
||||
title: '品类'
|
||||
}, {
|
||||
code: 'distance',
|
||||
title: '距离',
|
||||
type: 0,
|
||||
value: 0,
|
||||
}, {
|
||||
code: 'time',
|
||||
title: '时间',
|
||||
type: 0,
|
||||
value: 0,
|
||||
}, {
|
||||
code: 'reset',
|
||||
type: 1,
|
||||
title: '重置'
|
||||
taskConditions: [{
|
||||
code: 'countryId',
|
||||
title: '区域',
|
||||
type: 2
|
||||
}, {
|
||||
code: 'goodsCategoryId',
|
||||
title: '品类',
|
||||
type: 2
|
||||
},
|
||||
// {
|
||||
// code: 'distance',
|
||||
// title: '距离',
|
||||
// type: 0,
|
||||
// value: 0,
|
||||
// },
|
||||
{
|
||||
code: 'createTimeSort',
|
||||
title: '时间',
|
||||
type: 0,
|
||||
value: 1,
|
||||
}, {
|
||||
code: 'reset',
|
||||
type: 1,
|
||||
title: '重置',
|
||||
action: 'resetConditions'
|
||||
}],
|
||||
searchInputVal: '',
|
||||
originTaskConditions: [{
|
||||
code: 'countryId',
|
||||
title: '区域',
|
||||
type: 2
|
||||
}, {
|
||||
code: 'goodsCategoryId',
|
||||
title: '品类',
|
||||
type: 2
|
||||
},
|
||||
// {
|
||||
// code: 'distance',
|
||||
// title: '距离',
|
||||
// type: 0,
|
||||
// value: 0,
|
||||
// },
|
||||
{
|
||||
code: 'createTimeSort',
|
||||
title: '时间',
|
||||
type: 0,
|
||||
value: 1,
|
||||
}, {
|
||||
code: 'reset',
|
||||
type: 1,
|
||||
title: '重置',
|
||||
action: 'resetConditions'
|
||||
}],
|
||||
tasks: [],
|
||||
curTask: null,
|
||||
takeCertify: false,
|
||||
showAddPriceModal: false,
|
||||
showForwardModal: false,
|
||||
showTakeCertifiedModal: false,
|
||||
showTakeSuccessModal: false,
|
||||
areaList: [],
|
||||
areaMultiIndex: [0, 0, 0],
|
||||
categoryList: [],
|
||||
showTakeSuccessModal: false,
|
||||
curUserInfo: {},
|
||||
inputGoodsName: null,
|
||||
areaList: [],
|
||||
areaMultiIndex: [0, 0, 0],
|
||||
chosenArea: [],
|
||||
categoryList: [],
|
||||
categoryMultiIndex: [0, 0, 0],
|
||||
curUserInfo: {}
|
||||
chosenCategory: []
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
|
|
@ -232,15 +274,26 @@
|
|||
// this.tasks = await this.$api.data('tasks');
|
||||
this.curUserInfo = this.$request.getCurUserInfo();
|
||||
this.reloadMasterOrderPage();
|
||||
this.takeCertify = await this.$api.data('takeCertify');
|
||||
this.areaList = await this.$api.data('areaList');
|
||||
this.categoryList = await this.$api.data('categoryList');
|
||||
// this.takeCertify = await this.$api.data('takeCertify');
|
||||
// this.areaList = await this.$api.data('areaList');
|
||||
// this.categoryList = await this.$api.data('categoryList');
|
||||
this.loadCategoryList();
|
||||
this.loadRegionList();
|
||||
},
|
||||
async loadMasterOrderPage(params = {}) {
|
||||
params.pageSize = this.$globalData.initPageSize;
|
||||
params.pageNum = this.pageNum;
|
||||
params.orderStatus = 0;
|
||||
params.workerId = -1;
|
||||
params.goodsName = this.inputGoodsName;
|
||||
this.taskConditions.forEach((condition) => {
|
||||
if (condition.type === 2) {
|
||||
params[condition.code] = condition.value;
|
||||
} else if (condition.type === 0) {
|
||||
params.params = params.params ? params.params : {};
|
||||
params.params[condition.code] = condition.value === 1 ? 'desc' : 'asc';
|
||||
}
|
||||
})
|
||||
|
||||
this.$refs.loadStatusBar.showLoading();
|
||||
try {
|
||||
|
|
@ -271,41 +324,144 @@
|
|||
this.$refs.loadStatusBar.showLoadMore();
|
||||
this.loadMasterOrderPage(params);
|
||||
},
|
||||
tabSelect(e) {
|
||||
this.tabCur = e.currentTarget.dataset.id;
|
||||
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 70;
|
||||
let conditionType = this.taskConditions[this.tabCur].type;
|
||||
let conditionCode = this.taskConditions[this.tabCur].code;
|
||||
if (conditionType === 0) {
|
||||
// 升降序类型的条件切换升降序
|
||||
let orderVal = this.taskConditions[this.tabCur].value;
|
||||
this.taskConditions[this.tabCur].value = orderVal === 0 ? 1 : 0;
|
||||
tabSelect(e) {
|
||||
this.tabCur = e.currentTarget.dataset.id;
|
||||
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 70;
|
||||
let conditionType = this.taskConditions[this.tabCur].type;
|
||||
let conditionCode = this.taskConditions[this.tabCur].code;
|
||||
if (conditionType === 0) {
|
||||
// 升降序类型的条件切换升降序
|
||||
let orderVal = this.taskConditions[this.tabCur].value;
|
||||
this.taskConditions[this.tabCur].value = orderVal === 0 ? 1 : 0;
|
||||
this.searchTasks();
|
||||
}
|
||||
},
|
||||
barBtnClick(index) {
|
||||
this[this.taskConditions[index].action]();
|
||||
},
|
||||
async loadCategoryList(idArr) {
|
||||
let typeList = await this.$request.listByStep();
|
||||
typeList = typeList.data;
|
||||
let col1Id = idArr ? idArr[0] : typeList[0].goodsCategoryId;
|
||||
let subTypeList = await this.$request.listByStep({
|
||||
goodsCategoryId: col1Id
|
||||
});
|
||||
subTypeList = subTypeList.data;
|
||||
let col2Id = idArr ? idArr[1] : subTypeList[0].goodsCategoryId;
|
||||
let subSubTypeList = await this.$request.listByStep({
|
||||
goodsCategoryId: col2Id
|
||||
});
|
||||
subSubTypeList = subSubTypeList.data;
|
||||
this.categoryList.push(typeList);
|
||||
this.categoryList.push(subTypeList);
|
||||
this.categoryList.push(subSubTypeList);
|
||||
},
|
||||
async loadRegionList() {
|
||||
let regionList = await this.$request.areaListByStep();
|
||||
regionList = regionList.data;
|
||||
let subRegionList = [];
|
||||
let subSubRegionList = [];
|
||||
if (regionList && regionList.length > 0) {
|
||||
subRegionList = await this.$request.areaListByStep({
|
||||
parentCode: regionList[0].areaCode
|
||||
});
|
||||
subRegionList = subRegionList.data;
|
||||
}
|
||||
this.searchTasks();
|
||||
if (subRegionList && subRegionList.length > 0) {
|
||||
subSubRegionList = await this.$request.areaListByStep({
|
||||
parentCode: subRegionList[0].areaCode
|
||||
});
|
||||
subSubRegionList = subSubRegionList.data;
|
||||
}
|
||||
this.areaList.push(regionList);
|
||||
this.areaList.push(subRegionList);
|
||||
this.areaList.push(subSubRegionList);
|
||||
},
|
||||
searchTasks() {
|
||||
let qryObj = {};
|
||||
this.taskConditions.forEach((condition) => {
|
||||
qryObj[condition.code] = condition.value;
|
||||
})
|
||||
qryObj.name = this.searchInputVal;
|
||||
//TODO: 调用查询tasks的接口
|
||||
this.reloadMasterOrderPage();
|
||||
},
|
||||
resetConditions() {
|
||||
this.inputGoodsName = null;
|
||||
for(let i = 0; i < this.originTaskConditions.length; i++) {
|
||||
this.taskConditions[i].value = this.originTaskConditions[i].value;
|
||||
}
|
||||
this.chosenArea = [];
|
||||
this.chosenCategory = [];
|
||||
// this.$forceUpdate();
|
||||
this.reloadMasterOrderPage();
|
||||
},
|
||||
regionChange(e) {
|
||||
this.areaMultiIndex = e.detail.value;
|
||||
let chosenArea = [];
|
||||
for (let i = 0; i < this.areaList.length; i++) {
|
||||
chosenArea.push(this.areaList[i][this.areaMultiIndex[i]]);
|
||||
}
|
||||
this.taskConditions[this.tabCur].value = chosenArea;
|
||||
regionChange(e) {
|
||||
this.areaMultiIndex = e.detail.value;
|
||||
let chosenArea = [];
|
||||
for (let i = 0; i < this.areaList.length; i++) {
|
||||
chosenArea.push(this.areaList[i][this.areaMultiIndex[i]]);
|
||||
}
|
||||
this.chosenArea = chosenArea;
|
||||
this.taskConditions[this.tabCur].value = chosenArea[chosenArea.length - 1].areaId;
|
||||
this.searchTasks();
|
||||
},
|
||||
async regionColChange(e) {
|
||||
let colObj = e.detail;
|
||||
if (colObj.column == 0) {
|
||||
// 通过一级查二级
|
||||
let subAreaList = await this.$request.areaListByStep({parentCode: this.areaList[0][colObj.value].areaCode});
|
||||
subAreaList = subAreaList.data;
|
||||
let subSubAreaList = [];
|
||||
if (subAreaList.length) {
|
||||
subSubAreaList = await this.$request.areaListByStep({parentCode: subAreaList[0].areaCode});
|
||||
subSubAreaList = subSubAreaList.data;
|
||||
}
|
||||
this.areaList.pop();
|
||||
this.areaList.pop();
|
||||
this.areaList.push(subAreaList);
|
||||
this.areaList.push(subSubAreaList);
|
||||
this.areaMultiIndex = [colObj.value, 0, 0];
|
||||
} else if (colObj.column == 1) {
|
||||
// 通过二级查三级
|
||||
let subAreaList = await this.$request.areaListByStep({parentCode: this.areaList[1][colObj.value].areaCode});
|
||||
subAreaList = subAreaList.data;
|
||||
this.areaList.pop();
|
||||
this.areaList.push(subAreaList);
|
||||
this.areaMultiIndex = [this.areaMultiIndex[0], colObj.value, 0];
|
||||
}
|
||||
},
|
||||
categoryChange(e) {
|
||||
this.categoryMultiIndex = e.detail.value;
|
||||
let chosenCategory = [];
|
||||
for (let i = 0; i < this.categoryList.length; i++) {
|
||||
chosenCategory.push(this.categoryList[i][this.categoryMultiIndex[i]]);
|
||||
}
|
||||
this.taskConditions[this.tabCur].value = chosenCategory;
|
||||
async categoryChange(e) {
|
||||
this.categoryMultiIndex = e.detail.value;
|
||||
let chosenCategory = [];
|
||||
for (let i = 0; i < this.categoryList.length; i++) {
|
||||
chosenCategory.push(this.categoryList[i][this.categoryMultiIndex[i]]);
|
||||
}
|
||||
this.chosenCategory = chosenCategory;
|
||||
this.taskConditions[this.tabCur].value = chosenCategory[chosenCategory.length - 1].goodsCategoryId;
|
||||
this.searchTasks();
|
||||
},
|
||||
async categoryColChange(e) {
|
||||
let colObj = e.detail;
|
||||
if (colObj.column == 0) {
|
||||
// 通过一级查询二级
|
||||
let subTypeList = await this.$request.listByStep({
|
||||
goodsCategoryId: this.categoryList[0][colObj.value].goodsCategoryId
|
||||
});
|
||||
subTypeList = subTypeList.data;
|
||||
let subSubTypeList = await this.$request.listByStep({
|
||||
goodsCategoryId: subTypeList[0].goodsCategoryId
|
||||
});
|
||||
subSubTypeList = subSubTypeList.data;
|
||||
this.categoryList.pop();
|
||||
this.categoryList.pop();
|
||||
this.categoryList.push(subTypeList);
|
||||
this.categoryList.push(subSubTypeList);
|
||||
this.categoryMultiIndex = [colObj.value, 0, 0];
|
||||
} else if (colObj.column == 1) {
|
||||
// 通过二级查三级
|
||||
let subSubTypeList = await this.$request.listByStep({
|
||||
goodsCategoryId: this.categoryList[1][colObj.value].goodsCategoryId
|
||||
});
|
||||
subSubTypeList = subSubTypeList.data;
|
||||
this.categoryList.pop();
|
||||
this.categoryList.push(subSubTypeList);
|
||||
this.categoryMultiIndex = [this.categoryMultiIndex[0], colObj.value, 0];
|
||||
}
|
||||
},
|
||||
showDemandDetail(e, task) {
|
||||
let paramObj = {
|
||||
|
|
@ -355,6 +511,17 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
<style scoped>
|
||||
.search-nav-item-text {
|
||||
width: 100rpx;
|
||||
}
|
||||
|
||||
.nav .cu-item {
|
||||
height: 90rpx;
|
||||
display: inline-block;
|
||||
line-height: 90rpx;
|
||||
margin: 0;
|
||||
padding: 0 10rpx;
|
||||
width: 180rpx;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -379,6 +379,9 @@
|
|||
// params.orderStatus = this.subStateList[this.tabCur].code;
|
||||
// params.pageNum = this.pageParams[this.tabCur].pageNum;
|
||||
params.pageNum = this.pageNum;
|
||||
params.goodsName = this.formData.orderKeywords;
|
||||
params.countryId = this.formData.area && this.formData.area.length > 2 ? this.formData.area[2].areaId : null;
|
||||
params.goodsCategoryId = this.formData.category && this.formData.category.length > 2 ? this.formData.category[2].goodsCategoryId : null;
|
||||
if (this.tabCur != null) {
|
||||
params.orderStatus = this.subStateList[this.tabCur].code;
|
||||
} else if (this.stateCur != null) {
|
||||
|
|
@ -532,9 +535,8 @@
|
|||
}
|
||||
this.formData.category = chosenCategory;
|
||||
},
|
||||
searchOrder(e) {
|
||||
console.log(e)
|
||||
console.log(this.formData)
|
||||
searchOrder() {
|
||||
this.reloadMasterOrderPage();
|
||||
},
|
||||
resetConditions() {
|
||||
this.formData = {
|
||||
|
|
|
|||
Loading…
Reference in New Issue