Merge branch '底部样式'

components/bottomForm.vue

@@ -0,0 +1,24 @@
+<template>
+    <view>
+        <bottom1 />
+        <bottom2 />
+    </view>
+</template>
+
+<script>
+import bottom1 from "./bottomModules/bottom1.vue"
+import bottom2 from "./bottomModules/bottom2.vue"
+export default {
+    components: {
+        bottom1,
+        bottom2
+    },
+    data() {
+        return {
+
+        }
+    },
+}
+</script>
+
+<style></style>

components/bottomModules/bottom1.vue

@@ -11,24 +11,38 @@
                 <view class="text">
                     <view class="bg" />
                     <view class="iconfont icon-renyuan-hui" />
-                    <input class="input" type="text" v-model="name" placeholder="请输入您的姓名">
+                    <input class="input" type="text" v-model="content.name" placeholder="请输入您的姓名">
                 </view>
 
                 <view class="text">
                     <view class="bg" />
                     <view class="iconfont icon-dianhua-hui" />
-                    <input class="input" type="number" v-model="phoneNumber" placeholder="请输入您的电话号码">
+                    <input class="input" type="number" v-model="content.phoneNumber" placeholder="请输入您的电话号码">
                 </view>
 
+                <picker mode='region' @change="getRegion">
+                    <view class="text">
+                        <view class="bg" />
+                        <view class="iconfont icon-dizhi-hui1" />
+                        <view style="color: #fff;" v-if="content.province">
+                            {{ this.getCity(content, false) }}
+                        </view>
+                        <view v-else style="opacity: .3;color: #fff;font-size: 14px;">
+                            请选择城市
+                        </view>
+                    </view>
+                </picker>
+
                 <view class="text textarea-box">
                     <view class="bg" />
                     <view class="iconfont icon-dizhi-hui1" />
-                    <textarea class="textarea" v-model="address" placeholder="请输入您的具体地址（省、市、区/县）" />
+                    <textarea class="textarea" v-model="content.address" placeholder="请输入您的具体地址（街道、楼号、门牌号等）" />
                 </view>
 
                 <view class="but" hover-class="navigator-hover" @click="submit">
                     立即免费预约 >
                 </view>
+
             </view>
         </view>
     </view>
@@ -37,24 +51,69 @@
 <script>
 export default {
     name: "bottom1",
+    props: {
+        ownertable: {
+            type: String
+        },
+        ownerid: {
+            type: [String, Number]
+        },
+        type: {
+            type: String
+        },
+        typemx: {
+            type: String
+        },
+        extrajson: {
+            type: Object
+        }
+    },
     data() {
         return {
-            name: "",
-            phoneNumber: "",
-            address: ""
+            content: {
+                name: "",
+                phoneNumber: "",
+                address: "",
+                "province": "",
+                "city": "",
+                "county": "",
+            }
         }
     },
     methods: {
         submit() {
-            console.log(this.name)
-            console.log(this.phoneNumber)
-            console.log(this.address)
-            uni.showModal({
-                title: '提交成功',
-                content: '感谢您的支持，工作人员会第一时间跟您联系！',
-                showCancel: false,
-                confirmColor: '#C30D23',
+            let content = this.content;
+            content.ownertable = this.ownertable;
+            content.ownerid = this.ownerid;
+            content.type = this.type;
+            content.typemx = this.typemx;
+            content.extrajson = this.extrajson;
+            this.$Http.basic({
+                "id": 20240513144602,
+                content
+            }).then(res => {
+                console.log("提交预约单", res)
+                if (this.cutoff(res.msg)) return;
+                uni.showModal({
+                    title: '提交成功',
+                    content: '感谢您的支持，工作人员会第一时间跟您联系！',
+                    showCancel: false,
+                    confirmColor: '#C30D23',
+                })
+                this.content = {
+                    name: "",
+                    phoneNumber: "",
+                    address: "",
+                    "province": "",
+                    "city": "",
+                    "county": "",
+                };
             })
+        },
+        getRegion(e) {
+            this.content.province = e.detail.value[0];
+            this.content.city = e.detail.value[1];
+            this.content.county = e.detail.value[2];
         }
     },
 }
@@ -64,7 +123,7 @@ export default {
 .box {
     position: relative;
     width: 100vw;
-    height: 381px;
+    height: 436px;
 
     .image {
         width: 100%;

components/bottomModules/bottom2.vue

@@ -0,0 +1,214 @@
+<template>
+    <view class="box">
+        <view class="title">
+            免费帮您获取装修预算
+        </view>
+        <view class="total">
+            今日已有 <text class="num">258</text>位业主申请
+        </view>
+        <view class="input-box" hover-class="navigator-hover" @click="showBathroom = true">
+            <input type="digit" @input="onInput" placeholder="您房子的面积是多少？" style="color: #fff;"
+                placeholder-class="placeholder" />
+            <text class="unit">
+                m²
+            </text>
+        </view>
+        <view class="input-box" hover-class="navigator-hover" @click="showBathroom = true">
+            <view class="value">
+                {{ submitData.bathroom }}
+            </view>
+            <text class="iconfont icon-a-wodetiaozhuan" />
+        </view>
+        <u-action-sheet :actions="bathroomList" :show="showBathroom" cancelText="取消" @close="showBathroom = false"
+            @select="onSelect($event, 'bathroom')" />
+
+        <view class="input-box" hover-class="navigator-hover" @click="showWall = true">
+            <view class="value">
+                {{ submitData.wall }}
+            </view>
+            <text class="iconfont icon-a-wodetiaozhuan" />
+        </view>
+
+        <u-action-sheet :actions="wallList" :show="showWall" cancelText="取消" @close="showWall = false"
+            @select="onSelect($event, 'wall')" />
+
+        <view class="radio-box">
+            <u-radio-group v-model="submitData.type">
+                <u-radio v-for="item in radioList" style="margin-right: 20px;" :key="item.name" activeColor="#E3041F"
+                    labelColor="#FFFFFF" :customStyle="item.customStyle" :labelSize="tovw(14)" :label="item.name"
+                    :name="item.name" />
+            </u-radio-group>
+        </view>
+        <view class="submit" hover-class="navigator-hover" @click="toEstimate">
+            立即估算报价 <text class="iconfont icon-a-wodetiaozhuan" />
+        </view>
+        <view class="evenMore">
+            更多阳台空间、全屋顶墙柜门等报价，请咨询当地专卖店
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    name: "bottom2",
+    data() {
+        return {
+            submitData: {
+                "area": "100",
+                "wall": "1个背景墙",
+                "bathroom": "1厨1卫",
+                "type": "毛坯房装修"
+            },
+            radioList: [{
+                name: "毛坯房装修",
+                customStyle: { marginRight: this.tovw(26) }
+            }, {
+                name: "旧房装修",
+                customStyle: { marginRight: this.tovw(26) }
+            }, {
+                name: "精装房焕新"
+            }],
+            showWall: false,
+            showBathroom: false,
+            bathroomList: [{
+                name: '0厨0卫',
+            }, {
+                name: '1厨1卫',
+            }, {
+                name: '1厨2卫',
+            }, {
+                name: '1厨3卫',
+            }, {
+                name: '1厨>3卫',
+            }],
+            wallList: [{
+                name: '0个背景墙',
+            }, {
+                name: '1个背景墙',
+            }, {
+                name: '2个背景墙',
+            }, {
+                name: '3个背景墙',
+            }, {
+                name: '>3个背景墙',
+            }]
+        }
+    },
+    methods: {
+        onSelect({ name }, key) {
+            this.submitData[key] = name;
+        },
+        onInput(e) {
+            this.submitData.area = e.detail.value;
+            console.log("submitData", this.submitData)
+        },
+        toEstimate() {
+            uni.navigateTo({
+                url: '/store/budget/result?data=' + JSON.stringify(this.submitData)
+            });
+        }
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.box {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100vw;
+    padding: 30px 0;
+    background: radial-gradient(100% 0% at 50% 50%, #7E7E7E 0%, #787878 100%);
+
+    /deep/.placeholder {
+        color: #fff;
+        opacity: .6;
+    }
+
+    .title {
+        line-height: 22px;
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 16px;
+        color: #FFFFFF;
+        letter-spacing: 1px;
+    }
+
+    .total {
+        line-height: 17px;
+        font-family: PingFang SC, PingFang SC;
+        font-size: 12px;
+        color: #FFFFFF;
+        margin-top: 5px;
+        letter-spacing: 1.5px;
+
+        .num {
+            color: #FC9228;
+            padding: 0 5px;
+            letter-spacing: 0px;
+        }
+    }
+
+    .input-box {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        width: 315px;
+        height: 45px;
+        background: rgba(255, 255, 255, 0.2);
+        border-radius: 2px;
+        border: 1px solid rgba(255, 255, 255, 0.2);
+        box-sizing: border-box;
+        padding: 0 10px;
+        margin-top: 10px;
+
+        .value {
+            color: #FFFFFF;
+            font-size: 14px;
+        }
+
+        .iconfont {
+            color: #FFFFFF;
+            transform: rotate(90deg);
+        }
+
+        .unit {
+            color: #FFFFFF;
+        }
+    }
+
+    .radio-box {
+        height: 20px;
+        line-height: 20px;
+        margin-top: 20px;
+    }
+
+    .submit {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 315px;
+        height: 45px;
+        background: #FC9228;
+        border-radius: 2px;
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 14px;
+        color: #FFFFFF;
+        margin-top: 20px;
+
+        .iconfont {
+            font-size: 12px;
+            margin-left: 4px;
+        }
+    }
+
+    .evenMore {
+        margin-top: 10px;
+        line-height: 17px;
+        font-family: PingFang SC, PingFang SC;
+        font-size: 12px;
+        color: rgba(255, 255, 255, 0.8);
+    }
+}
+</style>

main.js

@@ -25,8 +25,8 @@ import my_form from './components/my_form.vue';
 Vue.component("my_form", my_form);
 import My_upload from './components/my-upload.vue';
 Vue.component("My_upload", My_upload);
-
-
+import bottomForm from './components/bottomForm.vue';
+Vue.component("bottomForm", bottomForm);
 
 
 //挂载接口

packageCase/imgs/detail.vue

@@ -56,7 +56,6 @@
             </view>
         </view>
         <storeInfo />
-        <bottom1 />
         <view style="position: absolute;z-index: -999;top: 0;">
             <l-painter ref="painter" hidden css="padding:10px;background:#fff;width: 148px;">
                 <l-painter-view>
@@ -69,6 +68,7 @@
                 </l-painter-view>
             </l-painter>
         </view>
+        <bottomForm />
     </My_listbox>
 </template>
 

pages.json

@@ -68,6 +68,8 @@
 			"path": "orderForm/insert"
 		}, {
 			"path": "budget/changePrice"
+		}, {
+			"path": "budget/result"
 		}, {
 			"path": "storeQRCode/index"
 		}]

store/budget/result.vue

@@ -0,0 +1,168 @@
+<template>
+    <view>
+        <view class="box">
+            <view class="title">
+                您的装修报价是：
+            </view>
+
+            <view class="price-box">
+                <view class="price">
+                    {{ CNY(price.min, '') }}
+                </view>
+                <view class="link">
+                    ~
+                </view>
+                <view class="price">
+                    {{ CNY(price.max, '') }}
+                </view>
+                <view class="unit">
+                    元
+                </view>
+            </view>
+        </view>
+        <bottomForm submitType="品质服务" :extrajson="extrajson" />
+    </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            extrajson: {},
+            price: {
+                min: 0,
+                max: 0
+            },
+            sa_storeid: 0
+        }
+    },
+    onLoad(options) {
+        console.log("options", options)
+        let data = JSON.parse(options.data);
+        this.extrajson = data;
+
+        uni.setNavigationBarTitle({
+            title: '装修预算'
+        });
+        const systemInitIsComplete = this.$Http.systemInitIsComplete;
+        if (!systemInitIsComplete || typeof systemInitIsComplete == 'object') {
+            this.$Http.HomePageStartRendering = render(this)
+        } else {
+            render(this)
+        }
+        function render(that) {
+            that.calculate(options.sa_storeid || uni.getStorageSync('shop').sa_storeid)
+        }
+    },
+    methods: {
+        calculate(sa_storeid) {
+            this.$Http.basic({
+                "id": 20240515131702,
+                "content": {
+                    sa_storeid
+                }
+            }).then(res => {
+                console.log("获取门店装修预算", res)
+                if (this.cutoff(res.msg)) return;
+                let extrajson = this.extrajson
+                let obj = {
+                    min: 0,
+                    max: 0
+                }
+                res.data.forEach(v => {
+                    switch (v.type) {
+                        case "厨房":
+                            obj.min += v.min_price * 6 * extrajson.bathroom[0]
+                            obj.max += v.max_price * 6 * extrajson.bathroom[0]
+                            break;
+                        case "卫浴":
+                            let num = extrajson.bathroom[2];
+                            if (num == '>') num = 4;
+                            obj.min += v.min_price * 4 * num;
+                            obj.max += v.max_price * 4 * num;
+                            break;
+                        case "背景墙":
+                            let bjq = extrajson.wall[0];
+                            if (bjq == '>') bjq = 4;
+                            obj.min += v.min_price * 4 * bjq;
+                            obj.max += v.max_price * 4 * bjq;
+                            break;
+                    }
+                })
+                this.price = obj;
+                this.sa_storeid = sa_storeid;
+                console.log(obj)
+            })
+        },
+        getSheraDate() {
+            return {
+                title: '您的装修报价是:', // 标题
+                path: "/store/budget/result?data=" + JSON.stringify(this.extrajson) + '&sa_storeid=' + this.sa_storeid, // 分享路径
+                imageUrl: ""// 分享图
+            };
+        }
+    },
+    onShareAppMessage(res) {
+        return this.getSheraDate()
+    },
+    onShareTimeline() {
+        return this.getSheraDate()
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.box {
+    width: 100vw;
+    padding: 30px 20px;
+    box-sizing: border-box;
+    background: radial-gradient(100% 0% at 50% 50%, #7E7E7E 0%, #787878 100%);
+
+    .title {
+        line-height: 22px;
+        font-family: PingFang SC, PingFang SC;
+        font-size: 16px;
+        color: #FFFFFF;
+    }
+
+    .price-box {
+        display: flex;
+        width: 100%;
+        margin-top: 15px;
+        align-items: center;
+
+        .price {
+            width: 146px;
+            height: 45px;
+            line-height: 45px;
+            text-align: center;
+            box-sizing: border-box;
+            background: rgba(255, 255, 255, 0.2);
+            border-radius: 2px;
+            border: 1px solid rgba(255, 255, 255, 0.2);
+            font-family: Source Han Sans SC, Source Han Sans SC;
+            font-weight: bold;
+            font-size: 24px;
+            color: #FFFFFF;
+        }
+
+        .link {
+            width: 14px;
+            text-align: center;
+            font-family: Source Han Sans SC, Source Han Sans SC;
+            font-weight: bold;
+            font-size: 24px;
+            color: #FFFFFF;
+            margin: 0 4px;
+            margin-right: 6px;
+        }
+
+        .unit {
+            font-family: PingFang SC, PingFang SC;
+            font-size: 14px;
+            color: #FFFFFF;
+            margin-left: 10px;
+        }
+    }
+}
+</style>

team/userCenter/personal.vue

@@ -154,9 +154,11 @@ export default {
             font-family: Source Han Sans SC, Source Han Sans SC;
             font-size: 14px;
             color: #666666;
+            flex-shrink: 0;
         }
 
         .value {
+            flex: 1;
             line-height: 20px;
             font-family: Source Han Sans SC, Source Han Sans SC;
             font-size: 14px;