You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
375 lines
9.2 KiB
375 lines
9.2 KiB
<template>
|
|
<view class="search-box">
|
|
<d-search-log
|
|
:color_border="color_border"
|
|
:color_text="color_border"
|
|
:store_key="store_key"
|
|
@onClickDelAllApi="onClickDelAll"
|
|
@onSearchNameApi="onSearchName"
|
|
:is_show_more="showMore"
|
|
>
|
|
<template v-if="showCrop && !showBlock" class="m-data-list" slot="dataList">
|
|
<view class="m-data-box" v-for="item in data">
|
|
<view class="m-variety-name">{{ item.varietyName }}</view>
|
|
<view class="m-variety-item-box">
|
|
<view class="m-variety-item" v-for="items in item.products" @click="check(items)">
|
|
{{ items.productName }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<template v-if="!showCrop && !showBlock" class="m-sdata-list" slot="searchData">
|
|
<view v-if="searchData.length > 0">
|
|
<view class="m-sdata-box" v-for="item in searchData" @click="check(item)">
|
|
<view class="m-variety-name">
|
|
<image style="width: 100%; height: 100%; background-color: #d4d4d4" mode="aspectFit" :src="item.productPic" @error="imageError"></image>
|
|
</view>
|
|
<view class="m-variety-item-box">
|
|
<view class="m-variety-item-name">
|
|
{{ item.productName }}
|
|
<span class="m-jiao">{{ item.varietyName }}</span>
|
|
</view>
|
|
<view class="speciesName-box">
|
|
<view class="m-variety-item-species" v-for="items in item.speciesName">
|
|
{{ items }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="no-data" v-else>
|
|
<image src="@/static/images/default-data.svg" mode=""></image>
|
|
暂无数据
|
|
</view>
|
|
</template>
|
|
<template v-if="showBlock" class="m-sdata-list v-pages-list" slot="searchData">
|
|
<view v-if="searchData.length > 0">
|
|
<view class="v-pages-list-item" v-for="item in searchData" @click="check(item, 1)">
|
|
<view class="v-card">
|
|
<view class="v-card-content">
|
|
<view class="v-card-top row">
|
|
<view class="v-card-info">
|
|
<view class="v-card-title row">
|
|
{{ item.blockName }}
|
|
</view>
|
|
<view class="v-card-state m-t-mini">
|
|
<dict-tag :type="'land_type'" :value="item.blockType" class="state primary" />
|
|
</view>
|
|
<view class="v-card-code">当前未种植</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="no-data" v-else>
|
|
<image src="@/static/images/default-data.svg" mode=""></image>
|
|
暂无数据
|
|
</view>
|
|
</template>
|
|
</d-search-log>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import dSearchLog from '@/uni_modules/d-search-log/components/d-search-log/d-search-log.vue';
|
|
import { getAgriculturalProductList, getBlockList } from '@/api/system/addCrop/addCrop.js';
|
|
import DictTag from '@/components/DictTag/index.vue';
|
|
|
|
export default {
|
|
components: {
|
|
dSearchLog: dSearchLog,
|
|
DictTag: DictTag
|
|
},
|
|
computed: {},
|
|
|
|
data() {
|
|
return {
|
|
color_border: '#989898',
|
|
store_key: 'search_list',
|
|
showMore: true,
|
|
showCrop: true,
|
|
showBlock: false,
|
|
data: [],
|
|
allData: [],
|
|
searchData: [],
|
|
resviceData: null
|
|
};
|
|
},
|
|
onLoad(options) {
|
|
console.log(options);
|
|
if (options.isBlock == 2) {
|
|
if (options.params) {
|
|
this.resviceData = JSON.parse(options.params);
|
|
} else {
|
|
this.resviceData = null;
|
|
}
|
|
console.log(this.resviceData);
|
|
this.getAgriculturalProductList();
|
|
this.showBlock = false;
|
|
this.showCrop = true;
|
|
} else {
|
|
this.resviceData = JSON.parse(options.params);
|
|
this.getBlockList();
|
|
this.showBlock = true;
|
|
this.showCrop = false;
|
|
this.showMore = false;
|
|
}
|
|
},
|
|
onUnload() {
|
|
uni.removeStorageSync('search_list');
|
|
},
|
|
methods: {
|
|
onClickDelAll() {
|
|
console.log('[父级接收事件]：删除全部搜索记录');
|
|
},
|
|
onSearchName(e) {
|
|
console.log('[父级接收事件]：点击搜索:' + e);
|
|
if (this.showBlock == false) {
|
|
if (e != '') {
|
|
this.showCrop = false;
|
|
this.showMore = false;
|
|
this.searchData = this.searchByProductName(e);
|
|
this.searchData.forEach((item) => {
|
|
if (item.speciesName.includes(',')) {
|
|
item.speciesName = item.speciesName.split(',');
|
|
} else {
|
|
item.speciesName = [item.speciesName];
|
|
}
|
|
});
|
|
} else {
|
|
this.showCrop = true;
|
|
this.showMore = true;
|
|
this.searchData = null;
|
|
}
|
|
} else {
|
|
if (e != '') {
|
|
this.searchData = this.searchByProductName(e);
|
|
} else {
|
|
this.searchData = this.allData;
|
|
}
|
|
}
|
|
console.log(this.searchData);
|
|
},
|
|
getAgriculturalProductList() {
|
|
getAgriculturalProductList()
|
|
.then((res) => {
|
|
console.log(res);
|
|
this.allData = res.data;
|
|
const data = res.data;
|
|
const groupedData = data.reduce((acc, cur) => {
|
|
const variety = cur.varietyName;
|
|
if (!acc[variety]) {
|
|
acc[variety] = [];
|
|
}
|
|
acc[variety].push(cur);
|
|
return acc;
|
|
}, {});
|
|
|
|
const result = Object.keys(groupedData).map((variety) => ({
|
|
varietyName: variety,
|
|
products: groupedData[variety]
|
|
}));
|
|
this.data = result;
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
},
|
|
getBlockList() {
|
|
getBlockList(this.$store.state.user.baseId, 2) //这里还要改成从stroe获取baseid
|
|
.then((res) => {
|
|
this.allData = res.data;
|
|
this.searchData = res.data;
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
},
|
|
check(val, num) {
|
|
console.log(this.resviceData, val);
|
|
if (this.resviceData != null && num != '1') {
|
|
const obj = this.resviceData;
|
|
obj.productId = val.id;
|
|
obj.productName = val.productName;
|
|
this.$store.commit('updateFormData', obj);
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
// const data = encodeURIComponent(JSON.stringify(obj));
|
|
// uni.redirectTo({
|
|
// url: '/sunPages/addCrops/addCrops?params=' + data
|
|
// });
|
|
} else if (this.resviceData == null && num != '1') {
|
|
const obj = {
|
|
productId: val.id,
|
|
productName: val.productName
|
|
};
|
|
this.$store.commit('updateFormData', obj);
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
// const data = encodeURIComponent(JSON.stringify(obj));
|
|
// uni.redirectTo({
|
|
// url: '/sunPages/addCrops/addCrops?params=' + data
|
|
// });
|
|
} else {
|
|
const obj = this.resviceData;
|
|
obj.blockId = val.id;
|
|
obj.blockName = val.blockName;
|
|
obj.blockArea = val.blockArea;
|
|
this.$store.commit('updateFormData', obj);
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
// const data = JSON.stringify(obj);
|
|
// uni.redirectTo({
|
|
// url: '/sunPages/addCropForm/addCropForm?params=' + data
|
|
// });
|
|
}
|
|
},
|
|
searchByProductName(val) {
|
|
if (this.showBlock == false) {
|
|
return this.allData.filter((item) => item.productName.includes(val));
|
|
} else {
|
|
return this.allData.filter((item) => item.blockName.includes(val));
|
|
}
|
|
},
|
|
imageError(e) {
|
|
console.error('image发生error事件，携带值为' + e.detail.errMsg);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.search-box {
|
|
height: 100vh;
|
|
overflow-y: scroll;
|
|
padding-bottom: 160rpx;
|
|
background-color: #fff;
|
|
background-image: url('https://sy.hbcjy.com/prod-api/admin-api/infra/file/23/get/37b88075d150fceca903a8dbb7c70f868d9ec846ac2ca19a17ab59e4fc913804.png');
|
|
background-repeat: no-repeat;
|
|
background-position: right bottom;
|
|
background-size: contain;
|
|
}
|
|
|
|
.my-theme-bg {
|
|
background: linear-gradient(117deg, #60df9d, #31cb7b);
|
|
color: #fff;
|
|
}
|
|
|
|
.m-data-list {
|
|
width: 100%;
|
|
margin-top: 50rpx;
|
|
padding: 20rpx 40rpx;
|
|
|
|
.m-data-box {
|
|
margin-bottom: 30rpx;
|
|
|
|
.m-variety-name {
|
|
margin-bottom: 10rpx;
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.m-variety-item-box {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.m-variety-item {
|
|
background: #f5f5f5;
|
|
padding: 9rpx 26rpx;
|
|
border-radius: 20rpx;
|
|
margin-left: 10rpx;
|
|
margin-bottom: 15rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.m-sdata-list {
|
|
width: 100%;
|
|
padding: 20rpx 20rpx 80rpx 20rpx;
|
|
|
|
.m-sdata-box {
|
|
width: 100%;
|
|
display: flex;
|
|
margin-bottom: 20rpx;
|
|
box-shadow: 0 0 7px 1px #d6d6d6;
|
|
border-radius: 15rpx;
|
|
padding: 20rpx;
|
|
|
|
.m-variety-name {
|
|
margin-right: 20rpx;
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
overflow: hidden;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.m-variety-item-box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.m-variety-item-name {
|
|
font-size: 38rpx;
|
|
font-weight: 500;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 10rpx;
|
|
color: #666;
|
|
padding-left: 15rpx;
|
|
position: relative;
|
|
&:before {
|
|
content: ' ';
|
|
width: 4rpx;
|
|
height: 60%;
|
|
background-color: #04af21;
|
|
border-radius: 10rpx;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 20%;
|
|
}
|
|
|
|
.m-jiao {
|
|
font-size: 26rpx;
|
|
font-weight: 400;
|
|
background-color: #04af21;
|
|
padding: 3rpx 9rpx;
|
|
color: #eee;
|
|
flex: unset;
|
|
border-radius: 10rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
.speciesName-box {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
.m-variety-item-species {
|
|
color: #14c171;
|
|
background-color: rgba(20, 193, 113, 0.1);
|
|
border: 2rpx solid rgba(20, 193, 113, 0.1);
|
|
border-radius: 10rpx;
|
|
padding: 0 5rpx;
|
|
|
|
&:not(:last-child) {
|
|
margin-right: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.v-pages-list-item {
|
|
box-shadow: 0 0 9px 0px gainsboro;
|
|
border-radius: 15rpx;
|
|
}
|
|
.no-data{
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
color: #666;
|
|
}
|
|
</style>
|
|
|