Browse Source

Merge branch '底部样式'

xiaohaizhao 1 năm trước cách đây
mục cha
commit
40a50f456f

+ 24 - 2
components/bottomForm.vue

@@ -1,7 +1,8 @@
 <template>
     <view>
-        <bottom1 />
-        <bottom2 />
+        <bottom1 v-if="bottomType == '默认黑色预约报名样式'" :ownertable="ownertable" :ownerid="ownerid" :type="type" :typemx="typemx"
+            :extrajson="extrajson" />
+        <bottom2 v-else-if="bottomType == '装修预算'" />
     </view>
 </template>
 
@@ -13,6 +14,27 @@ export default {
         bottom1,
         bottom2
     },
+    props: {
+        bottomType: {
+            type: String,
+            default: "默认黑色预约报名样式"
+        },
+        ownertable: {
+            type: String
+        },
+        ownerid: {
+            type: [String, Number]
+        },
+        type: {
+            type: String
+        },
+        typemx: {
+            type: String
+        },
+        extrajson: {
+            type: Object
+        }
+    },
     data() {
         return {
 

+ 79 - 15
components/bottomModules/bottom1.vue

@@ -6,20 +6,20 @@
         <view class="function">
             <view class="cn-title">预约免费设计</view>
             <view class="en-title">Appointment Free Design</view>
-
             <view class="form">
-                <view class="text">
+                <view class="text" @click="setFocus('姓名')">
                     <view class="bg" />
                     <view class="iconfont icon-renyuan-hui" />
-                    <input class="input" type="text" v-model="content.name" placeholder="请输入您的姓名">
+                    <input class="input" :focus="focus == '姓名'" type="text" v-model="content.name" placeholder="请输入您的姓名">
                 </view>
-
-                <view class="text">
+                <view class="text" @click="setFocus('手机号')">
                     <view class="bg" />
                     <view class="iconfont icon-dianhua-hui" />
-                    <input class="input" type="number" v-model="content.phoneNumber" placeholder="请输入您的电话号码">
+                    <input class="input" :focus="focus == '手机号'" :disabled="!manualOperation" type="number"
+                        v-model="content.phonenumber" placeholder="请输入您的电话号码">
+                    <button v-if="!manualOperation" class="button" open-type="getPhoneNumber"
+                        @getphonenumber="getphonenumber">123123323223323222222</button>
                 </view>
-
                 <picker mode='region' @change="getRegion">
                     <view class="text">
                         <view class="bg" />
@@ -32,24 +32,29 @@
                         </view>
                     </view>
                 </picker>
-
                 <view class="text textarea-box">
                     <view class="bg" />
                     <view class="iconfont icon-dizhi-hui1" />
                     <textarea class="textarea" v-model="content.address" placeholder="请输入您的具体地址(街道、楼号、门牌号等)" />
                 </view>
-
-                <view class="but" hover-class="navigator-hover" @click="submit">
+                <view v-if="!content.name || !content.phonenumber || !content.province" class="but forbidden"
+                    hover-class="navigator-hover" @click="reminder">
                     立即免费预约 >
                 </view>
-
+                <view v-else class="but" hover-class="navigator-hover" @click="loading ? '' : submit()">
+                    <u-loading-icon v-if="loading" />
+                    <text v-else>
+                        立即免费预约 >
+                    </text>
+                </view>
             </view>
         </view>
     </view>
 </template>
-
 <script>
+import contact from "../contact.vue"
 export default {
+    components: { contact },
     name: "bottom1",
     props: {
         ownertable: {
@@ -65,14 +70,18 @@ export default {
             type: String
         },
         extrajson: {
-            type: Object
+            type: Object,
+            default: {}
         }
     },
     data() {
         return {
+            focus: '',
+            loading: false,
+            manualOperation: false,
             content: {
                 name: "",
-                phoneNumber: "",
+                phonenumber: "",
                 address: "",
                 "province": "",
                 "city": "",
@@ -81,6 +90,12 @@ export default {
         }
     },
     methods: {
+        setFocus(name) {
+            this.focus = '';
+            setTimeout(() => {
+                this.focus = name;
+            })
+        },
         submit() {
             let content = this.content;
             content.ownertable = this.ownertable;
@@ -88,11 +103,18 @@ export default {
             content.type = this.type;
             content.typemx = this.typemx;
             content.extrajson = this.extrajson;
+            if (!new RegExp('^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\\d{8}$').test(content.phonenumber)) return uni.showModal({
+                title: '提示',
+                content: '手机号码格式错误',
+                showCancel: false,
+            })
+            this.loading = true;
             this.$Http.basic({
                 "id": 20240513144602,
                 content
             }).then(res => {
                 console.log("提交预约单", res)
+                this.loading = false;
                 if (this.cutoff(res.msg)) return;
                 uni.showModal({
                     title: '提交成功',
@@ -114,11 +136,39 @@ export default {
             this.content.province = e.detail.value[0];
             this.content.city = e.detail.value[1];
             this.content.county = e.detail.value[2];
+        },
+        reminder() {
+            uni.showToast({
+                title: "请先完成填写后提交",
+                icon: "none",
+                duration: 1500,
+            })
+        },
+        getphonenumber(e) {
+            if (e.detail.code) {
+                this.$Http.basic({
+                    "id": 20240520110702,
+                    "content": {
+                        "systemclient": "marketingtool",
+                        "code": e.detail.code
+                    }
+                }).then(res => {
+                    console.log("获取手机号", res)
+                    this.manualOperation = true;
+                    try {
+                        this.content.phonenumber = res.data.purePhoneNumber;
+                    } catch (error) {
+                        this.focus = '手机号';
+                    }
+                })
+            } else {
+                this.manualOperation = true;
+                this.focus = '手机号';
+            }
         }
     },
 }
 </script>
-
 <style lang="scss" scoped>
 .box {
     position: relative;
@@ -177,6 +227,16 @@ export default {
                 box-sizing: border-box;
                 margin-bottom: 10px;
 
+                .button {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    z-index: 2;
+                    opacity: 0;
+                }
+
                 .input {
                     color: #fff;
                     flex: 1;
@@ -230,4 +290,8 @@ export default {
         }
     }
 }
+
+.forbidden {
+    opacity: .6;
+}
 </style>

+ 2 - 0
components/contact.vue

@@ -21,6 +21,7 @@ export default {
     height: 100%;
     background: none;
     line-height: 12px;
+    margin: 0;
 }
 
 .button::after {
@@ -28,6 +29,7 @@ export default {
     width: 0;
     height: 0;
     border-radius: 0;
+    margin: 0;
 }
 
 .button {

+ 2 - 4
packageA/advertising/modules/page.vue

@@ -6,18 +6,16 @@
                 @click="onClick(item, index)" />
         </block>
         <u-parse v-else-if="detail.type == 3" :content="detail.content" />
-
-        <bottom1 v-if="detail.sharepagecontrol.style_bottom == '默认黑色预约报名样式'" />
+        <bottomForm v-if="detail.sharepagecontrol.style_bottom" :bottomType="detail.sharepagecontrol.style_bottom"
+            :type="detail.sharepagecontrol.style_signup" ownertable="sat_sharematerial" :ownerid="detail.sat_sharematerialid" />
         <view v-else style="height: 10px;" />
     </view>
 </template>
 
 <script>
 import { viewImage } from "../../../utils/settleFiles";
-import bottom1 from "../../../components/bottomModules/bottom1.vue";
 export default {
     name: "advertisingPage",
-    components: { bottom1 },
     data() {
         return {
             detail: {

+ 2 - 3
packageCase/imgs/detail.vue

@@ -68,18 +68,17 @@
                 </l-painter-view>
             </l-painter>
         </view>
-        <bottomForm />
+        <bottomForm type="效果图" ownertable="sat_sharematerial" :ownerid="sat_sharematerialid" />
     </My_listbox>
 </template>
 
 <script>
-import bottom1 from "../../components/bottomModules/bottom1.vue"
 import lPainter from "../../uni_modules/lime-painter/components/l-painter/l-painter.vue"
 import lPainterText from "../../uni_modules/lime-painter/components/l-painter-text/l-painter-text.vue"
 import lPainterView from "../../uni_modules/lime-painter/components/l-painter-view/l-painter-view.vue"
 import lPainterQrcode from "../../uni_modules/lime-painter/components/l-painter-qrcode/l-painter-qrcode.vue"
 export default {
-    components: { bottom1, lPainter, lPainterQrcode, lPainterText, lPainterView },
+    components: { lPainter, lPainterQrcode, lPainterText, lPainterView },
     data() {
         return {
             sat_sharematerialid: null,

+ 2 - 6
packageCase/product/detail.vue

@@ -1,6 +1,5 @@
 <template>
     <My_listbox ref="List" @getlist="getDetail">
-
         <swiper class="swiper" v-if="slides.length" :indicator-dots="slides.length > 1" indicator-color="#DC808B"
             indicator-active-color="#C30D23">
             <swiper-item class="swiper-item" v-for="item in slides" :key="item.url">
@@ -11,7 +10,6 @@
                 </view>
             </swiper-item>
         </swiper>
-
         <view class="head">
             <view class="line1">
                 <view class="left">
@@ -33,7 +31,6 @@
             <view class="subtitle">尺寸:{{ detail.spec || '--' }}</view>
             <view class="subtitle">价格:{{ CNY(detail.price) || '--' }}</view>
         </view>
-
         <view class="introduce">
             <block v-if="detail.content">
                 <view class="introduce-title">
@@ -45,7 +42,6 @@
             </block>
         </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>
@@ -58,17 +54,17 @@
                 </l-painter-view>
             </l-painter>
         </view>
+        <bottomForm type="产品" ownertable="sa_fad" :ownerid="sa_fadid" />
     </My_listbox>
 </template>
 
 <script>
-import bottom1 from "../../components/bottomModules/bottom1.vue"
 import lPainter from "../../uni_modules/lime-painter/components/l-painter/l-painter.vue"
 import lPainterText from "../../uni_modules/lime-painter/components/l-painter-text/l-painter-text.vue"
 import lPainterView from "../../uni_modules/lime-painter/components/l-painter-view/l-painter-view.vue"
 import lPainterQrcode from "../../uni_modules/lime-painter/components/l-painter-qrcode/l-painter-qrcode.vue"
 export default {
-    components: { bottom1, lPainter, lPainterQrcode, lPainterText, lPainterView },
+    components: { lPainter, lPainterQrcode, lPainterText, lPainterView },
     data() {
         return {
             sa_fadid: null,

+ 1 - 1
store/budget/result.vue

@@ -20,7 +20,7 @@
                 </view>
             </view>
         </view>
-        <bottomForm submitType="品质服务" :extrajson="extrajson" />
+        <bottomForm submitType="品质服务" :extrajson="extrajson" typemx="装修预算" />
     </view>
 </template>