优化

MrShi

2024-10-24 ba3a85f2bf6dc706ba2f74e88e9d81197533f1b7

优化

 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;

 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()

 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": "预选清单系统",

 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;

 h5/static/ic_left@2x.png

 h5/static/ic_right@2x.png