From ba3a85f2bf6dc706ba2f74e88e9d81197533f1b7 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期四, 24 十月 2024 18:30:12 +0800
Subject: [PATCH] 优化
---
h5/pages.json | 16 ++
h5/pages/index_2/index.vue | 279 ++++++++++++++++++++++++++++++++--------------
h5/components/search.vue | 15 +
h5/components/searchShopList.vue | 11 +
h5/static/ic_left@2x.png | 0
h5/static/ic_right@2x.png | 0
6 files changed, 229 insertions(+), 92 deletions(-)
diff --git a/h5/components/search.vue b/h5/components/search.vue
index 53ba890..59e2820 100644
--- a/h5/components/search.vue
+++ b/h5/components/search.vue
@@ -1,7 +1,7 @@
<template>
<view class="search" v-if="show" @click="close">
<view class="search_box" @click.stop="test">
- <view class="search_box_item" v-if="status === 0">
+ <view class="search_box_item" :style="{background: !search ? 'rgba(13, 30, 65, 0.70)' : search.bgType === 1 ? percentage(search.bgColor, search.bgAlpha) : 'rgba(13, 30, 65, 0.70)'}" v-if="status === 0">
<view class="icon">
<image src="@/static/ic_search@2x.png" mode="widthFix"></image>
</view>
@@ -10,7 +10,7 @@
<input type="text" class="search_box_item_right_ipt" :focus="focus" v-model="category" @input="inputCategory(name1 ? 2 : 1)" placeholder-class="placeholder" placeholder="鎼滅储" />
</view>
</view>
- <view class="search_box_item" v-else>
+ <view class="search_box_item" :style="{background: !search ? 'rgba(13, 30, 65, 0.70)' : search.bgType === 1 ? percentage(search.bgColor, search.bgAlpha) : 'rgba(13, 30, 65, 0.70)'}" v-else>
<view class="icon">
<image src="@/static/ic_search@2x.png" mode="widthFix"></image>
</view>
@@ -77,6 +77,9 @@
status: {
type: Number
},
+ search: {
+ type: Object | null
+ },
categoryName: {
type: Number | String
},
@@ -98,6 +101,10 @@
}
},
methods: {
+ percentage(bgColor, alpha) {
+ let res = +(alpha * 2.55).toFixed(0)
+ return bgColor + res.toString(16)
+ },
confirm() {
if (this.type === 2) {
console.log('type')
@@ -310,7 +317,7 @@
align-items: center;
justify-content: center;
.search_box {
- width: 560px;
+ width: 660px;
height: auto;
display: flex;
flex-direction: column;
@@ -381,7 +388,7 @@
}
.search_box_item {
width: 100%;
- height: 62px;
+ height: 72px;
background: rgba(5,35,102,0.7);
border-radius: 32px;
display: flex;
diff --git a/h5/components/searchShopList.vue b/h5/components/searchShopList.vue
index 25a7736..2bd9613 100644
--- a/h5/components/searchShopList.vue
+++ b/h5/components/searchShopList.vue
@@ -1,7 +1,7 @@
<template>
<view class="search" v-if="show" @click="close">
<view class="search_box" @click.stop="test">
- <view class="search_box_item" style="background: rgba(13, 30, 65, 0.70)">
+ <view class="search_box_item" :style="{background: !search ? 'rgba(13, 30, 65, 0.70)' : search.bgType === 1 ? percentage(search.bgColor, search.bgAlpha) : 'rgba(13, 30, 65, 0.70)'}">
<view class="icon">
<image src="@/static/ic_search@2x.png" mode="widthFix"></image>
</view>
@@ -23,6 +23,11 @@
title: ''
}
},
+ props: {
+ search: {
+ type: Object | null
+ }
+ },
methods: {
open() {
this.title = ''
@@ -34,6 +39,10 @@
test() {
return false
},
+ percentage(bgColor, alpha) {
+ let res = +(alpha * 2.55).toFixed(0)
+ return bgColor + res.toString(16)
+ },
submit() {
this.$emit('getTitle', this.title)
this.close()
diff --git a/h5/pages.json b/h5/pages.json
index 7497756..4143ade 100644
--- a/h5/pages.json
+++ b/h5/pages.json
@@ -9,6 +9,22 @@
}
},
{
+ "path": "pages/index_1/index",
+ "style": {
+ "navigationBarTitleText": "棰勯�夋竻鍗曠郴缁�",
+ "navigationStyle": "custom",
+ "enablePullDownRefresh": true
+ }
+ },
+ {
+ "path": "pages/index_1.0.1/index",
+ "style": {
+ "navigationBarTitleText": "棰勯�夋竻鍗曠郴缁�",
+ "navigationStyle": "custom",
+ "enablePullDownRefresh": true
+ }
+ },
+ {
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "棰勯�夋竻鍗曠郴缁�",
diff --git a/h5/pages/index_2/index.vue b/h5/pages/index_2/index.vue
index 8cb33cb..be33da1 100644
--- a/h5/pages/index_2/index.vue
+++ b/h5/pages/index_2/index.vue
@@ -43,27 +43,33 @@
<view class="commodityFrom_body_content_item" v-for="(item, index) in shopList" :key="index">
<view class="commodityFrom_body_content_item_num">
<view class="commodityFrom_body_content_item_num_img">
- <image :src="item.categoryImgurl ? item.prefixUrl + item.categoryImgurl : ''" mode="widthFix"></image>
+ <image :src="item.categoryImgurl" mode="widthFix"></image>
</view>
{{stringOperations(item.categoryName, 3)}}
</view>
<view class="commodityFrom_body_content_item_num" @click="open(index, 1)">
{{stringOperations(item.brandName, 4)}}
<view class="drop-down" :style="{ opacity: item.ppShow ? opacity : '0', zIndex: item.ppShow ? zIndex : '-1', background: !configuration ? 'rgba(108, 130, 170, 1)' : percentage(configuration.pull.bgColor, configuration.pull.bgAlpha) }">
- <view class="drop-down-search">鎼滅储</view>
- <view class="drop-down-item" v-for="(child, i) in brandData" :key="i" @click.stop="clickBrand(item, child, index)">
+ <view class="drop-down-search">
+ <input type="text" placeholder="璇疯緭鍏�" v-model="item.brandVal" @input="searchBrand($event, item)" />
+ </view>
+ <!-- brandData -->
+ <view class="drop-down-item" v-for="(child, i) in item.brandVal ? item.brandSearchList : item.brandList" :key="i" @click.stop="clickBrand(item, child, index)">
{{child.name}}
</view>
</view>
</view>
<view class="commodityFrom_body_content_item_num" @click="open(index, 2)">
- {{stringOperations(item.name, 8)}}
+ {{item.name}}
<view class="drop-top" v-show="item.name">
{{item.name}}
</view>
<view class="drop-down" :style="{ opacity: item.xhShow ? opacity : '0', zIndex: item.xhShow ? zIndex : '-1', background: !configuration ? 'rgba(108, 130, 170, 1)' : configuration.pull.bgType === 1 ? percentage(configuration.pull.bgColor, configuration.pull.bgAlpha) : 'rgba(108, 130, 170, 1)' }">
- <view class="drop-down-item" v-for="(data, s) in item.xhData" :key="s" @click.stop="clickXH(data, index)">
- {{ stringOperations(data.name, 7)}}
+ <view class="drop-down-search">
+ <input type="text" placeholder="璇疯緭鍏�" v-model="item.modelVal" @input="searchModel($event, item)" />
+ </view>
+ <view class="drop-down-item" v-for="(data, s) in item.modelVal ? item.modelSearchList : item.xhData" :key="s" @click.stop="clickXH(data, index)">
+ {{data.name}}
</view>
</view>
</view>
@@ -85,11 +91,11 @@
</view>
</view>
<view class="commodityFrom_body_total">
- <view class="commodityFrom_body_total_item">鎬昏锛�</view>
- <view class="commodityFrom_body_total_item">
+ <view class="commodityFrom_body_total_item" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : configuration.header.backgroundType === 1 ? percentage(configuration.header.bgColor, configuration.header.bgAlpha) : 'rgba(13, 30, 65, 1)', color: !configuration ? 'rgba(255, 255, 255, 1)' : configuration.header.type === 1 ? percentage(configuration.header.color, configuration.header.alpha) : '#ffffff'}">鎬昏锛�</view>
+ <view class="commodityFrom_body_total_item" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : configuration.header.backgroundType === 1 ? percentage(configuration.header.bgColor, configuration.header.bgAlpha) : 'rgba(13, 30, 65, 1)', color: !configuration ? 'rgba(255, 220, 108, 1)' : configuration.pull.selType === 1 ? percentage(configuration.pull.selColor, configuration.pull.selAlpha) : '#FFDC6C'}">
{{simplifyNum(zdj)}}
</view>
- <view class="commodityFrom_body_total_item">
+ <view class="commodityFrom_body_total_item" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : configuration.header.backgroundType === 1 ? percentage(configuration.header.bgColor, configuration.header.bgAlpha) : 'rgba(13, 30, 65, 1)', color: !configuration ? 'rgba(255, 220, 108, 1)' : configuration.pull.selType === 1 ? percentage(configuration.pull.selColor, configuration.pull.selAlpha) : '#FFDC6C'}">
{{simplifyNum(totalPrices)}}
</view>
</view>
@@ -163,14 +169,16 @@
</view>
<view class="productPage_pk" v-if="isPK || status === 2">
<view class="productPage_pk_shop">
- <view class="productPage_pk_shop_sp" @click="openSearch('left')" v-if="JSON.stringify(leftShop) == '{}'">
- <image src="@/static/ic_add@2x.png" mode="widthFix"></image>
+ <view class="productPage_pk_shop_sp" @click="openSearch('left')" v-if="JSON.stringify(leftShop) == '{}'" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 0 ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 1 ? percentage(configuration.header.bgColor, configuration.header.bgAlpha) : `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)`}">
+ <!-- <image src="@/static/ic_add@2x.png" mode="widthFix"></image> -->
+ <span>+</span>
</view>
<view class="productPage_pk_shop_sp1" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : percentage(configuration.header.bgColor, configuration.header.bgAlpha)}" @click="clickPKshop(leftShop)" v-else>
<view class="productPage_pk_shop_sp1_img">
<image :src="leftShop.imgurl ? leftShop.prefixUrl + leftShop.imgurl : ''" mode="widthFix"></image>
</view>
- <text>{{stringOperations(leftShop.name, 6)}}</text>
+ <!-- <text>{{stringOperations(leftShop.name, 20)}}</text> -->
+ <text>{{leftShop.name}}</text>
</view>
<view class="productPage_pk_shop_t">
<image :src="!configuration ? require('@/static/ic_pktai@2x.png') : configuration.pkImg.type === 0 ? require('@/static/ic_pktai@2x.png') : configuration.pkImg.imgurl" mode="widthFix"></image>
@@ -180,14 +188,16 @@
<image src="@/static/ic_pk@2x.png" mode="widthFix"></image>
</view>
<view class="productPage_pk_shop">
- <view class="productPage_pk_shop_sp" @click="openSearch('right')" v-if="JSON.stringify(rightShop) == '{}'">
- <image src="@/static/ic_add@2x.png" mode="widthFix"></image>
+ <view class="productPage_pk_shop_sp" @click="openSearch('right')" v-if="JSON.stringify(rightShop) == '{}'" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 0 ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 1 ? percentage(configuration.header.bgColor, configuration.header.bgAlpha) : `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)`}">
+ <!-- <image src="@/static/ic_add@2x.png" mode="widthFix"></image> -->
+ <span>+</span>
</view>
- <view class="productPage_pk_shop_sp1" @click="clickPKshop(rightShop)" v-else>
+ <view class="productPage_pk_shop_sp1" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : percentage(configuration.header.bgColor, configuration.header.bgAlpha)}" @click="clickPKshop(rightShop)" v-else>
<view class="productPage_pk_shop_sp1_img">
<image :src="rightShop.imgurl ? rightShop.prefixUrl + rightShop.imgurl : ''" mode="widthFix"></image>
</view>
- <text>{{stringOperations(rightShop.name, 6)}}</text>
+ <text>{{rightShop.name}}</text>
+ <!-- <text>{{stringOperations(rightShop.name, 6)}}</text> -->
</view>
<view class="productPage_pk_shop_t">
<image :src="!configuration ? require('@/static/ic_pktai@2x.png') : configuration.pkImg.type === 0 ? require('@/static/ic_pktai@2x.png') : configuration.pkImg.imgurl" mode="widthFix"></image>
@@ -208,10 +218,10 @@
<!-- v-if="status === 2" -->
<view class="productPage_parameter" v-if="isPK && pkcontent">
<view class="productPage_parameter_item" v-for="(item, index) in [leftShop, rightShop]" :key="index">
- <view class="productPage_parameter_item_head">
- {{stringOperations(item.name, 11)}}
+ <view class="productPage_parameter_item_head" :style="{background: !configuration ? 'rgba(13, 30, 65, 1)' : configuration.header.backgroundType === 2 ? `linear-gradient(180deg, ${percentage(configuration.header.bgColor, configuration.header.bgAlpha)} 0%, ${percentage(configuration.header.bgColor2, configuration.header.bgAlpha2)} 100%)` : percentage(configuration.header.bgColor, configuration.header.bgAlpha), color: !configuration ? 'rgba(255, 255, 255, 1)' : configuration.header.type === 1 ? percentage(configuration.header.color, configuration.header.alpha) : 'rgba(255, 255, 255, 1)'}">
+ {{stringOperations(item.name, 25)}}
</view>
- <view class="productPage_parameter_item_content">
+ <view class="productPage_parameter_item_content" :style="{background: !configuration ? 'rgba(137, 159, 197, 1)' : configuration.list.bgType === 1 ? percentage(configuration.list.bgColor, configuration.list.bgAlpha) : 'rgba(137, 159, 197, 1)'}">
<view class="productPage_parameter_item_content_price">
<view class="zdj">
<text>鎸囧浠凤細</text>
@@ -242,6 +252,7 @@
<!-- 鎼滅储 -->
<search
ref="search"
+ :search="configuration ? configuration.search : null"
:categoryList="category"
:shopList="shopData"
:categoryid="categoryId"
@@ -251,6 +262,7 @@
<!-- 鎼滅储鍟嗗搧鍒楄〃鏍囬 -->
<searchShopList
ref="searchShopListRef"
+ :search="configuration ? configuration.search : null"
@getTitle="getVal"
/>
</view>
@@ -365,9 +377,9 @@
var keyCode = e.keyCode || e.which || e.charCode;
var ctrlKey = e.ctrlKey || e.metaKey;
if(ctrlKey && keyCode == 70) {
- if (that.status !== 1) {
+ if (that.status === 0) {
that.$refs.search.open()
- } else {
+ } else if (that.status === 1) {
that.$refs.searchShopListRef.open()
}
e.preventDefault();
@@ -384,7 +396,7 @@
}
this.getCategoryList()
this.getGoodsList()
- this.getbrandList()
+ // this.getbrandList()
this.h5Images()
},
onReady() {
@@ -487,6 +499,24 @@
}
},
methods: {
+ // 宸查�夊晢鍝佸垪琛ㄦ悳绱㈠搧鐗�
+ searchBrand(e, item) {
+ item.brandSearchList = item.brandList.filter(item => {
+ if (item.name.indexOf(e.detail.value) > -1) {
+ return item
+ }
+ })
+ this.$forceUpdate()
+ },
+ // 宸查�夊晢鍝佸垪琛ㄦ悳绱㈠瀷鍙�
+ searchModel(e, item) {
+ item.modelSearchList = item.xhData.filter(item => {
+ if (item.name.indexOf(e.detail.value) !== -1) {
+ return item
+ }
+ })
+ this.$forceUpdate()
+ },
// 鑾峰彇鎼滅储鐨勬爣棰�
getVal(val) {
this.title = val
@@ -582,10 +612,14 @@
xiaPage() {
if (this.status === 2 || this.status === 0) return
this.status = this.status + 1
+ this.$refs.search.close()
+ this.$refs.searchShopListRef.close()
},
// 杩斿洖涓婁竴椤�
fanhuiPage() {
if (this.status === 0) return
+ this.$refs.search.close()
+ this.$refs.searchShopListRef.close()
this.status = this.status - 1
if (this.status === 0) {
this.leftShop = {}
@@ -619,12 +653,14 @@
// 鐐瑰嚮鍨嬪彿
clickXH(item, index) {
let obj = JSON.parse(JSON.stringify(this.shopList[index]))
+ obj.modelSearchList = []
+ obj.modelVal = ''
obj.name = JSON.parse(JSON.stringify(item.name))
obj.zdPrice = JSON.parse(JSON.stringify(item.zdPrice))
obj.price = JSON.parse(JSON.stringify(item.price))
+ this.shopList.splice(index, 1, obj)
obj.xhShow = false
- this.shopList.splice(index, 1)
- this.shopList[index] = JSON.parse(JSON.stringify(obj))
+ // this.shopList[index] = JSON.parse(JSON.stringify(obj))
this.$forceUpdate()
},
// 鐐瑰嚮pk鍟嗗搧甯﹀洖棣栭〉
@@ -669,7 +705,6 @@
this.leftShop = {}
this.rightShop = {}
this.isSOU = true
- this.shopPageDataSou = []
if (type === 1) {
this.attributeOne.name = item.name === '鍏ㄩ儴' ? '' : item.name
this.attributeOne.id = item.id
@@ -691,23 +726,40 @@
this.isPK = false
this.pkcontent = false
this.status = 1
- this.shopPageData.forEach(item => {
+ this.shopPageDataSou = this.shopPageData.filter(item1 => {
if (
- (this.attributeOne.id ? item.attrFirstIds.indexOf(String(this.attributeOne.id)) !== -1 : true) &&
- (this.attributeTwo.id ? item.attrSecodIds.indexOf(String(this.attributeTwo.id)) !== -1 : true) &&
- (this.budget.type == 3 ? (item.price <= Number(this.budget.max)) && (item.price >= Number(this.budget.min)) : true) &&
- (this.budget.type == 1 ? (item.price <= Number(this.budget.max)) : true) &&
- (this.budget.type == 2 ? (item.price >= Number(this.budget.min)) : true) &&
- (this.shopPageBrand.id ? item.brandId === this.shopPageBrand.id : true) &&
- (item.name.indexOf(this.title) !== -1)
+ (this.attributeOne.id ? item1.attrFirstIds.indexOf(String(this.attributeOne.id)) !== -1 : true) &&
+ (this.attributeTwo.id ? item1.attrFirstIds.indexOf(String(this.attributeTwo.id)) !== -1 : true) &&
+ (this.budget.type == 3 ? (item1.price <= Number(this.budget.max)) && (item1.price >= Number(this.budget.min)) : true) &&
+ (this.budget.type == 1 ? (item1.price <= Number(this.budget.max)) : true) &&
+ (this.budget.type == 2 ? (item1.price >= Number(this.budget.min)) : true) &&
+ (this.shopPageBrand.id ? item1.brandId === this.shopPageBrand.id : true) &&
+ (item1.name.indexOf(this.title) !== -1)
) {
- this.shopPageDataSou.push(item)
+ return item1
}
})
},
+ deepCopyArray(arr) {
+ var copy = [];
+
+ for (var i = 0; i < arr.length; i++) {
+ // 鍒ゆ柇姣忎釜鍏冪礌鐨勭被鍨�
+ if (Array.isArray(arr[i])) {
+ // 濡傛灉鏄暟缁勶紝閫掑綊璋冪敤娣辨嫹璐濆嚱鏁�
+ copy[i] = deepCopyArray(arr[i]);
+ } else {
+ // 濡傛灉鏄叾浠栫被鍨嬶紝鐩存帴璧嬪�肩粰鏂版暟缁�
+ copy[i] = arr[i];
+ }
+ }
+
+ return copy;
+ },
// 鐐瑰嚮鍟嗗搧鍒楄〃椤甸潰鍟嗗搧
clickshoppageItem(item) {
- this.shopList.push(item)
+ this.shopList.push(...this.deepCopyArray([{ ...item, brandVal: '', modelVal: '', modelSearchList: [], brandSearchList: [], brandList: this.brandData }]))
+ console.log(this.shopList)
this.attrFirstList = []
this.attrSecondList = []
this.budgetList = []
@@ -732,17 +784,20 @@
this.shopList[index].zdPrice = ''
this.shopList[index].price = ''
this.shopList[index].ppShow = false
+
+ this.shopList[index].brandSearchList = []
+ this.shopList[index].brandVal = ''
this.$forceUpdate()
},
// 鍝佺墝
- getbrandList() {
- brandList({})
- .then(res => {
- this.brandData = JSON.parse(JSON.stringify(res.data))
- this.brandData1 = JSON.parse(JSON.stringify(res.data))
- this.brandData1.unshift({ name: '鍏ㄩ儴', id: '' })
- })
- },
+ // getbrandList() {
+ // brandList({})
+ // .then(res => {
+ // this.brandData = JSON.parse(JSON.stringify(res.data))
+ // this.brandData1 = JSON.parse(JSON.stringify(res.data))
+ // this.brandData1.unshift({ name: '鍏ㄩ儴', id: '' })
+ // })
+ // },
// 鑾峰彇閫変腑鍟嗗搧
result(val) {
val.ppShow = false
@@ -822,6 +877,14 @@
this.categoryName = name
this.isSOU = false
this.title = ''
+
+ brandList({ categoryId: id })
+ .then(res => {
+ this.brandData = JSON.parse(JSON.stringify(res.data))
+ this.brandData1 = JSON.parse(JSON.stringify(res.data))
+ this.brandData1.unshift({ name: '鍏ㄩ儴', id: '' })
+ })
+
this.category.forEach((item, num) => {
if (index === num) {
item.active = true
@@ -832,11 +895,16 @@
this.attrFirstName = item.attrFirst
this.attrSecondName = item.attrSecond
- this.attrFirstList = JSON.parse(JSON.stringify(item.attrFirstList)) || []
- this.attrFirstList.unshift({ name: '鍏ㄩ儴', id: '' })
- this.attrSecondList = JSON.parse(JSON.stringify(item.attrSecondList)) || []
- this.attrSecondList.unshift({ name: '鍏ㄩ儴', id: '' })
+ if (item.cateParamFirstList) {
+ this.attrFirstList = JSON.parse(JSON.stringify(item.cateParamFirstList))
+ this.attrFirstList.unshift({ name: '鍏ㄩ儴', id: '' })
+ }
+ if (item.cateParamSecondList) {
+ this.attrSecondList = JSON.parse(JSON.stringify(item.cateParamSecondList))
+ this.attrSecondList.unshift({ name: '鍏ㄩ儴', id: '' })
+ }
// this.budgetList = JSON.parse(JSON.stringify(item.budgetList))
+ // console.log(item.budgetList)
let arr = []
item.budgetList.forEach(item => {
// 娌℃湁鏈�灏忛噾棰�
@@ -971,7 +1039,7 @@
}
.box_content_right {
position: fixed;
- right: 50px;
+ right: -30px;
top: 50%;
cursor: pointer;
transform: translate(-50%, 0);
@@ -1013,7 +1081,7 @@
margin-top: 16px;
.commodityFrom_head {
width: 100%;
- height: 60px;
+ height: 45px;
padding: 10px 8px;
box-sizing: border-box;
background: rgba(0,224,255,0.24) linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.21) 100%);
@@ -1027,7 +1095,7 @@
display: flex;
align-items: center;
justify-content: center;
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Medium, SourceHanSansSC;
font-weight: 500;
color: #FFFFFF;
@@ -1060,7 +1128,7 @@
flex-direction: column;
.commodityFrom_body_content_item {
width: 100%;
- height: 56px;
+ height: 45px;
display: flex;
align-items: center;
margin-bottom: 6px;
@@ -1098,7 +1166,7 @@
background: #FFFFFF;
border-radius: 8px;
margin-right: 6px;
- font-size: 24px;
+ font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #111111;
@@ -1141,12 +1209,12 @@
background: rgba(0, 0, 0, 0.8);
border-radius: 10px;
color: #FFFFFF;
- font-size: 24px;
+ font-size: 16px;
font-weight: 500;
}
.commodityFrom_body_content_item_num_img {
- width: 24px;
- height: 24px;
+ width: 16px;
+ height: 16px;
margin-right: 4px;
image {
width: 100%;
@@ -1154,7 +1222,7 @@
}
}
input {
- font-size: 24px;
+ font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #111111;
@@ -1186,19 +1254,38 @@
// display: flex;
// flex-direction: column;
transition: .5s;
+ .drop-down-search {
+ width: 100%;
+ height: 50px;
+ padding: 10px;
+ box-sizing: border-box;
+ position: sticky;
+ background: rgb(108, 130, 170);
+ top: 0;
+ left: 0;
+ input {
+ width: 100%;
+ height: 100%;
+ border: none;
+ background-color: #FFFFFF;
+ font-size: 14px;
+ color: #000000;
+ border-radius: 5px;
+ }
+ }
.drop-down-item {
width: 100%;
height: 52px;
// padding: 0 10px;
// box-sizing: border-box;
- // overflow: hidden;
- // white-space: nowrap;
- // text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
- font-size: 24px;
+ font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
@@ -1212,7 +1299,7 @@
}
.commodityFrom_body_total {
width: 100%;
- height: 56px;
+ height: 45px;
display: flex;
align-items: center;
.commodityFrom_body_total_item {
@@ -1221,7 +1308,7 @@
background: rgba(255,255,255,0.4);
border-radius: 8px;
margin-right: 6px;
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Bold, SourceHanSansSC;
font-weight: bold;
color: #FFF200;
@@ -1229,7 +1316,7 @@
align-items: center;
justify-content: center;
input {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Bold, SourceHanSansSC;
font-weight: bold;
color: #FFF200;
@@ -1240,7 +1327,7 @@
display: flex;
align-items: center;
justify-content: flex-end;
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Medium, SourceHanSansSC;
font-weight: 500;
color: #FFFFFF;
@@ -1277,7 +1364,7 @@
border-radius: 8px !important;
}
.productCategory_list_item {
- width: 20% ;
+ width: 20%;
height: 108px;
display: flex;
transition: .5s;
@@ -1296,7 +1383,7 @@
margin-bottom: 4px;
}
text {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Normal, SourceHanSansSC;
font-weight: 400;
color: #FFFFFF;
@@ -1312,7 +1399,7 @@
margin-top: 16px;
.productPage_head {
width: 100%;
- height: 60px;
+ height: 45px;
display: flex;
align-items: center;
background: rgba(0,224,255,0.34) linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.21) 100%);
@@ -1374,12 +1461,16 @@
border-radius: 0px 0px 8px 8px;
.productPage_xl_iten {
width: 100%;
- height: 56px;
- line-height: 56px;
+ padding: 5rpx 0;
+ box-sizing: border-box;
+ // height: 56px;
+ line-height: 25px;
+ // white-space: nowrap;
+ // overflow: hidden;
+ // text-overflow: ellipsis;
text-align: center;
cursor: pointer;
- font-size: 24px;
- font-family: PingFangSC-Regular, PingFang SC;
+ font-size: 16px;
font-weight: 400;
color: #FFFFFF;
&:hover {
@@ -1388,7 +1479,7 @@
}
}
text {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Regular, SourceHanSansSC;
font-weight: 400;
color: #FFFFFF;
@@ -1417,12 +1508,15 @@
.productPage_pk_shop_sp {
width: 100px;
height: 100px;
+ line-height: 100px;
+ text-align: center;
margin-top: 84px;
cursor: pointer;
margin-bottom: 52px;
- image {
- width: 100%;
- height: 100%;
+ border-radius: 50%;
+ span {
+ font-size: 60px;
+ color: #FFFFFF;
}
}
.productPage_pk_shop_sp1 {
@@ -1432,26 +1526,34 @@
border-radius: 8px;
border: 2px solid #FFFFFF;
display: flex;
+ padding: 0 15px;
+ box-sizing: border-box;
align-items: center;
justify-content: center;
flex-direction: column;
margin-bottom: 12px;
- margin-top: 24px;
+ margin-top: 16px;
cursor: pointer;
.productPage_pk_shop_sp1_img {
width: 100px;
height: 100px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
image {
width: 100%;
height: 100%;
}
}
text {
- font-size: 24px;
- font-family: SourceHanSansSC-Medium, SourceHanSansSC;
+ width: 100%;
+ font-size: 16px;
font-weight: 500;
color: #FFFFFF;
margin-top: 18px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
}
.productPage_pk_shop_t {
@@ -1506,13 +1608,16 @@
.productPage_shop_item_img {
width: 136px;
height: 136px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
image {
width: 100%;
height: 100%;
}
}
text {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Normal, SourceHanSansSC;
font-weight: 400;
color: #FFFFFF;
@@ -1532,13 +1637,13 @@
}
.productPage_parameter_item_head {
width: 100%;
- height: 60px;
+ height: 40px;
background: rgba(0,224,255,0.34) linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(0,0,0,0.21) 100%);
border-radius: 8px 8px 0px 0px;
display: flex;
align-items: center;
justify-content: center;
- font-size: 26px;
+ font-size: 16px;
font-family: SourceHanSansSC-Medium, SourceHanSansSC;
font-weight: 500;
color: #FFFFFF;
@@ -1567,13 +1672,13 @@
margin-left: 20px;
text {
&:first-child {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Regular, SourceHanSansSC;
font-weight: 400;
color: #333333;
}
&:last-child {
- font-size: 26px;
+ font-size: 16px;
font-family: SourceHanSansSC-Bold, SourceHanSansSC;
font-weight: bold;
color: #222222;
@@ -1589,13 +1694,13 @@
justify-content: center;
text {
&:first-child {
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Regular, SourceHanSansSC;
font-weight: 400;
color: #333333;
}
&:last-child {
- font-size: 26px;
+ font-size: 16px;
font-family: SourceHanSansSC-Bold, SourceHanSansSC;
font-weight: bold;
color: #F10000;
@@ -1621,14 +1726,14 @@
}
.label {
flex-shrink: 0;
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Normal, SourceHanSansSC;
font-weight: 400;
color: #222222;
}
.value {
flex: 1;
- font-size: 24px;
+ font-size: 16px;
font-family: SourceHanSansSC-Normal, SourceHanSansSC;
font-weight: 400;
color: #222222;
diff --git a/h5/static/ic_left@2x.png b/h5/static/ic_left@2x.png
index 01df360..3c04bd1 100644
--- a/h5/static/ic_left@2x.png
+++ b/h5/static/ic_left@2x.png
Binary files differ
diff --git a/h5/static/ic_right@2x.png b/h5/static/ic_right@2x.png
index b100c55..de57c4b 100644
--- a/h5/static/ic_right@2x.png
+++ b/h5/static/ic_right@2x.png
Binary files differ
--
Gitblit v1.9.3