开发

jiangping

2023-10-13 5ec73adcca1d7f2b96c623cfdc66e309958ae2bf

开发

 .idea/jarRepositories.xml

@@ -4,6 +4,11 @@
    <remote-repository>
      <option name="id" value="central" />
      <option name="name" value="Central Repository" />
      <option name="url" value="http://maven.aliyun.com/nexus/content/groups/public/" />
    </remote-repository>
    <remote-repository>
      <option name="id" value="central" />
      <option name="name" value="Central Repository" />
      <option name="url" value="https://repo.maven.apache.org/maven2" />
    </remote-repository>
    <remote-repository>

 h5/pages/index_2/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1891 @@
<template>
    <view class="box">
        <view class="box_bg" :style="{backgroundImage: 'url(' + Config.resourcePath + Config.bgImg + ')'}"></view>
        <view class="box_user">
            <text>{{User.username}}</text>
            <image src="@/static/ic_logout@2x.png" mode="widthFix" @click="loginOut"></image>
        </view>
        <view class="box_content" :style="{maxWidth: Config.rangeSize + 'px', minWidth: Config.rangeSize + 'px'}">
            <!-- å¹¿å‘Šå›¾ -->
            <view class="advertisement">
                <image :src="Config.resourcePath + Config.topImg" mode="widthFix"></image>
            </view>
			
            <view class="box_content_left" v-if="status > 0" @click="fanhuiPage">
                <image src="@/static/ic_left@2x.png" mode="widthFix"></image>
            </view>
            <view class="box_content_right" @click="xiaPage" v-if="status > 0 && status !== 2">
                <image src="@/static/ic_right@2x.png" mode="widthFix"></image>
            </view>
			
            <!-- ä¸€é”®æ¸…空按钮 -->
            <view class="box_content_close" v-if="status === 0" @click="empty">
                ä¸€é”®æ¸…空
            </view>
			
            <!-- é¦–页 -->
            <template v-if="status === 0">
                <view class="commodityFrom" v-if="shopList && shopList.length > 0">
                    <view class="commodityFrom_head">
                        <view class="commodityFrom_head_item">类别</view>
                        <view class="commodityFrom_head_item">品牌</view>
                        <view class="commodityFrom_head_item">型号</view>
                        <view class="commodityFrom_head_item">指导价</view>
                        <view class="commodityFrom_head_item">入手价</view>
                    </view>
                    <view class="commodityFrom_body">
                        <view class="commodityFrom_body_content">
                            <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" mode="widthFix"></image>
                                    </view>
                                    <text>{{item.categoryName}}</text>
                                    <!-- {{stringOperations(item.categoryName, 4)}} -->
                                </view>
                                 <!-- @click="open(index, 1)" -->
                                <view class="commodityFrom_body_content_item_num" @mouseenter.stop="mouseenterP(index, item.categoryId)" @mouseleave.stop="mouseleaveP(index)">
                                    <!-- {{stringOperations(item.brandName, 4)}}  brandData -->
                                    <text>{{item.brandName}}</text> 
                                    <view class="drop-down" :style="{ opacity: item.ppShow ? opacity : '0', zIndex: item.ppShow ? zIndex : '-1' }">
                                        <view class="drop-down-item" v-for="(child, i) in item.ppData" :key="i" @click.stop="clickBrand(item, child, index)">
                                            <text>{{child.name}}</text>
                                        </view>
                                    </view>
                                </view>
                                 <!-- @click="open(index, 2)" -->
                                <view class="commodityFrom_body_content_item_num" @mouseenter.stop="mouseenterX(index)" @mouseleave.stop="mouseleaveX(index)">
                                    <!-- {{stringOperations(item.name, 16)}} -->
                                    <text>{{item.name}}</text>
									
                                    <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' }">
                                        <view class="drop-down-item" v-for="(data, s) in item.xhData" :key="s" @click.stop="clickXH(data, index)">
                                            <!-- {{ stringOperations(data.name, 7)}} -->
                                            <text>{{data.name}}</text>
                                        </view>
                                    </view>
                                </view>
                                <view class="commodityFrom_body_content_item_num">
                                    <text>{{ item.zdPrice }}</text>
                                </view>
                                <view class="commodityFrom_body_content_item_num">
                                    <input
                                        type="number"
                                        v-model="item.price"
                                        @onkeyup="checkInput(this)"
                                        @input="changePrice(item.price, index)" />
                                </view>
                                <view class="commodityFrom_body_content_item_tips">
                                    <image src="@/static/ic_img@2x.png" mode="widthFix" @click="openImg(index)"></image>
                                    <image src="@/static/ic_copy@2x.png" mode="widthFix" @click="copyItem(item)"></image>
                                    <image src="@/static/ic_delete@2x.png" mode="widthFix" @click="deleItem(index)"></image>
                                </view>
                            </view>
                        </view>
                        <view class="commodityFrom_body_total">
                            <view class="commodityFrom_body_total_item">总计：</view>
                            <view class="commodityFrom_body_total_item">
                                {{simplifyNum(zdj)}}
                                <!-- {{unitConvert(zdTotalPrice).num}}{{unitConvert(zdTotalPrice).unit}} -->
                            </view>
                            <view class="commodityFrom_body_total_item">
                                {{simplifyNum(totalPrices)}}
                                <!-- {{unitConvert(totalPrice).num}}{{unitConvert(totalPrice).unit}} -->
                            </view>
                        </view>
                    </view>
                </view>
                <view class="productCategory">
                <view class="productCategory_list">
                    <view
                    class="productCategory_list_item"
                    v-for="(item, index) in category"
                    :key="index"
                    @click="clickItem(index, item.id, item.name)">
                        <image :src="item.imgurl ? item.prefixUrl + item.imgurl : ''" mode="widthFix"></image>
                        <text>{{item.name}}</text>
                    </view>
                    <view class="productCategory_list_zw"></view>
                    <view class="productCategory_list_zw"></view>
                    <view class="productCategory_list_zw"></view>
                    <view class="productCategory_list_zw"></view>
                    <view class="productCategory_list_zw"></view>
                </view>
            </view>
            </template>
			
            <!-- å•†å“åˆ—表 -->
            <template v-if="status === 1 || status === 2">
                <view class="productPage">
                    <view class="productPage_head">
                        <view class="productPage_head_item" v-if="attrFirstList && attrFirstList.length > 0">
                            <text>{{attributeOne.name ? attributeOne.name : attrFirstName}}</text>
                            <image src="@/static/ar_open@2x.png" mode="widthFix"></image>
                            <view class="productPage_xl" v-if="attrFirstList.length > 0">
                                <view class="productPage_xl_iten" v-for="(item, index) in attrFirstList" :key="index" @click="clickShopPageCheck(item, 1)">
                                    <text>{{item.name}}</text>
                                </view>
                            </view>
                        </view>
                        <view class="productPage_head_item" v-if="attrSecondList && attrSecondList.length > 0">
                            <text>{{attributeTwo.name ? attributeTwo.name : attrSecondName}}</text>
                            <image src="@/static/ar_open@2x.png" mode="widthFix"></image>
                            <view class="productPage_xl" v-if="attrSecondList.length > 0">
                                <view class="productPage_xl_iten" v-for="(item, index) in attrSecondList" :key="index" @click="clickShopPageCheck(item, 2)">
                                    <text>{{item.name}}</text>
                                </view>
                            </view>
                        </view>
                        <view class="productPage_head_item">
                            <text v-if="budget.type == 1 || budget.type == 2">{{budget.name}}</text>
                            <text v-else>{{budget.max && budget.min ? budget.min + '~' + budget.max : '预算'}}</text>
                            <image src="@/static/ar_open@2x.png" mode="widthFix"></image>
                            <view class="productPage_xl" v-if="budgetList.length > 0">
                                <view class="productPage_xl_iten" v-for="(item, index) in budgetList" :key="index" @click="clickShopPageCheck(item, 3)">
                                    <template v-if="!item.name">
                                        <text>{{item.minamount}}~{{item.maxamount}}</text>
                                    </template>
                                    <template v-else>
                                        <text>{{item.name}}</text>
                                    </template>
                                </view>
                            </view>
                        </view>
                        <view class="productPage_head_item">
                            <text>{{shopPageBrand.name ? shopPageBrand.name : '品牌'}}</text>
                            <image src="@/static/ar_open@2x.png" mode="widthFix"></image>
                            <view class="productPage_xl" v-if="brandData1.length > 0">
                                <view class="productPage_xl_iten" v-for="(item, index) in brandData1" :key="index" @click="clickShopPageCheck(item, 4)">
                                    <text>{{item.name}}</text>
                                </view>
                            </view>
                        </view>
                    </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>
                            <view class="productPage_pk_shop_sp1" @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>{{leftShop.name}}</text>
                            </view>
                            <view class="productPage_pk_shop_t">
                                <image :src="Config.resourcePath + Config.pkImg" mode="widthFix"></image>
                            </view>
                        </view>
                        <view class="productPage_pk_z" @click="jumpPK">
                            <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>
                            <view class="productPage_pk_shop_sp1" @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>{{rightShop.name}}</text>
                            </view>
                            <view class="productPage_pk_shop_t">
                                <image :src="Config.resourcePath + Config.pkImg" mode="widthFix"></image>
                            </view>
                        </view>
                    </view>
                    <view class="productPage_shop" v-if="status === 1 && !pkcontent">
                        <noData v-if="shopPageData.length === 0 && shopPageDataSou.length === 0" />
                        <template v-else>
                            <view class="productPage_shop_item" v-for="(item, index) in isSOU ? shopPageDataSou : shopPageData" :key="index" @click="clickshoppageItem(item)">
                                <view class="productPage_shop_item_img">
                                    <image :src="item.imgurl ? item.prefixUrl + item.imgurl : ''" mode="widthFix"></image>
                                </view>
                                <!-- stringOperations(item.name, 6) -->
                                <text>{{item.name}}</text>
                            </view>
                            <view class="productPage_shop_zw"></view>
                            <view class="productPage_shop_zw"></view>
                            <view class="productPage_shop_zw"></view>
                        </template>
                    </view>
                     <!-- 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">
                                <text>{{item.name}}</text>
                            </view>
                            <view class="productPage_parameter_item_content">
                                <view class="productPage_parameter_item_content_price">
                                    <view class="zdj">
                                        <text>指导价：</text>
                                        <text>Â¥{{item.zdPrice}}</text>
                                    </view>
                                    <view class="rsj">
                                        <text>建议入手价：</text>
                                        <text>Â¥{{item.price}}</text>
                                    </view>
                                </view>
                                <view class="productPage_parameter_item_content_nr">
                                    <view class="item" v-if="item.param1"  v-for="(child, i) in item.param1" :key="child.index">
                                        <view class="label">{{child.name}}：</view>
                                        <view class="value">{{child.val}}</view>
                                    </view>
                                    <view v-if="item.param2.length>0" class="paramline"></view>
                                    <view class="item" v-if="item.param2" v-for="(child, j) in item.param2" :key="child.index">
                                        <view class="label">{{child.name}}：</view>
                                        <view class="value">{{child.val}}</view>
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </template>
			
            <!-- æœç´¢ç»„件 -->
            <search
                ref="search"
                :categoryList="category"
                :shopList="shopData"
                :status="status"
                :categoryName="categoryName"
                :categoryid="categoryId"
                @result="result" /> 
        </view>
    </view>
</template>

<script>
    import search from '@/components/search.vue'
    import noData from '@/components/noData.vue'
    import { mapState } from 'vuex'
    import { categoryList, goodsList, brandList, h5Image, goodsPage, listForH5, logout } from '@/apis/index.js'
    export default {
        data() {
            return {
                status: 0,    // 0首页 1商品列表 2pk页
				
                img: '',
				
                opacity: 1,
                zIndex: 2,
				
                index: '',
				
                val: '',
				
                isPK: false,
                pkcontent: false,
				
                imgList: [],  // æŸ¥çœ‹å›¾ç‰‡æ•°æ®é›†åˆ
                i: 0,
				
                categoryId: '',    // ç±»åˆ«id
                categoryName: '',    // ç±»åˆ«åç§°
                category: [],    // ç±»åˆ«æ•°æ®
                shopList: [],    // é¦–页已选商品
                shopData: [],    // å•†å“æ•°æ®
                brandData: [],    // å“ç‰Œæ•°æ®
                brandData1: [],        // å•†å“åˆ—表页查询搜索
				
                attrFirstName: '',
                attrSecondName: '',
                attrFirstList: [],    // å±žæ€§1
                attrSecondList: [],    // å±žæ€§2
                budgetList: [],    // é¢„ç®—
                isSOU: false,
                shopPageData: [],    // å•†å“åˆ—表页面数据
                shopPageDataSou: [],    // å•†å“åˆ—表页面搜索数据
                attributeOne: {        // å•†å“é¡µé¢å±žæ€§ä¸€
                    id: '',
                    name: ''
                },
                attributeTwo: {        // å•†å“é¡µé¢å±žæ€§äºŒ
                    id: '',
                    name: ''
                },
                budget: {        // å•†å“é¡µé¢é¢„ç®—
                    id: '',
                    max: '',
                    min: '',
                    type: ''
                },
                shopPageBrand: {        // å•†å“é¡µé¢å“ç‰Œ
                    id: '',
                    name: ''
                },
				
                leftShop: {},    // pk左侧商品
                rightShop: {},    // pk右侧商品
				
                totalPrices: 0,
                zdj: 0,
				
                select: [],    // å·²é€‰
				
                model: {        // å•†å“æŸ¥è¯¢æ•°æ®
                    attrFirst: '',
                    attrSecond: '',
                    brandId: '',
                    categoryId: '',
                    eprice: '',
                    sprice: '',
                    keyword: ''
                },
				
                page: 1
            }
        },
        components: { search, noData },
        onLoad() {
            var that = this
            // ç›‘听键盘组合键
            document.onkeydown = function(e) {
                var keyCode = e.keyCode || e.which || e.charCode;
                var ctrlKey = e.ctrlKey || e.metaKey;
                if (!that.$refs.search.show) {
                    if (ctrlKey && keyCode == 70) {
                        if (that.status === 0) {
                            that.$refs.search.index = 0
                            that.$refs.search.open()
                        }
                        e.preventDefault();
                        return false;
                    } else if (keyCode === 37) {
                        that.fanhuiPage()
                        e.preventDefault();
                        return false;
                    } else if (keyCode === 39) {
                        that.xiaPage()
                        e.preventDefault();
                        return false;
                    }
                } else {
                    console.log('已经打开搜索框', keyCode)
                    if (keyCode === 38) {
                        that.$refs.search.changeTop()
                    } else if (keyCode === 40) {
                        that.$refs.search.changeBottom()
                    } else if (keyCode === 13) {
                        that.$refs.search.confirm()
                    }
                }
            }
            this.getCategoryList()
            // this.getGoodsList()
            this.getbrandList()
            this.h5Images()
        },
        onReady() {
            var that = this
            let divs = document.getElementsByClassName('box')
            let start = 0
            divs[0].onmousedown = function(ev){
                if (that.status === 1) {
                    start = ev.pageY
                    //event的兼容性
                    var ev = ev || event;
                    //获取鼠标按下的坐标
                    var x1 = ev.clientX;
                    var y1 = ev.clientY;
                    //获取元素的left，top值
                    var l = divs.offsetLeft;
                    var t = divs.offsetTop;
                    //给可视区域添加鼠标的移动事件
                    document.onmousemove = function(ev) {
                        //event的兼容性
                        var ev = ev || event;
                        //获取鼠标移动时的坐标
                        var x2 = ev.clientX;
                        var y2 = ev.clientY;
                        //计算出鼠标的移动距离
                        var x = x2 - x1;
                        var y = y2 - y1;
                        //移动的数值与元素的left，top相加，得出元素的移动的距离
                        var lt = y + t;
                        var ls = x + l;
                        let num = start - ev.pageY
                        if (num < -100) {
                            that.isPK = true
                        } else if (num > 100) {
                            that.leftShop = {}
                            that.rightShop = {}
                            that.isPK = false
                        }
                    }
                    //清除
                    document.onmouseup = function(ev){
                        document.onmousemove = null;
                    }
                }
            }
        },
        onUnload() {
            //清除
            document.onmouseup = function(ev){
                document.onmousemove = null;
            }
            //清除
            document.onkeydown = null
        },
        computed: {
            // æŒ‡å¯¼ä»·æ€»è®¡
            zdTotalPrice() {
                let num = 0
                this.shopList.forEach(item => {
                    // num = num + Number(item.zdPrice)
                    num = this.addPrice(num, Number(item.zdPrice))
                })
                return num || 0
            },
            // å…¥æ‰‹ä»·
            totalPrice() {
                let num = 0
                this.shopList.forEach(item => {
                    // num = num + Number(item.price)
                    num = this.addPrice(num, Number(item.price))
                })
                return num || 0
            },
            ...mapState(['Cookies', 'Config', 'User'])
        },
        watch: {
            status: {
                handler(news, old) {
                    if (news === 0) {
                        this.page = 1
                        this.categoryName = ''
                        this.categoryId = ''
                        this.shopPageData = []
                    }
                }
            },
            shopList: {
                deep: true,
                handler(news, old) {
                    let rsj = 0
                    let zdj = 0
                    this.shopList.forEach(item => {
                        // rsj = rsj + Number(item.price)
                        rsj = this.addPrice(rsj, Number(item.price))
                        // zdj = zdj + Number(item.zdPrice)
                        zdj = this.addPrice(zdj, Number(item.zdPrice))
                    })
                    // console.log('rsj', rsj)
                    // console.log('zdj', zdj)
                    this.totalPrices = rsj
                    this.zdj = zdj
                }
            }
        },
        methods: {
            async mouseenterP(index, categoryId) {
                this.shopList[index].ppShow = true
                if (!this.shopList[index].ppData || this.shopList[index].ppData.length == 0) {
                    let res = await brandList({ categoryId })
                    if (res.code === 200) {
                        this.shopList[index].ppData = res.data
                    }
                }
                this.$forceUpdate()
            },
            mouseleaveP(index) {
                this.shopList[index].ppShow = false
                this.$forceUpdate()
            },
            async mouseenterX(index) {
                this.shopList[index].xhShow = true
                if (this.shopList[index].xhData && this.shopList[index].xhData.length > 0) {
					
                    this.$forceUpdate()
                } else {
                    let res = await listForH5({
                        categoryId: this.shopList[index].categoryId,
                        brandId: this.shopList[index].brandId
                    })
                    if (res.code === 200) {
                        this.shopList[index].xhData = res.data;
                        // this.shopList[index].xhShow = true
                        this.$forceUpdate()
                    }
                }
                // this.shopList[index].xhShow = true
                // this.$forceUpdate()
            },
            mouseleaveX(index) {
                this.shopList[index].xhShow = false
                this.$forceUpdate()
                // listForH5({
                //     categoryId: this.shopList[index].categoryId,
                //     brandId: this.shopList[index].brandId
                // }).then(res => {
                //     this.shopList[index].xhData = res.data;
                //     this.shopList[index].xhShow = false
                //     this.$forceUpdate()
                // })
                // this.shopList[index].ppShow = false
                // this.$forceUpdate()
            },
            addPrice (arg1, arg2) {
                let r1, r2, m;
                try {
                    r1 = arg1.toString().split('.')[1].length; // èŽ·å–arg1小数位的长度
                } catch (e) {
                    r1 = 0;
                }
                try {
                    r2 = arg2.toString().split('.')[1].length; // èŽ·å–arg2小数位的长度
                } catch (e) {
                    r2 = 0;
                }
                m = Math.pow(10, Math.max(r1, r2)); // max()函数是选出小数点位最大的参数的长度，保证将两个参数都化为整数，pow()函数是将10做指数幂操作,将参数都化为整数
                return (arg1 * m + arg2 * m )/m;
            },
            // é€€å‡º
            loginOut() {
                logout({})
                    .then(res => {
                        this.$store.commit('clean')
                        uni.redirectTo({ url: '/pages/login/login' });
                    })
            },
            // æŸ¥è¯¢å•†å“æ•°æ®
            getShopList(type) {
                if (type === 1) {
                    this.page = 1
                    this.shopPageData = []
                }
                goodsPage({
                    capacity: 20,
                    page: this.page,
                    model: this.model
                }).then(res => {
                    if (this.shopPageData.length === res.data.total) return
                    let arr = [...this.shopPageData, ...res.data.records]
                    this.shopPageData = arr
                    this.page = this.page + 1
                })
            },
            checkInput(_this) {
              if (_this.value != '' && _this.value.substr(0, 1) == '.') {
                _this.value = 0
              }
              if (_this.value == '') {
                _this.value = 0
              }
              _this.value = _this.value.replace(/^0*(0\.|[1-9])/, '$1') // ç¦æ­¢ç²˜è´´
              _this.value = _this.value.replace(/[^\d.]/g, '0.00') // ç¦æ­¢è¾“入非数字
              _this.value = _this.value.replace(/\.{2,}/g, '.') // åªä¿ç•™ç¬¬ä¸€ä¸ª. æ¸…除多余的
              _this.value = _this.value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.')
              _this.value = _this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3') // åªèƒ½è¾“入两个小数

              if (_this.value.indexOf('.') < 0 && _this.value != '') {
                // ä»¥ä¸Šå·²ç»è¿‡æ»¤ï¼Œæ­¤å¤„控制的是如果没有小数点，首位不能为类似于 01、02的金额
                if (_this.value.substr(0, 1) == '0' && _this.value.length == 2) {
                  _this.value = _this.value.substr(1, _this.value.length)
                }
              }
              if (!_this.value) {
                _this.value = 0
              }
            },
            changePrice(price, index) {
                if (price.indexOf('-') !== -1) {
                    console.log('-')
                    this.shopList[index].price = ''
                    return
                }
                // if (!/^\d[0,9]$/.test(price)) {
                //     this.shopList[index].price = JSON.parse(JSON.stringify(price.replace(/-/g, '')))
                //     return
                // }
                let rsj = 0
                this.shopList.forEach(item => {
                    rsj = rsj + Number(item.price)
                })
                console.log('rsj', rsj)
                this.totalPrices = rsj
            },
            simplifyNum(number) {
                if (!number && number != 0) return number;
                let test = number.toFixed(0)
                // console.log(test)
                if(test.length >= 7){
                    const moneys = number / 10000
                    const realVal = parseFloat(moneys).toFixed(0);
                    return realVal + "w"
                } else {
                    return number
                }
            },
            // èŽ·å–海报图
            h5Images() {
                h5Image({})
                    .then(res => {
                        this.img = res.data
                    })
            },
            xiaPage() {
                if (this.status === 2 || this.status === 0) return
                this.status = this.status + 1
            },
            // è¿”回上一页
            fanhuiPage() {
                if (this.status === 0) return
                this.status = this.status - 1
                if (this.status === 0) {
                    this.leftShop = {}
                    this.rightShop = {}
                    this.isPK = false,
                    this.pkcontent = false
                    this.attributeOne = {
                        id: '',
                        name: ''
                    },
                    this.attributeTwo = {
                        id: '',
                        name: ''
                    },
                    this.budget = {
                        id: '',
                        max: '',
                        min: ''
                    }
                    this.shopPageBrand = {
                        id: '',
                        name: ''
                    }
                } else if (this.status === 1) {
                    this.leftShop = {}
                    this.rightShop = {}
                    this.isPK = false,
                    this.pkcontent = false
                }
            },
            // ç‚¹å‡»åž‹å·
            clickXH(item, index) {
                let obj = JSON.parse(JSON.stringify(this.shopList[index]))
                obj.name = JSON.parse(JSON.stringify(item.name))
                obj.zdPrice = JSON.parse(JSON.stringify(item.zdPrice))
                obj.price = JSON.parse(JSON.stringify(item.price))
                obj.multifileList = JSON.parse(JSON.stringify(item.multifileList))
                obj.xhShow = false
                // this.shopList.splice(index, 1)
                this.shopList[index] = JSON.parse(JSON.stringify(obj))
                console.log(this.shopList[index])
                console.log(JSON.parse(JSON.stringify(obj)))
                let rsj = 0
                let zdj = 0
                this.shopList.forEach(item => {
                    rsj = this.addPrice(rsj, Number(item.price))
                    zdj = this.addPrice(zdj, Number(item.zdPrice))
                })
                this.totalPrices = rsj
                this.zdj = zdj
                this.$forceUpdate()
            },
            // ç‚¹å‡»pk商品带回首页
            clickPKshop(item) {
                this.shopList.push(item)
                this.status = 0
                this.isPK = false
                this.pkcontent = false
                this.leftShop = {}
                this.rightShop = {}
            },
            // æŸ¥çœ‹å¤§å›¾
            openImg(i) {
                this.imgList = []
                this.shopList.forEach((item, index) => {
                    if (index === i) {
                        item.multifileList.forEach(child => {
                            this.imgList.push(item.prefixUrl + child.fileurl)
                        })
                    }
                })
                if (this.imgList.length === 0) return
                this.$viewerApi({
                  images: this.imgList,
                })
            },
            empty() {
                this.shopList = []
            },
            // è·³è½¬pk
            jumpPK() {
                if (JSON.stringify(this.leftShop) !== '{}' && JSON.stringify(this.rightShop) !== '{}') {
                    this.isPK = true
                    this.pkcontent = true
                    this.status = 2
                }
            },
            // ç‚¹å‡»åŠ å…¥pk商品
            openSearch(type) {
                if (type === 'left') {
                    this.$refs.search.open('left')
                } else if (type === 'right') {
                    this.$refs.search.open('right')
                }
            },
            // ç‚¹å‡»å•†å“åˆ—表页面查询
            clickShopPageCheck(item, type) {
                this.leftShop = {}
                this.rightShop = {}
                // this.isSOU = true
                // this.shopPageDataSou = []
                if (type === 1) {
                    this.attributeOne.name = item.name  === '全部' ? '' : item.name
                    this.attributeOne.id = item.id
					
                    if (item.name === '全部') {
                        this.model.attrFirst = ''
                    } else {
                        this.model.attrFirst = item.id
                    }
					
                    this.getShopList(1)
					
                } else if (type === 2) {
                    this.attributeTwo.name = item.name === '全部' ? '' : item.name
                    this.attributeTwo.id = item.id
					
                    if (item.name === '全部') {
                        this.model.attrSecond = ''
                    } else {
                        this.model.attrSecond = item.id
                    }
					
                    this.getShopList(1)
                } else if (type === 3) {
                    console.log(item)
                    this.budget.id = item.id
                    this.budget.max = item.maxamount
                    this.budget.min = item.minamount
                    this.budget.type = item.type
                    if (item.name) {
                        this.budget.name = item.name
                    }
                    if (item.name === '全部') {
                        this.model.sprice = ''
                        this.model.eprice = ''
                    } else {
                        this.model.sprice = item.minamount || 0
                        this.model.eprice = item.maxamount || 99999
                    }
					
                    this.getShopList(1)
                } else if (type === 4) {
                    this.shopPageBrand.id = item.id
                    this.shopPageBrand.name = item.name === '全部' ? '' : item.name
					
                    if (item.name === '全部') {
                        this.model.brandId = ''
                    } else {
                        this.model.brandId = item.id
                    }
					
                    this.getShopList(1)
                }
                this.isPK = false
                this.pkcontent = false
                this.status = 1
                this.shopPageData.forEach(item => {
                    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)
                    ) {
                        this.shopPageDataSou.push(item)
                    }
                })
            },
            // ç‚¹å‡»å•†å“åˆ—表页面商品
            clickshoppageItem(item) {
                this.shopList.push(item)
                this.attrFirstList = []
                this.attrSecondList = []
                this.budgetList = []
                this.status = 0
                this.isPK = false
                this.pkcontent = false
            },
            // èŽ·å–搜索结果
            getSelectShop(categoryId, brandId) {
                this.select = []
                this.shopData.forEach(item => {
                    if (item.categoryId === categoryId && item.brandId === brandId) {
                        this.select.push(JSON.parse(JSON.stringify(item)))
                    }
                })
            },
            // é€‰æ‹©å“ç‰Œ
            clickBrand(item, val, index) {
                // let res = await listForH5({
                //     categoryId: this.shopList[index].categoryId,
                //     brandId: this.shopList[index].brandId
                // })
                // if (res.code === 200) {
                //     this.shopList[index].xhData = res.data;
                // }
                this.shopList[index].brandName = JSON.parse(JSON.stringify(val.name))
                this.shopList[index].brandId = JSON.parse(JSON.stringify(val.id))
                this.shopList[index].name = ''
                this.shopList[index].zdPrice = ''
                this.shopList[index].price = ''
                this.shopList[index].xhData = []
                this.shopList[index].multifileList = []
                this.shopList[index].ppShow = false
                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: '' })
                //     })
            },
            // èŽ·å–选中商品
            result(val) {
                val.ppShow = false
                val.xhShow = false
                if (this.$refs.search.typeName === 'left') {
                    this.leftShop = JSON.parse(JSON.stringify(val))
                } else if (this.$refs.search.typeName === 'right') {
                    this.rightShop = JSON.parse(JSON.stringify(val))
                    let leftParamList = this.leftShop.goodsParamList;
                    let rightParamList = this.rightShop.goodsParamList;
                    let leftList1 = new Array();
                    let leftList2 =  new Array();
                    let rightList1 = new Array();
                    let rightList2 =  new Array();
                    if(leftParamList && leftParamList.length>0){
                        leftParamList.forEach(item => {
                            let flag =0;
                            let rightTemp = null;
                            if(rightParamList && rightParamList.length>0){
                                rightParamList.forEach(item1 => {
                                    if (item.name === item1.name ) {
                                        flag =1;
                                        rightTemp = item1;
                                        return;
                                    }
                                })	
                            }
                            if(flag === 1){
                                leftList1.push(item);
                                rightList1.push(rightTemp);
                            }else{
                                leftList2.push(item);
                            }
                        })	
                    }
                    if(rightParamList && rightParamList.length>0){
                        rightParamList.forEach(item=> {
                            let flag1 = 0;
                            rightList1.forEach(item1 => {
                                if (item.name === item1.name ) {
                                    flag1 =1; 
                                    //return;
                                }
                            })	
                            if(flag1 === 0){
                                rightList2.push(item);
                            }
                        })	
                    }
                    Reflect.set(this.leftShop, "param1",leftList1);
                    Reflect.set(this.leftShop, "param2",leftList2);
                    Reflect.set(this.rightShop, "param1",rightList1);
                    Reflect.set(this.rightShop, "param2",rightList2);
                } else {
                    this.shopList.push(JSON.parse(JSON.stringify(val)))
                }
            },
            // èŽ·å–全部商品
            getGoodsList() {
                goodsList({})
                    .then(res => {
                        this.shopData = res.data
                    })
            },
            // èŽ·å–全部品类
            getCategoryList() {
                categoryList({})
                    .then(res => {
                        res.data.forEach(item => {
                            item.active = false
                        })
                        this.category = res.data
                    })
            },
            stringOperations(val, num) {
                if (!val) return
                if (val.length <= num) return val
                return val.substring(0, num) + '...'
            },
            copyItem(item) {
                let obj = JSON.parse(JSON.stringify(item))
                obj.multifileList = []
                obj.xhData = []
                obj.brandId = ''
                obj.brand = ''
                obj.brandName = ''
                obj.name = ''
                obj.zdPrice = ''
                obj.price = ''
                console.log(obj)
                this.shopList.push(obj)
            },
            deleItem(i) {
                this.shopList.splice(i, 1)
            },
            // é¦–页已选列表品牌下拉
            open(index, type) {
                this.shopList.forEach((item, i) => {
                    item.ppShow = false
                    item.xhShow = false
                })
				
                this.shopList.forEach((item, i) => {
                    if (i === index) {
                        if (type === 1) {
                            item.ppShow = true
                        } else {
                            listForH5({
                                categoryId: this.shopList[index].categoryId,
                                brandId: this.shopList[index].brandId
                            }).then(res => {
                                this.shopList[index].xhData = res.data;
                                item.xhShow = true
                                this.$forceUpdate()
                            })
							
                            // let arr = []
                            // this.shopData.forEach(element => {
                            //     // console.log(element.categoryId === item.categoryId && element.brandId === item.brandId)
                            //     if (
                            //     (item.categoryId ? element.categoryId === item.categoryId : true) &&
                            //     (item.brandId ? element.brandId === item.brandId : true)) {
                            //         arr.push(JSON.parse(JSON.stringify(element)))
                            //     }
                            // })
                            // this.shopList[index].xhData = arr;
                            // item.xhShow = true
                        }
                    }
                })
                this.$forceUpdate()
            },
            // ç‚¹å‡»ç±»åˆ«
            clickItem(index, id, name) {
                this.categoryId = id
                this.model.categoryId = id
                this.categoryName = name
				
                this.getShopList()
				
                brandList({ categoryId: id })
                    .then(res => {
                        this.brandData1 = JSON.parse(JSON.stringify(res.data))
                        this.brandData1.unshift({ name: '全部', id: '' })
                        console.log(this.brandData1)
                    })
				
                this.category.forEach((item, num) => {
                    if (index === num) {
                        item.active = true
						
                        this.attrSecondList = []
                        this.attrFirstList = []
                        this.budgetList = []
						
                        this.attrFirstName = item.attrFirst
                        this.attrSecondName = item.attrSecond
                        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 => {
                            // æ²¡æœ‰æœ€å°é‡‘额
                            if (!item.minamount) {
                                arr.push({
                                    id: JSON.parse(JSON.stringify(item.id)),
                                    type: 1,
                                    maxamount: JSON.parse(JSON.stringify(item.maxamount)),
                                    minamount: JSON.parse(JSON.stringify(item.minamount)),
                                    name: `${JSON.parse(JSON.stringify(item.maxamount))}以内`
                                })
                            // æ²¡æœ‰æœ€å¤§é‡‘额
                            } else if (!item.maxamount) {
                                arr.push({
                                    id: JSON.parse(JSON.stringify(item.id)),
                                    type: 2,
                                    maxamount: JSON.parse(JSON.stringify(item.maxamount)),
                                    minamount: JSON.parse(JSON.stringify(item.minamount)),
                                    name: `${JSON.parse(JSON.stringify(item.minamount))}以上`
                                })
                            } else {
                                arr.push({
                                    id: JSON.parse(JSON.stringify(item.id)),
                                    type: 3,
                                    maxamount: JSON.parse(JSON.stringify(item.maxamount)),
                                    minamount: JSON.parse(JSON.stringify(item.minamount))
                                })
                            }
                        })
                        arr.unshift({ name: '全部', id: '' })
                        this.budgetList = arr
                        // console.log(this.budgetList)
                    } else {
                        item.active = false
                    }
                })
                // this.shopPageData = []
                // this.shopData.forEach(item => {
                //     if (item.categoryId === id) {
                //         this.shopPageData.push(JSON.parse(JSON.stringify(item)))
                //     }
                // })
                this.attributeOne = {
                    id: '',
                    name: ''
                },
                this.attributeTwo = {
                    id: '',
                    name: ''
                },
                this.budget = {
                    id: '',
                    max: '',
                    min: ''
                },
                this.shopPageBrand = {
                    id: '',
                    name: ''
                },
                this.status = 1
            },
            mousemove(e) {
                if (e === this.index) return
                this.index = e
            }
        },
        onReachBottom() {
            if (this.status == 1) {
                this.getShopList()
            }
        }
    }
</script>

<style lang="scss" scoped>
    .box {
        width: 100vw;
        min-height: 100vh;
        display: flex;
        justify-content: center;
        .box_bg {
            position: fixed;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100vw;
            height: 100vh;
            background-repeat: no-repeat;
            background-size: 100% 100%;
        }
        .box_user {
            z-index: 9;
            position: fixed;
            top: 30px;
            right: 40px;
            display: flex;
            align-items: center;
            text {
                font-size: 16px;
                font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: #FFFFFF;
            }
            image {
                width: 18px;
                height: 18px;
                cursor: pointer;
                margin-left: 10px;
            }
        }
        .box_content {
            // max-width: 750px;
            // min-width: 750px;
            .box_content_left {
                position: fixed;
                left: 80px;
                top: 50%;
                cursor: pointer;
                transform: translate(-50%, 0);
                width: 80px;
                height: 80px;
                z-index: 9;
                image {
                    width: 100%;
                    height: 100%;
                }
            }
            .box_content_right {
                position: fixed;
                right: 0px;
                top: 50%;
                cursor: pointer;
                transform: translate(-50%, 0);
                width: 80px;
                height: 80px;
                z-index: 9;
                image {
                    width: 100%;
                    height: 100%;
                }
            }
            .box_content_close {
                position: fixed;
                right: 0;
                bottom: 30px;
                cursor: pointer;
                transform: translate(-50%, 0);
                width: 80px;
                height: 80px;
                border-radius: 50%;
                background-color: rgba(0, 224, 255, 0.18);
                color: #FFFFFF;
                font-size: 16px;
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .advertisement {
                width: 100%;
                // height: 300px;
                image {
                    width: 100%;
                    height: 100%;
                }
            }
            .commodityFrom {
                width: 100%;
                padding: 0 22px;
                box-sizing: border-box;
                margin-top: 16px;
                .commodityFrom_head {
                    width: 100%;
                    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%);
                    border-radius: 8px 8px 0px 0px;
                    display: flex;
                    align-items: center;
                    .commodityFrom_head_item {
                        // flex: 1;
                        width: 126px;
                        height: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        font-size: 16px;
                        font-family: SourceHanSansSC-Medium, SourceHanSansSC;
                        font-weight: 500;
                        color: #FFFFFF;
                        margin-right: 6px;
                        &:last-child {
                            margin-right: 0 !important;
                        }
                        &:nth-child(3) {
                            flex: 1 !important;
                        }
                        &:nth-child(4) {
                            width: 100px !important;
                        }
                        &:nth-child(5) {
                            width: 100px !important;
                        }
                    }
                }
                .commodityFrom_body {
                    width: 100%;
                    padding: 10px 8px;
                    box-sizing: border-box;
                    background: rgba(0,224,255,0.3);
                    border-radius: 0 0 8px 8px;
                    display: flex;
                    flex-direction: column;
                    .commodityFrom_body_content {
                        width: 100%;
                        display: flex;
                        flex-direction: column;
                        .commodityFrom_body_content_item {
                            width: 100%;
                            height: 45px;
                            display: flex;
                            align-items: center;
                            margin-bottom: 6px;
                            position: relative;
                            transition: .5s;
                            &:hover .commodityFrom_body_content_item_tips {
                                transform: translate(100%, 0%);
                                opacity: 1;
                                z-index: 1;
                            }
                            .commodityFrom_body_content_item_tips {
                                transition: .5s;
                                position: absolute;
                                padding: 0 4px;
                                box-sizing: border-box;
                                right: -16px;
                                top: 0;
                                opacity: 0;
                                transform: translate(0%, 0%);
                                z-index: -1;
                                height: 45px;
                                display: flex;
                                align-items: center;
                                background: rgba(0,224,255,0.3);
                                border-radius: 8px;
                                image {
                                    width: 32px;
                                    height: 32px;
                                    cursor: pointer;
                                }
                            }
                            .commodityFrom_body_content_item_num {
                                width: 126px;
                                height: 100%;
                                padding: 0 15px;
                                box-sizing: border-box;
                                background: #FFFFFF;
                                border-radius: 8px;
                                margin-right: 6px;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                position: relative;
                                &:hover {
                                    .drop-top {
                                        z-index: 5;
                                        opacity: 1;
                                    }
                                }
                                &:nth-child(4) {
                                    width: 100px !important;
                                }
                                &:nth-child(5) {
                                    width: 100px !important;
                                    margin-right: 0 !important;
                                }
                                &:nth-child(2) {
                                    cursor: pointer;
                                }
                                &:nth-child(3) {
                                    cursor: pointer;
                                    flex: 1 !important;
                                }
                                text {
                                    text-align: center;
                                    width: 100%;
                                    font-size: 16px;
                                    font-family: PingFangSC-Medium, PingFang SC;
                                    font-weight: 500;
                                    color: #111111;
                                    overflow: hidden;
                                    white-space: nowrap;
                                    text-overflow: ellipsis;
                                }
                                .drop-top {
                                    transition: .5s;
                                    z-index: -2;
                                    opacity: 0;
                                    position: absolute;
                                    top: 0;
                                    left: 0;
                                    white-space: nowrap;
                                    transform: translate(0, -100%);
                                    padding: 5px 15px;
                                    box-sizing: border-box;
                                    line-height: 40px;
                                    background: rgba(0, 0, 0, 0.8);
                                    border-radius: 10px;
                                    color: #FFFFFF;
                                    font-size: 16px;
                                    font-weight: 500;
                                }
                                .commodityFrom_body_content_item_num_img {
                                    width: 28px;
                                    height: 28px;
                                    display: flex;
                                    align-items: center;
                                    justify-content: center;
                                    margin-right: 4px;
                                    image {
                                        width: 100%;
                                        height: 100%;
                                    }
                                }
                                input {
                                    font-size: 16px;
                                    font-family: PingFangSC-Medium, PingFang SC;
                                    font-weight: 500;
                                    color: #111111;
                                    text-align: center;
                                }
                                .drop-down::-webkit-scrollbar {
                                    width: 6px;
                                    background: rgba(255,255,255,0.5);
                                    border-radius: 4px;
                                }
                                .drop-down::-webkit-scrollbar-thumb {
                                    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                                    background: rgba(255,255,255,0.8);
                                }
                                .drop-down {
                                    position: absolute;
                                    bottom: 0;
                                    left: 0;
                                    width: 100%;
                                    min-height: 0;
                                    max-height: 260px;
                                    overflow-y: scroll;
                                    overflow-x: hidden;
                                    height: auto;
                                    transform: translate(0%, 100%);
                                    background: linear-gradient(180deg, #518198 0%, #033B58 100%);
                                    box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.19);
                                    border-radius: 0px 0px 8px 8px;
                                    // display: flex;
                                    // flex-direction: column;
                                    transition: .5s;
                                    .drop-down-item {
                                        width: 100%;
                                        height: 52px;
                                        // padding: 0 10px;
                                        // box-sizing: border-box;
                                        // overflow: hidden;
                                        // white-space: nowrap;
                                        // text-overflow: ellipsis;
                                        cursor: pointer;
                                        display: flex;
                                        align-items: center;
                                        justify-content: center;
                                        padding: 0 10px;
                                        box-sizing: border-box;
                                        &:hover {
                                            text {
                                                color: #FFF200;
                                            }
                                        }
                                        text {
                                            width: 100%;
                                            text-align: center;
                                            font-size: 16px;
                                            font-family: PingFangSC-Regular, PingFang SC;
                                            font-weight: 400;
                                            color: #FFFFFF;
                                            overflow: hidden;
                                            white-space: nowrap;
                                            text-overflow: ellipsis;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .commodityFrom_body_total {
                        width: 100%;
                        height: 45px;
                        display: flex;
                        align-items: center;
                        .commodityFrom_body_total_item {
                            width: 100px;
                            height: 100%;
                            background: rgba(255,255,255,0.4);
                            border-radius: 8px;
                            margin-right: 6px;
                            font-size: 16px;
                            font-family: SourceHanSansSC-Bold, SourceHanSansSC;
                            font-weight: bold;
                            color: #FFF200;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            input {
                                font-size: 16px;
                                font-family: SourceHanSansSC-Bold, SourceHanSansSC;
                                font-weight: bold;
                                color: #FFF200;
                                text-align: center;
                            }
                            &:first-child {
                                flex: 1;
                                display: flex;
                                align-items: center;
                                justify-content: flex-end;
                                font-size: 16px;
                                font-family: SourceHanSansSC-Medium, SourceHanSansSC;
                                font-weight: 500;
                                color: #FFFFFF;
                            }
                            &:last-child {
                                margin-right: 0 !important;
                            }
                        }
                    }
                }
            }
            .productCategory {
                width: 100%;
                padding: 0 22px;
                box-sizing: border-box;
                margin-top: 10px;
                .productCategory_list {
                    width: 100%;
                    padding: 10px 20px 0px 20px;
                    box-sizing: border-box;
                    background: rgba(0,224,255,0.18);
                    border-radius: 8px;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    flex-wrap: wrap;
                    margin-bottom: 30px;
                    .productCategory_list_zw {
                        width: 20%;
                        height: 0;
                    }
                    .productCategory_active {
                        background: rgba(255,255,255,0.24) !important;
                        border-radius: 8px !important;
                    }
                    .productCategory_list_item {
                        width: 20%    ;
                        height: 108px;
                        display: flex;
                        transition: .5s;
                        flex-direction: column;
                        align-items: center;
                        justify-content: center;
                        margin-bottom: 12px;
                        cursor: pointer;
                        &:hover {
                            background: rgba(255,255,255,0.24) !important;
                            border-radius: 8px !important;
                        }
                        image {
                            width: 52px;
                            height: 52px;
                            margin-bottom: 4px;
                        }
                        text {
                            font-size: 16px;
                            font-family: SourceHanSansSC-Normal, SourceHanSansSC;
                            font-weight: 400;
                            color: #FFFFFF;
                        }
                    }
                }
            }
            .productPage {
                width: 100%;
                padding: 0 22px;
                box-sizing: border-box;
                margin-top: 16px;
                .productPage_head {
                    width: 100%;
                    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%);
                    border-radius: 8px 8px 0px 0px;
                    .productPage_head_item {
                        flex: 1;
                        height: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        cursor: pointer;
                        position: relative;
                        &:hover {
                            border-radius: 8px 8px 0px 0px;
                            background: linear-gradient(360deg, #025170 0%, #529DB9 100%) !important;
                        }
                        &:hover image {
                            transform: rotate(180deg);
                        }
                        &:hover .productPage_xl {
                            transform: translate(0%, 100%);
                            display: block;
                            animation: move 0.5s 0s;
                        }
                        @keyframes move {
                            0%{
                                opacity: 0;
                            }
                            100%{
                                opacity: 1;
                            }
                        }
                        .productPage_xl::-webkit-scrollbar {
                            width: 6px;
                            background: rgba(255,255,255,0.5);
                            border-radius: 4px;
                        }
                        .productPage_xl::-webkit-scrollbar-thumb {
                            box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                            background: rgba(255,255,255,0.8);
                        }
                        .productPage_xl {
                            transition: .3s;
                            position: absolute;
                            bottom: 0;
                            left: 0;
                            min-height: 0;
                            max-height: 260px;
                            overflow-y: scroll;
                            overflow-x: hidden;
                            height: auto;
                            display: none;
                            z-index: 3;
                            transform: translate(0%, 90%);
                            width: 100%;
                            background: linear-gradient(180deg, #518198 0%, #033B58 100%);
                            box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.19);
                            border-radius: 0px 0px 8px 8px;
                            .productPage_xl_iten {
                                width: 100%;
                                height: 40px;
                                line-height: 40px;
                                text-align: center;
                                cursor: pointer;
                                padding: 0 10px;
                                box-sizing: border-box;
                                &:hover {
                                    text {
                                        color: #FFF200;
                                    }
                                }
                                text {
                                    width: 100%;
                                    text-align: center;
                                    font-size: 16px;
                                    font-family: PingFangSC-Regular, PingFang SC;
                                    font-weight: 400;
                                    color: #FFFFFF;
                                    overflow: hidden;
                                    white-space: nowrap;
                                    text-overflow: ellipsis;
                                }
                            }
                        }
                        text {
                            font-size: 16px;
                            font-family: SourceHanSansSC-Regular, SourceHanSansSC;
                            font-weight: 400;
                            color: #FFFFFF;
                        }
                        image {
                            transition: .3s;
                            width: 14px;
                            height: 10px;
                            margin-left: 4px;
                            margin-top: 7px;
                            transform: rotate(0deg);
                        }
                    }
                }
                .productPage_pk {
                    width: 100%;
                    margin-bottom: 32px;
                    display: flex;
                    align-items: center;
                    .productPage_pk_shop {
                        flex: 1;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        flex-direction: column;
                        .productPage_pk_shop_sp {
                            width: 100px;
                            height: 100px;
                            margin-top: 84px;
                            cursor: pointer;
                            margin-bottom: 52px;
                            image {
                                width: 100%;
                                height: 100%;
                            }
                        }
                        .productPage_pk_shop_sp1 {
                            width: 184px;
                            height: 200px;
                            background: linear-gradient(180deg, rgba(225,255,252,0.8) 0%, rgba(179,255,252,0.61) 36%, rgba(0,255,251,0.36) 100%);
                            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;
                            cursor: pointer;
                            .productPage_pk_shop_sp1_img {
                                width: 100px;
                                height: 100px;
                                image {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                            text {
                                width: 100%;
                                font-size: 16px;
                                font-family: SourceHanSansSC-Medium, SourceHanSansSC;
                                font-weight: 500;
                                color: #FFFFFF;
                                margin-top: 18px;
                                overflow: hidden;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                            }
                        }
                        .productPage_pk_shop_t {
                            width: 254px;
                            height: 76px;
                            image {
                                width: 100%;
                                height: 100%;
                            }
                        }
                    }
                    .productPage_pk_z {
                        flex-shrink: 0;
                        width: 100px;
                        height: 50px;
                        cursor: pointer;
                        image {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
                .productPage_shop {
                    width: 100%;
                    margin-top: 12px;
                    display: flex;
                    justify-content: space-between;
                    flex-wrap: wrap;
                    .productPage_shop_zw {
                        width: 168px;
                        height: 0;
                    }
                    .productPage_shop_item {
                        width: 168px;
                        // height: 204px;
                        margin-bottom: 12px;
                        cursor: pointer;
                        background: rgba(0,224,255,0.18);
                        border-radius: 8px;
                        display: flex;
                        transition: .5s;
                        padding: 15px;
                        box-sizing: border-box;
                        flex-direction: column;
                        // justify-content: center;
                        align-items: center;
                        box-sizing: border-box;
                        white-space: pre-wrap;
                        word-break: break-all;
                        text-align: center;
                        &:hover {
                            background: linear-gradient(180deg, rgba(0,224,255,0.3) 0%, rgba(255,255,255,0.41) 100%);
                            border-radius: 8px;
                            border: 2px solid #FFFFFF;
                            box-sizing: border-box;
                        }
                        .productPage_shop_item_img {
                            width: 136px;
                            height: 136px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            overflow: hidden;
                            image {
                                width: 100%;
                                height: 100%;
                            }
                        }
                        text {
                            width: 100%;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            display: -webkit-box;
                            -webkit-line-clamp: 2;
                            -webkit-box-orient: vertical;
                            font-size: 16px;
                            font-family: SourceHanSansSC-Normal, SourceHanSansSC;
                            font-weight: 400;
                            color: #FFFFFF;
                            margin-top: 12px;
                        }
                    }
                }
                .productPage_parameter {
                    width: 100%;
                    display: flex;
                    align-items: flex-start;
                    justify-content: space-between;
                    margin-bottom: 30px;
                    .productPage_parameter_item {
                        width: 49%;
                        &:first-child {
                            margin-right: 18px;
                        }
                        .productPage_parameter_item_head {
                            width: 100%;
                            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;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                            text {
                                width: 100%;
                                text-align: center;
                                font-size: 16px;
                                font-family: SourceHanSansSC-Medium, SourceHanSansSC;
                                font-weight: 500;
                                color: #FFFFFF;
                                overflow: hidden;
                                white-space: nowrap;
                                text-overflow: ellipsis;
                            }
                        }
                        .productPage_parameter_item_content {
                            width: 100%;
                            padding: 14px;
                            box-sizing: border-box;
                            background: rgba(0,224,255,0.3);
                            border-radius: 0px 0px 8px 8px;
                            display: flex;
                            flex-direction: column;
                            .productPage_parameter_item_content_price {
                                padding: 16px 0;
                                box-sizing: border-box;
                                background: #FFFFFF;
                                border-radius: 8px;
                                display: flex;
                                align-items: center;
                                .zdj {
                                    flex: 1;
                                    display: flex;
                                    flex-direction: column;
                                    align-items: flex-start;
                                    justify-content: center;
                                    margin-left: 20px;
                                    text {
                                        &:first-child {
                                            font-size: 16px;
                                            font-family: SourceHanSansSC-Regular, SourceHanSansSC;
                                            font-weight: 400;
                                            color: #333333;
                                        }
                                        &:last-child {
                                            font-size: 16px;
                                            font-family: SourceHanSansSC-Bold, SourceHanSansSC;
                                            font-weight: bold;
                                            color: #222222;
                                            margin-top: 10px;
                                        }
                                    }
                                }
                                .rsj {
                                    flex: 1;
                                    display: flex;
                                    flex-direction: column;
                                    align-items: flex-start;
                                    justify-content: center;
                                    text {
                                        &:first-child {
                                            font-size: 16px;
                                            font-family: SourceHanSansSC-Regular, SourceHanSansSC;
                                            font-weight: 400;
                                            color: #333333;
                                        }
                                        &:last-child {
                                            font-size: 16px;
                                            font-family: SourceHanSansSC-Bold, SourceHanSansSC;
                                            font-weight: bold;
                                            color: #F10000;
                                            margin-top: 10px;
                                        }
                                    }
                                }
                            }
                            .productPage_parameter_item_content_nr {
                                padding: 16px 18px;
                                box-sizing: border-box;
                                background: #FFFFFF;
                                border-radius: 8px;
                                margin-top: 12px;
                                display: flex;
                                flex-direction: column;
                                .paramline{
                                    border-bottom: #c7c9ce 2px dashed;
                                    margin-bottom: 15px;
                                } 
                                .item {
                                    display: flex;
                                    align-items: flex-start;
                                    margin-bottom: 15px;
                                    &:last-child {
                                        margin-bottom: 0 !important;
                                    }
                                    .label {
                                        flex-shrink: 0;
                                        font-size: 16px;
                                        font-family: SourceHanSansSC-Normal, SourceHanSansSC;
                                        font-weight: 400;
                                        color: #222222;
                                    }
                                    .value {
                                        flex: 1;
                                        font-size: 16px;
                                        font-family: SourceHanSansSC-Normal, SourceHanSansSC;
                                        font-weight: 400;
                                        color: #222222;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
</style>

 server/company/src/main/java/com/doumee/api/business/WebParamController.java

@@ -31,12 +31,17 @@
    @Autowired
    private WebParamService webParamService;


    @ApiOperation("获取当前登录企业配置信息")
    @GetMapping("/getByLogin")
//    @RequiresPermissions("business:webparam:query")
    public ApiResponse<WebParam> getByLogin() {
        return ApiResponse.success(webParamService.findOne());
    }
    @ApiOperation("获取当前登录企业配置信息1.0.2")
    @GetMapping("/getByLoginNew")
//    @RequiresPermissions("business:webparam:query")
    public ApiResponse<WebParam> getByLoginNew() {
        return ApiResponse.success(webParamService.findOneNew());
    }

    @ApiOperation("更新企业配置信息")
@@ -46,5 +51,11 @@
        webParamService.renew(updateWebParamDTO);
        return ApiResponse.success("操作成功");
    }
    @ApiOperation("更新企业配置信息1.0.2")
    @PostMapping("/renewUpdate")
    public ApiResponse renewUpdate(@RequestBody UpdateWebParamDTO updateWebParamDTO) {
        webParamService.renewUpdate(updateWebParamDTO);
        return ApiResponse.success("操作成功");
    }

}

 server/company/src/main/resources/application.yml

@@ -11,7 +11,7 @@
#  application:git
#    name: doumeemes
  profiles:
    active: pro
    active: dev

  # JSON返回配置
  jackson:

 server/service/src/main/java/com/doumee/dao/business/model/WebParam.java

@@ -75,6 +75,9 @@
    @ApiModelProperty(value = "内容范围尺寸")
    @ExcelColumn(name="内容范围尺寸")
    private String rangeSize;
    @ApiModelProperty(value = "1.0.2版本升级配置存储信息")
    @ExcelColumn(name="1.0.2版本升级配置存储信息")
    private String newParam;

    @ApiModelProperty(value = "前缀地址")
    @TableField(exist = false)

 server/service/src/main/java/com/doumee/dao/system/dto/UpdateWebParamDTO.java

@@ -29,6 +29,8 @@

    @ApiModelProperty(value = "PK台图")
    private String pkImg;
    @ApiModelProperty(value = "配置参数 1.0.2版本只需要传该参数")
    private String newParam;


}

 server/service/src/main/java/com/doumee/dao/system/vo/WebParamDetailVO.java

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,28 @@
package com.doumee.dao.system.vo;

import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;

import java.io.Serializable;

/**
 * @author Eva.Caesar Liu
 * @date 2023/02/14 11:14
 */
@Data
@ApiModel("页面配置顶层")
public class WebParamDetailVO implements Serializable {

    @ApiModelProperty(value = "是否默认 0默认 1自定义 2自定义渐变")
    private int isDefault;
    @ApiModelProperty(value = "参数配置1 ï¼ˆé¢œè‰²1")
    private String param1;
    @ApiModelProperty(value = "参数配置2 ï¼ˆé€æ˜Žåº¦1）")
    private String param2;
    @ApiModelProperty(value = "参数配置3 ï¼ˆé¢œè‰²2）")
    private String param3;
    @ApiModelProperty(value = "参数配置4 ï¼ˆé€æ˜Žåº¦2）")
    private String param4;

}

 server/service/src/main/java/com/doumee/dao/system/vo/WebParamVO.java

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,51 @@
package com.doumee.dao.system.vo;

import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;

import javax.validation.constraints.NotBlank;
import java.io.Serializable;

/**
 * @author Eva.Caesar Liu
 * @date 2023/02/14 11:14
 */
@Data
@ApiModel("页面配置顶层")
public class WebParamVO implements Serializable {
    public interface  KeyName{
        //内容区域尺寸：
        String pageSize = "pageSize";
        //背景颜色：
        String bgColor = "bgColor";
        //是否展示背景图片：
        String showBgImg = "showBgImg";
        //背景图片：
        String bgImg = "bgImg";
        //顶部主图：
        String topImg = "topImg";
        //PK台图：
        String pkImg = "pkImg";
        //表头背景颜色：
        String tableHeaderColor = "tableHeaderColor";
        //表头字体颜色：
        String tableWordColor = "tableWordColor";
        //选中字体颜色：
        String selectedWordColor = "selectedWordColor";
        //下拉框背景色：
        String pullColor = "pullColor";
        //搜索框背景色：
        String searchColor = "searchColor";
        //列表背景色：
        String listColor = "listColor";
        //分类背景色：
        String cateColor = "cateColor";
    }
    @ApiModelProperty(value = "位置 0内容区域尺寸")
    private String key;

    @ApiModelProperty(value = "参数配置详情")
    private WebParamDetailVO val;

}

 server/service/src/main/java/com/doumee/service/business/WebParamService.java

@@ -15,6 +15,9 @@
public interface WebParamService {

    WebParam findOne();
    WebParam findOneNew();

    void renew(UpdateWebParamDTO updateWebParamDTO);

    void renewUpdate(UpdateWebParamDTO updateWebParamDTO);
}

 server/service/src/main/java/com/doumee/service/business/impl/WebParamServiceImpl.java

@@ -1,6 +1,8 @@
package com.doumee.service.business.impl;

import com.doumee.biz.system.SystemDictDataBiz;
import com.doumee.core.constants.ResponseStatus;
import com.doumee.core.exception.BusinessException;
import com.doumee.core.model.LoginUserInfo;
import com.doumee.core.model.PageData;
import com.doumee.core.model.PageWrap;
@@ -14,6 +16,7 @@
import com.baomidou.mybatisplus.core.conditions.update.UpdateWrapper;
import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import org.apache.commons.lang3.StringUtils;
import org.apache.shiro.SecurityUtils;
import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
@@ -61,6 +64,16 @@
        return webParam;
    }

    @Override
    public WebParam findOneNew() {
        LoginUserInfo user = (LoginUserInfo) SecurityUtils.getSubject().getPrincipal();
        QueryWrapper<WebParam> wrapper = new QueryWrapper<>();
        wrapper.lambda().eq(WebParam::getCompanyId,user.getCompanyId());
        wrapper.last(" limit 1  ");
        WebParam webParam = webParamMapper.selectOne(wrapper);
        return webParam;
    }


    @Override
    public void renew(UpdateWebParamDTO updateWebParamDTO) {
@@ -84,6 +97,30 @@
            webParamMapper.updateById(webParam);
        }
    }

    @Override
    public void  renewUpdate(UpdateWebParamDTO updateWebParamDTO){
        if(StringUtils.isBlank(updateWebParamDTO.getNewParam())){
            throw  new BusinessException(ResponseStatus.BAD_REQUEST);
        }
        LoginUserInfo user = (LoginUserInfo) SecurityUtils.getSubject().getPrincipal();
        QueryWrapper<WebParam> wrapper = new QueryWrapper<>();
        wrapper.lambda().eq(WebParam::getCompanyId,user.getCompanyId());
        wrapper.last(" limit 1  ");
        WebParam webParam = webParamMapper.selectOne(wrapper);
        if(Objects.isNull(webParam)){
            webParam = new WebParam();
            BeanUtils.copyProperties(updateWebParamDTO,webParam);
            webParam.setCreateTime(new Date());
            webParam.setDeleted(Constants.ZERO);
            webParam.setCompanyId(user.getCompanyId());
            webParam.setCreateUser(user.getId());
            webParamMapper.insert(webParam);
        }else{
            BeanUtils.copyProperties(updateWebParamDTO,webParam);
            webParam.setUpdateUser(user.getId());
            webParam.setUpdateTime(new Date());
            webParamMapper.updateById(webParam);
        }
    }

}

 server/zhubo/src/main/java/com/doumee/api/business/WebParamController.java

@@ -36,6 +36,11 @@
    public ApiResponse<WebParam> getByLogin() {
        return ApiResponse.success(webParamService.findOne());
    }
    @ApiOperation("获取当前登录企业配置信息1.0.2")
    @GetMapping("/getByLoginNew")
    public ApiResponse<WebParam> getByLoginNew() {
        return ApiResponse.success(webParamService.findOneNew());
    }

    @ApiOperation("更新企业配置信息")
    @PostMapping("/renew")

 server/zhubo/src/main/resources/application.yml

@@ -11,7 +11,7 @@
#  application:
#    name: doumeemes
  profiles:
    active: pro
    active: dev

  # JSON返回配置
  jackson: