|
@@ -1,49 +1,11 @@
|
|
|
<template>
|
|
|
<view class="container">
|
|
|
- <view class="top">
|
|
|
- <view class="search">
|
|
|
- <uni-row class="demo-uni-row" :width="nvueWidth">
|
|
|
- <uni-col>
|
|
|
- <view class="demo-uni-col">
|
|
|
- <uni-easyinput class="uni-input" prefixIcon="search" v-model="formData.name" placeholder="请输入商户名称"></uni-easyinput>
|
|
|
- </view>
|
|
|
- </uni-col>
|
|
|
- </uni-row>
|
|
|
- <uni-row class="demo-uni-row" :width="nvueWidth">
|
|
|
- <uni-col :span="11">
|
|
|
- <view class="demo-uni-col">
|
|
|
- <uni-data-picker :localdata="addressOptions" v-model="selectedAddress" placeholder="商业板块/楼栋/楼层" popup-title="请选择商业板块/楼栋/楼层"
|
|
|
- @change="onchange"
|
|
|
- @nodeclick="onnodeclick"
|
|
|
- @popupclosed="onpopupclosed"></uni-data-picker>
|
|
|
- </view>
|
|
|
- </uni-col>
|
|
|
- <uni-col :span="5">
|
|
|
- <view class="demo-uni-col">
|
|
|
- <uni-data-select class="search-data-select" placeholder="使用状态" v-model="formData.status" :localdata="statusOptions">状态</uni-data-select>
|
|
|
- </view>
|
|
|
- </uni-col>
|
|
|
- <uni-col :span="4">
|
|
|
- <view class="demo-uni-col">
|
|
|
- <button class="searchBtn" type="default" @click="handleSearch">搜索</button>
|
|
|
- </view>
|
|
|
- </uni-col>
|
|
|
- <uni-col :span="4">
|
|
|
- <view class="demo-uni-col">
|
|
|
- <button class="searchBtn" type="default" @click="handleReset">重置</button>
|
|
|
- </view>
|
|
|
- </uni-col>
|
|
|
- </uni-row>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
<uni-list border class="list">
|
|
|
<uni-list-item
|
|
|
- v-for="(item, index) in resultList"
|
|
|
+ v-for="(item, index) in districtOptions"
|
|
|
:key="index"
|
|
|
:ellipsis="2"
|
|
|
- :title="item.district"
|
|
|
- :note=getAddress(item)
|
|
|
- :rightText=getMerchantName(item)
|
|
|
+ :title="item.value"
|
|
|
showArrow
|
|
|
clickable
|
|
|
@click="listItemBtn(item)">
|
|
@@ -55,228 +17,31 @@
|
|
|
|
|
|
<script>
|
|
|
import dictApi from '../../api/dict.js';
|
|
|
- import shopApi from '../../api/shop.js';
|
|
|
- import { BASE_URL } from '../../env.js';
|
|
|
+ import request from '../../api/shop.js';
|
|
|
+ import { BASE_URL } from '../../env.js';
|
|
|
export default {
|
|
|
data() {
|
|
|
- return {
|
|
|
- addressOptions: [],
|
|
|
- statusOptions: [],
|
|
|
- currentAddress: null,
|
|
|
- selectedAddress: null,
|
|
|
- formData: {
|
|
|
- pageNum: 0,
|
|
|
- pageSize: 20,
|
|
|
- district: null,
|
|
|
- building: null,
|
|
|
- floor: null,
|
|
|
- status: null,
|
|
|
- name: null,
|
|
|
- },
|
|
|
- resultList: [],
|
|
|
- more: 'more'
|
|
|
+ return {
|
|
|
+ districtSelected: '',
|
|
|
+ districtOptions: [],
|
|
|
}
|
|
|
},
|
|
|
- onShow: function() {
|
|
|
- // this.init();
|
|
|
- },
|
|
|
- // 页面生命周期中onReachBottom(页面滚动到底部的事件)
|
|
|
- onReachBottom() {
|
|
|
- if(this.more != 'noMore') {
|
|
|
- this.more = 'more';
|
|
|
- this.getShopList();
|
|
|
- }
|
|
|
- },
|
|
|
async mounted() {
|
|
|
await this.getDicts();
|
|
|
- await this.getDistrictBuildingFloor();
|
|
|
- await this.getShopList();
|
|
|
},
|
|
|
methods: {
|
|
|
- async getDicts() {
|
|
|
- const resp_vacant = await dictApi.getDict('vacant_status');
|
|
|
- if (resp_vacant.code == 200)
|
|
|
- this.statusOptions = resp_vacant.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
|
|
|
- },
|
|
|
- async getDistrictBuildingFloor() {
|
|
|
- const resp_address = await shopApi.getDistrictBuildingFloor();
|
|
|
- this.addressOptions = resp_address.data.map(node => this.flattenValues(node));
|
|
|
- },
|
|
|
- flattenValues(node, parentValue='') {
|
|
|
- if(parentValue!==''){
|
|
|
- node.value = parentValue + ':' + node.value;
|
|
|
- }
|
|
|
-
|
|
|
- if (!node.isleaf && node.children!=null && node.children.length != 0) {
|
|
|
- node.children.map(child => this.flattenValues(child, node.value));
|
|
|
- }
|
|
|
- return node;
|
|
|
- },
|
|
|
- // 搜索函数
|
|
|
- async getShopList() {
|
|
|
- this.more = 'loading';
|
|
|
-
|
|
|
- const queryParams = {};
|
|
|
- this.getFormParams(queryParams);
|
|
|
- const resp = await shopApi.getShopList({...queryParams});
|
|
|
- this.resultList.push(...resp.rows);
|
|
|
-
|
|
|
- this.updateMoreStatus(resp.total);
|
|
|
- },
|
|
|
- // 搜索函数
|
|
|
- async handleSearch() {
|
|
|
- this.resultList.length = 0;
|
|
|
- this.formData.pageNum = 0;
|
|
|
-
|
|
|
- await this.getShopList();
|
|
|
- },
|
|
|
- async handleReset() {
|
|
|
- this.currentAddress = null;
|
|
|
- this.selectedAddress = null;
|
|
|
-
|
|
|
- this.formData.pageNum = 0;
|
|
|
- this.formData.name = null;
|
|
|
- this.formData.district = null;
|
|
|
- this.formData.building = null;
|
|
|
- this.formData.floor = null;
|
|
|
- this.formData.status = null;
|
|
|
-
|
|
|
- this.resultList.length = 0;
|
|
|
-
|
|
|
- await this.getShopList();
|
|
|
- },
|
|
|
- onchange(nodesPath) {
|
|
|
- const value = nodesPath.detail.value[0];
|
|
|
- if (!value) {
|
|
|
- this.currentAddress = null;
|
|
|
- }
|
|
|
- },
|
|
|
- onnodeclick(node) {
|
|
|
- this.currentAddress = node;
|
|
|
- },
|
|
|
- onpopupclosed() {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.selectedAddress = this.currentAddress.value
|
|
|
- });
|
|
|
+ async getDicts() {
|
|
|
+ const resp_district = await dictApi.getDict('che_district');
|
|
|
+ if (resp_district.code == 200)
|
|
|
+ this.districtOptions = resp_district.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
|
|
|
},
|
|
|
// 列表点击函数
|
|
|
listItemBtn(e) {
|
|
|
- uni.navigateTo({ url: `/pages/shop/info?id=${e.shopId}` })
|
|
|
- },
|
|
|
- getAddress(shop){
|
|
|
- return "楼栋:" + shop.building + " 楼层:" + shop.floor + " 铺位号:" + shop.number;
|
|
|
- },
|
|
|
- getMerchantName(shop){
|
|
|
- if(shop.status === "未使用")
|
|
|
- return shop.status;
|
|
|
-
|
|
|
- if(shop.name != null && shop.name != '' && shop.name != undefined)
|
|
|
- return shop.name;
|
|
|
-
|
|
|
- return "未知";
|
|
|
+ uni.navigateTo({ url: `/pages/shop/taglist?district=${e.value}` })
|
|
|
},
|
|
|
- getFormParams(queryParams){
|
|
|
- this.formData.pageNum += 1;
|
|
|
-
|
|
|
- if(this.currentAddress != null){
|
|
|
- var parts = this.currentAddress.value.split(":");
|
|
|
- if (parts.length >= 1) this.formData.district = parts[0];
|
|
|
- if (parts.length >= 2) this.formData.building = parts[1];
|
|
|
- if (parts.length >= 3) this.formData.floor = parts[2];
|
|
|
- }
|
|
|
-
|
|
|
- for (const key in this.formData) {
|
|
|
- if (this.formData[key] !== null
|
|
|
- && this.formData[key] !== undefined
|
|
|
- && this.formData[key] !== '') {
|
|
|
- queryParams[key] = this.formData[key];
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- updateMoreStatus(total){
|
|
|
- // 根据总数 算页数 如果当前页 = 总页数就是没有数据 否则就是上拉加载
|
|
|
- this.more = this.formData.pageNum >= Math.ceil(total / this.formData.pageSize) ? 'noMore' : 'more';
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
- .container {
|
|
|
- width: 100%;
|
|
|
- background-color: #fff;
|
|
|
- }
|
|
|
- .top {
|
|
|
- width: 100%;
|
|
|
- z-index: 999;
|
|
|
- background-color: #fff;
|
|
|
- /* overflow: hidden; */
|
|
|
- }
|
|
|
- .tabsBox {
|
|
|
- width: 100%;
|
|
|
- border-bottom: 1px solid #d3d3d3;
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- .tab {
|
|
|
- width: 25%;
|
|
|
- }
|
|
|
- .text {
|
|
|
- display: block;
|
|
|
- width: 80%;
|
|
|
- margin: 0 auto;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .current {
|
|
|
- color: #ff9302;
|
|
|
- border-bottom: 1px solid #ff9302;
|
|
|
- }
|
|
|
-.search {
|
|
|
- width: 98%;
|
|
|
- border: 1px solid #f3f3f3;
|
|
|
- background-color: #fff !important;
|
|
|
- border-radius: 5px;
|
|
|
- margin: 2px;
|
|
|
- padding: 2rpx;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .demo-uni-row {
|
|
|
- margin-bottom: 10px;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- /deep/ .uni-row {
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
- .demo-uni-col {
|
|
|
- height: 24px;
|
|
|
- margin-bottom: 10px;
|
|
|
- border-radius: 4px;
|
|
|
- }
|
|
|
- .uni-easyinput {
|
|
|
- width: 100%;
|
|
|
- font-size: 14px;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .uni-easyinput .uni-easyinput__content {
|
|
|
- border: 1px solid #f3f3f3;
|
|
|
- border-radius: 10px;
|
|
|
- }
|
|
|
- .search-data-select{
|
|
|
- width: 100%;
|
|
|
- border-radius: 10px;
|
|
|
- }
|
|
|
- .searchBtn {
|
|
|
- width: 98%;
|
|
|
- background-color: #ff9302 !important;
|
|
|
- border: none;
|
|
|
- color: #fff !important;
|
|
|
- border-radius: 12px;
|
|
|
- padding-left: 2px;
|
|
|
- padding-right: 2px;
|
|
|
- margin-left: 2px;
|
|
|
- margin-right: 2px;
|
|
|
- font-size: 13px;
|
|
|
- }
|
|
|
- .list {
|
|
|
- display: block;
|
|
|
- }
|
|
|
</style>
|