jzmall_uni/pages/goods/infoCollect/infoCollect.vue

<template>
    <view class="info-collect-page">
        <!-- 产品信息 -->
        <view class="product-info">
            <view class="product-left">
                <!-- <image src="{{infoGoods.picUrl}}" mode="aspectFill"></image> {{infoGoods.name}} {{infoGoods.brief}} -->
                <image src="https://mall.zhaijieshi.cc/file/jzmall/weixin/new/icon-jpjzs.png" mode="aspectFill"></image>
            </view>
            <view class="product-right">
                <view>鲸品家政师</view>
                <view class="brief sub-color">服务类型：住家、白班、钟点工</view>
            </view>
        </view>
        <!-- 信息收集 -->
        <view class="collect-detail">
          <!--  <van-cell-group>
                <van-field
                    v-model="customerName"
                    label="客户名称"
                    placeholder-style="color:#85868A;font-size:24rpx;font-family: PingFangSC-Light, helvetica, 'Heiti SC';font-weight:normal"
                    placeholder="请输入客户名称"
                />
                <van-field
                    v-model="customerTel"
                    label="手  机"
                    placeholder-style="color:#85868A;font-size:24rpx; font-family: PingFangSC-Light, helvetica, 'Heiti SC';font-weight:normal"
                    placeholder="请输入手机号"
                    maxlength="11"
                />
                <van-cell title="住  址" is-link :value="address" @click="selectAddress" />
                <van-cell title="服务类型" is-link :value="serviceModelText" @click="showServicePicker" />
            </van-cell-group> -->
        </view>
        <view class="collect-tip jz-color">*9:30-19:30 3小时内回复；以外时间次日10:30前回复</view>
        <!-- 提交按钮 -->
        <view class="bottom-fixed-btn-wrapper">
            <!-- <van-button type="info" block round @tap.native="confirmSubmit">确认</van-button> -->
        </view>

       <!-- <van-popup :show="typePickerShow" position="bottom">
            <van-picker show-toolbar :columns="typeColumns" @cancel="onTypeCancel" @confirm="onTypeConfirm" />
        </van-popup>
        <van-popup :show="timePickerShow" position="bottom">
            <van-datetime-picker type="date" :value="currentDate" @cancel="onTimeCancel" @confirm="onTimeConfirm" :min-date="minDate" @formatter="formatterDate" />
        </van-popup> -->
    </view>
</template>

<script>
// import Dialog from '@vant/weapp/dialog/dialog';
const util = require('../../../utils/util');
const check = require('../../../utils/check');
const api = require('../../../config/api');
const app = getApp();
export default {
    data() {
        return {
            infoGoods: app.globalData.infoGoods,
            customerName: '',
            customerTel: '',
            address: '请选择住址',
            addressId: '',
            serviceModelText: '请选择',
            serviceModel: '',

            // startServiceTime:'请选择',
            typePickerShow: false,

            timePickerShow: false,

            serviceModelList: [
                {
                    id: '1',
                    name: '钟点工'
                },
                {
                    id: '2',
                    name: '白班保姆'
                },
                {
                    id: '3',
                    name: '住家保姆'
                }
                // {id:'4',name:'月嫂'},
                // {id:'5',name:'代班保姆-钟点工'},
                // {id:'6',name:'代班保姆-保姆'},
            ],

            // typeColumns:['钟点工','白班保姆','住家保姆','月嫂','代班保姆-钟点工','代班保姆-保姆'],
            typeColumns: ['钟点工', '白班保姆', '住家保姆'],

            currentDate: new Date().getTime(),
            minDate: new Date().getTime(),
            startServiceTime: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
        // let addressId = wx.getStorageSync('addressId');
        // if (addressId === "") {
        // 	addressId = 0;
        // }
        let addressId = app.globalData.infoAddress.addressId;
        if (addressId != '') {
            this.setData({
                addressId: addressId,
                address: app.globalData.infoAddress.addressDetail
            });
        }
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        selectAddress() {
            uni.navigateTo({
                url: '/pages/ucenter/address/address'
            });
        },

        formatterDate(type, value) {
            if (type === 'year') {
                return `${value}年`;
            }
            if (type === 'month') {
                return `${value}月`;
            }
            return value;
        },

        onTimeCancel() {
            this.setData({
                timePickerShow: false
            });
        },

        onTimeConfirm(event) {
            console.log(event);
            this.setData({
                startServiceTime: util.formetdate(new Date(event.detail)),
                timePickerShow: false
            });
        },

        showServicePicker() {
            this.setData({
                typePickerShow: true
            });
        },

        showTimePicker() {
            this.setData({
                timePickerShow: true
            });
        },

        onTypeCancel: function () {
            this.setData({
                typePickerShow: false
            });
        },

        onTypeConfirm: function (event) {
            this.setData({
                serviceModel: this.serviceModelList[event.detail.index].id,
                serviceModelText: event.detail.value,
                typePickerShow: false
            });
        },

        confirmSubmit() {
            if (this.customerName == '') {
                uni.showToast({
                    title: '请输入客户名称',
                    icon: 'none',
                    duration: 2000
                });
                return false;
            }
            if (this.customerTel == '') {
                uni.showToast({
                    title: '请输入手机号',
                    icon: 'none',
                    duration: 2000
                });
                return false;
            }
            if (!check.isValidPhone(this.customerTel)) {
                // util.showErrorToast('请输入正确的手机号码');
                uni.showToast({
                    title: '输入正确的手机号码',
                    icon: 'none',
                    duration: 2000
                });
                return false;
            }
            if (this.address == '请选择住址') {
                uni.showToast({
                    title: '请选择住址',
                    icon: 'none',
                    duration: 2000
                });
                return false;
            }
            if (this.serviceModelText == '请选择') {
                uni.showToast({
                    title: '请选择服务类型',
                    icon: 'none',
                    duration: 2000
                });
                return false;
            }
            // if(this.data.startServiceTime=='请选择'){
            // 	wx.showToast({
            //     title: '请选择服务时间',
            //     icon: 'none',
            //     duration: 2000
            //   });
            //   return false;
            // }
            console.log('校验成功');
            let userInfo = uni.getStorageSync('userInfo');
            uni.showLoading({
                title: '提交中...',
                mask: true
            });
            util.request(
                api.addClue,
                {
                    customerName: this.customerName,
                    customerTel: this.customerTel,
                    mallAddressId: this.addressId,
                    serviceModel: this.serviceModel,
                    // "startServiceTime": this.data.startServiceTime,
                    userId: userInfo.id
                },
                'POST'
            )
                .then((res) => {
                    uni.hideLoading();
                    if (res.errno == 0) {
                        app.globalData.infoGoods.type = '2';
                        uni.navigateTo({
                            url: '/pages/checkout/payResult/payResult'
                        });
                    } else {
                        util.showErrorToast(res.errmsg);
                    }
                })
                .catch(() => {
                    uni.hideLoading();
                });
        }
    }
};
</script>
<style>
.info-collect-page {
    padding: 24rpx 30rpx 0;
}
.product-info {
    height: 162rpx;
    padding: 12rpx 12rpx 16rpx;
    background: #fff;
    border-radius: 10rpx;
}
.product-info {
    display: flex;
    align-items: center;
}
.product-left image {
    width: 132rpx;
    height: 136rpx;
    border-radius: 10rpx;
}
.product-right {
    margin: 0 0 0 36rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 136rpx;
    padding: 14rpx 0 36rpx;
}
.product-right view {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    width: 500rpx;
}
.brief {
    font-size: 24rpx;
}
.collect-detail {
    margin: 20rpx 0 24rpx;
}
.collect-detail .van-cell {
    background-color: transparent;
    padding: 20rpx 10rpx;
}
.collect-detail .van-cell:after {
    border-bottom-color: #e4e4e4;
    border-bottom-width: 4rpx;
    left: 0;
}
.collect-detail .van-field__input {
    text-align: right;
}
.collect-tip {
    font-size: 24rpx;
}
.collect-detail .van-cell__value,
.collect-detail .van-field__input {
    color: #85868a;
    font-size: 24rpx;
    font-family: PingFangSC-Light, helvetica, 'Heiti SC';
}
</style>