|
|
@@ -1,291 +1,350 @@
|
|
|
<template>
|
|
|
- <div class="app-delivery-module">
|
|
|
- <!-- 配送公共组件 -->
|
|
|
- <!-- 收花人 -->
|
|
|
- <div class="module-com">
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">收花人姓名</div>
|
|
|
- <input v-model="form.receiveUserName" placeholder-class="phcolor" class="tui-input" name="receiveUserName" placeholder="请输入姓名" />
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">收花人电话</div>
|
|
|
- <input v-model="form.receiveMobile" placeholder-class="phcolor" class="tui-input" name="receiveMobile" placeholder="请输入电话" type="number" />
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres">
|
|
|
- <div class="tui-title">收花人城市</div>
|
|
|
- <!-- <picker mode="date" :value="form.reachTime" @change="selTimeFn" class="tui-input">
|
|
|
- <div v-if="form.reachTime">{{ form.reachTime }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择</div>
|
|
|
- </picker>-->
|
|
|
- <div class="tui-input" v-if="form.receiveProvince || form.receiveCity">{{ form.receiveProvince + '-' + form.receiveCity }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择</div>
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn">
|
|
|
- <div class="tui-title">详细地址</div>
|
|
|
- <div class="tui-input" v-if="form.receiveAddress">{{ form.receiveAddress }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择详细地址</div>
|
|
|
- <!-- <input v-model="form.receiveFullAddress" placeholder-class="phcolor" class="tui-input" name="receiveFullAddress" placeholder="小区、大厦或街道名称" /> -->
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">门牌号</div>
|
|
|
- <input v-model="form.receiveFloor" placeholder-class="phcolor" class="tui-input" name="receiveFloor" placeholder="楼号门牌号（选填）" />
|
|
|
- </tui-list-cell>
|
|
|
- </div>
|
|
|
- <!-- 订花人 -->
|
|
|
- <div class="module-com">
|
|
|
- <!-- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">订花人姓名</div>
|
|
|
- <input v-model="form.bookName" placeholder-class="phcolor" class="tui-input" name="bookName" placeholder="请输入姓名（选填）" />
|
|
|
- </tui-list-cell>-->
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">订花人电话</div>
|
|
|
- <input v-model="form.bookMobile" placeholder-class="phcolor" class="tui-input" name="bookMobile" placeholder="花送到了会通知您（选填）" type="number" />
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false" :arrow="true">
|
|
|
- <div class="tui-title">送达时间</div>
|
|
|
- <picker mode="date" :value="form.reachTime" @change="selTimeFn" class="tui-input">
|
|
|
- <div v-if="form.reachTime">{{ form.reachTime }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择送达时间</div>
|
|
|
- </picker>
|
|
|
- </tui-list-cell>
|
|
|
- <!-- 具体时间 -->
|
|
|
- <div class="delivery-time">
|
|
|
- <button class="button-com" :class="[form.reachPeriod == 0 ? 'red' : 'default']" @click="timeTodaySelFn(0)">上午</button>
|
|
|
- <button class="button-com" :class="[form.reachPeriod == 1 ? 'red' : 'default']" @click="timeTodaySelFn(1)">下午</button>
|
|
|
- <button class="button-com" :class="[form.reachPeriod == 2 ? 'red' : 'default']" @click="timeTodaySelFn(2)">晚上</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 贺卡 -->
|
|
|
- <div class="module-com gift-wrap input-line-wrap">
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="gift-content">
|
|
|
- <div class="flex-center">
|
|
|
- <checkbox class="ljd-checkbox" id="needGift" :checked="form.needCard == 1 ? true : false" @change="needCardChange"></checkbox>
|
|
|
- <label for="needGift" class="need-gift">需要贺卡</label>
|
|
|
- </div>
|
|
|
- <div class="gitf-textarea">
|
|
|
- <textarea v-model="form.cardInfo" class="tui-textarea" placeholder-class="phcolor" name="cardInfo" placeholder="请填写贺卡内容，留空将寄出空白贺卡" auto-height />
|
|
|
- <!-- <app-textarea v-model="form.cardInfo" placeholder="请填写贺卡内容" @blur="blursave('blur')" /> -->
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </tui-list-cell>
|
|
|
- <!-- <block v-if="form.anonymous"> -->
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="none-name-delivery flex-center">
|
|
|
- <checkbox class="ljd-checkbox" id="noneNameText" @change="anonymityChange"></checkbox>
|
|
|
- <label for="noneNameText" class="none-name-text">匿名派送</label>
|
|
|
- </div>
|
|
|
- </tui-list-cell>
|
|
|
- <!-- </block> -->
|
|
|
- </div>
|
|
|
- <!-- 备注 -->
|
|
|
- <div class="module-com remark-wrap">
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">其它备注</div>
|
|
|
- <input v-model="form.remark" placeholder-class="phcolor" class="tui-input" name="remark" placeholder="（选填）" />
|
|
|
- </tui-list-cell>
|
|
|
- </div>
|
|
|
- <!-- 省市联动 -->
|
|
|
- <simple-address ref="simpleAddress" :region="orderShop.region" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onCityConfirm"></simple-address>
|
|
|
- <!-- 选择地区 -->
|
|
|
- <app-area-sel :show.sync="showRegion" :city="form.receiveCity" @change="changeAreaFn" />
|
|
|
- </div>
|
|
|
+ <div class="app-delivery-module">
|
|
|
+ <!-- 配送公共组件 -->
|
|
|
+ <!-- 收花人 -->
|
|
|
+ <div class="module-com">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">收花人姓名</div>
|
|
|
+ <input
|
|
|
+ v-model="form.receiveUserName"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#ccc"
|
|
|
+ class="tui-input"
|
|
|
+ name="receiveUserName"
|
|
|
+ placeholder="请输入姓名"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">收花人电话</div>
|
|
|
+ <input
|
|
|
+ v-model="form.receiveMobile"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#ccc"
|
|
|
+ class="tui-input"
|
|
|
+ name="receiveMobile"
|
|
|
+ placeholder="请输入电话"
|
|
|
+ type="number"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres">
|
|
|
+ <div class="tui-title">收花人城市</div>
|
|
|
+ <div
|
|
|
+ class="tui-input"
|
|
|
+ v-if="form.receiveProvince || form.receiveCity"
|
|
|
+ >{{ form.receiveProvince + '-' + form.receiveCity }}</div>
|
|
|
+ <div class="tui-placeholder" v-else>请选择</div>
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn">
|
|
|
+ <div class="tui-title">详细地址</div>
|
|
|
+ <div class="tui-input" v-if="form.receiveAddress">{{ form.receiveAddress }}</div>
|
|
|
+ <div class="tui-placeholder" v-else>请选择地址</div>
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">门牌号</div>
|
|
|
+ <input
|
|
|
+ v-model="form.receiveFloor"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#ccc"
|
|
|
+ class="tui-input"
|
|
|
+ name="receiveFloor"
|
|
|
+ placeholder="楼号门牌号（选填）"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
+ </div>
|
|
|
+ <!-- 订花人 -->
|
|
|
+ <div class="module-com">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">订花人电话</div>
|
|
|
+ <input
|
|
|
+ v-model="form.bookMobile"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#ccc"
|
|
|
+ class="tui-input"
|
|
|
+ name="bookMobile"
|
|
|
+ placeholder="花送到了通知您（选填）"
|
|
|
+ type="number"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true">
|
|
|
+ <div class="tui-title">送达时间</div>
|
|
|
+ <picker mode="date" :value="form.reachTime" @change="selTimeFn" class="tui-input">
|
|
|
+ <div v-if="form.reachTime">{{ form.reachTime }}</div>
|
|
|
+ <div class="tui-placeholder" v-else>请选择送达时间</div>
|
|
|
+ </picker>
|
|
|
+ </tui-list-cell>
|
|
|
+ <!-- 具体时间 -->
|
|
|
+ <div class="delivery-time">
|
|
|
+ <button
|
|
|
+ class="button-com"
|
|
|
+ :class="[form.reachPeriod == 0 ? 'red' : 'default']"
|
|
|
+ @click="timeTodaySelFn(0)"
|
|
|
+ >上午</button>
|
|
|
+ <button
|
|
|
+ class="button-com"
|
|
|
+ :class="[form.reachPeriod == 1 ? 'red' : 'default']"
|
|
|
+ @click="timeTodaySelFn(1)"
|
|
|
+ >下午</button>
|
|
|
+ <button
|
|
|
+ class="button-com"
|
|
|
+ :class="[form.reachPeriod == 2 ? 'red' : 'default']"
|
|
|
+ @click="timeTodaySelFn(2)"
|
|
|
+ >晚上</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 贺卡 -->
|
|
|
+ <div class="module-com gift-wrap input-line-wrap">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="gift-content">
|
|
|
+ <div class="flex-center">
|
|
|
+ <checkbox
|
|
|
+ class="ljd-checkbox"
|
|
|
+ id="needGift"
|
|
|
+ :checked="form.needCard == 1 ? true : false"
|
|
|
+ @change="needCardChange"
|
|
|
+ ></checkbox>
|
|
|
+ <label for="needGift" class="need-gift">需要贺卡</label>
|
|
|
+ </div>
|
|
|
+ <div class="gitf-textarea">
|
|
|
+ <textarea
|
|
|
+ v-model="form.cardInfo"
|
|
|
+ class="tui-textarea"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#ccc"
|
|
|
+ name="cardInfo"
|
|
|
+ placeholder="请填写贺卡内容，留空将寄出空白贺卡"
|
|
|
+ auto-height
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="none-name-delivery flex-center">
|
|
|
+ <checkbox class="ljd-checkbox" id="noneNameText" @change="anonymityChange"></checkbox>
|
|
|
+ <label for="noneNameText" class="none-name-text">匿名派送</label>
|
|
|
+ </div>
|
|
|
+ </tui-list-cell>
|
|
|
+ <!-- </block> -->
|
|
|
+ </div>
|
|
|
+ <!-- 备注 -->
|
|
|
+ <div class="module-com remark-wrap">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">其它备注</div>
|
|
|
+ <input
|
|
|
+ v-model="form.remark"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ class="tui-input"
|
|
|
+ name="remark"
|
|
|
+ placeholder="（选填）"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
+ </div>
|
|
|
+ <!-- 省市联动 -->
|
|
|
+ <simple-address
|
|
|
+ ref="simpleAddress"
|
|
|
+ :region="orderShop.region"
|
|
|
+ :pickerValueDefault="cityPickerValueDefault"
|
|
|
+ @onConfirm="onCityConfirm"
|
|
|
+ ></simple-address>
|
|
|
+ <!-- 选择地区 -->
|
|
|
+ <app-area-sel :show.sync="showRegion" :city="form.receiveCity" @change="changeAreaFn" />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { mapGetters } from 'vuex'
|
|
|
- import TuiListCell from '@/components/plugin/list-cell'
|
|
|
- import AppDatePicker from '@/components/app-date-picker'
|
|
|
- // import AppTextarea from '@/components/app-textarea'
|
|
|
- import SimpleAddress from '@/components/plugin/simple-address'
|
|
|
- import AppAreaSel from '@/components/app-area-sel'
|
|
|
- export default {
|
|
|
- name: 'app-delivery-module',
|
|
|
- components: {
|
|
|
- AppAreaSel,
|
|
|
- TuiListCell,
|
|
|
- AppDatePicker,
|
|
|
- // AppTextarea,
|
|
|
- SimpleAddress
|
|
|
- },
|
|
|
- props: {
|
|
|
- anonymous: {
|
|
|
- type: Boolean,
|
|
|
- default: true
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- region: [],
|
|
|
- showRegion: false,
|
|
|
- form: {
|
|
|
- receiveUserName: '', // 收花人姓名；到店自提的姓名
|
|
|
- receiveMobile: '', // 收花人手机；到店自提的电话；
|
|
|
- receiveProvince: '', // 收花人省份
|
|
|
- receiveCity: '', // 收花人城市
|
|
|
- receiveAddress: '', // 收花人城市
|
|
|
- receiveFloor: '', // 收花人门楼号和牌号
|
|
|
- receiveFullAddress: '', // 收花人完整地址，从腾讯地图接口获取
|
|
|
- // bookName: '', // 订花人姓名
|
|
|
- bookMobile: '', // 订花人手机号
|
|
|
- reachTime: 0, // 配送时间
|
|
|
- reachPeriod: '0', // 配送时段，0上午1下午2晚上
|
|
|
- needCard: '1', // 是否要贺卡 0不要 1要
|
|
|
- cardInfo: '', // 贺卡信息
|
|
|
- remark: '' // 备注
|
|
|
- },
|
|
|
- region: {
|
|
|
- latitude: 0,
|
|
|
- longitude: 0
|
|
|
- },
|
|
|
- // 省市联动
|
|
|
- cityPickerValueDefault: [0, 0]
|
|
|
- // pickerText: ''
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters({ orderShop: 'getOrderShop' })
|
|
|
- // regionArr() {
|
|
|
- // return this.$util.isEmpty(this.orderShop) ? [] : this.orderShop.region
|
|
|
- // }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- orderShop(val) {
|
|
|
- console.log('val', val)
|
|
|
- this.form.receiveProvince = val.shop.province ? val.shop.province : ''
|
|
|
- this.form.receiveCity = val.shop.city ? val.shop.city : ''
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- if (!this.$util.isEmpty(this.orderShop)) {
|
|
|
- this.form.receiveProvince = this.orderShop.shop.province ? this.orderShop.shop.province : ''
|
|
|
- this.form.receiveCity = this.orderShop.shop.city ? this.orderShop.shop.city : ''
|
|
|
- }
|
|
|
- // if (this.anonymous) {
|
|
|
- this.form.anonymous = '0'
|
|
|
- // }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- selTimeFn(e) {
|
|
|
- this.form.reachTime = e.detail.value
|
|
|
- },
|
|
|
- // 选择地址
|
|
|
- selRegionFn() {
|
|
|
- if (!this.form.receiveCity) {
|
|
|
- this.$msg('请先选择地址！')
|
|
|
- return false
|
|
|
- }
|
|
|
- this.showRegion = true
|
|
|
- // let that = this
|
|
|
- // uni.chooseLocation({
|
|
|
- // success: res => {
|
|
|
- // this.form.receiveFullAddress = res.address
|
|
|
- // this.region.latitude = res.latitude
|
|
|
- // this.region.longitude = res.longitude
|
|
|
- // }
|
|
|
- // })
|
|
|
- },
|
|
|
- changeAreaFn(e) {
|
|
|
- console.log('changeAreaFn', e)
|
|
|
- this.form.receiveAddress = e.title
|
|
|
- this.form.receiveFullAddress = e.address
|
|
|
- this.region.latitude = e.location.lat
|
|
|
- this.region.longitude = e.location.lng
|
|
|
- this.$emit('changeAddress', e)
|
|
|
- },
|
|
|
- // -----
|
|
|
- timeTodaySelFn(index) {
|
|
|
- this.form.reachPeriod = index
|
|
|
- },
|
|
|
- needCardChange() {
|
|
|
- this.form.needCard = this.form.needCard == 1 ? 0 : 1
|
|
|
- },
|
|
|
- anonymityChange() {
|
|
|
- this.form.anonymous = this.form.anonymous == 1 ? 0 : 1
|
|
|
- },
|
|
|
- // 省市联动
|
|
|
- openAddres() {
|
|
|
- this.$refs.simpleAddress.open()
|
|
|
- },
|
|
|
- onCityConfirm(e) {
|
|
|
- this.form.receiveAddress = e.label
|
|
|
- this.form.receiveProvince = e.provinceName
|
|
|
- this.form.receiveCity = e.cityName
|
|
|
- // this.pickerText = JSON.stringify(e)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+import TuiListCell from "@/components/plugin/list-cell";
|
|
|
+import AppDatePicker from "@/components/app-date-picker";
|
|
|
+// import AppTextarea from '@/components/app-textarea'
|
|
|
+import SimpleAddress from "@/components/plugin/simple-address";
|
|
|
+import AppAreaSel from "@/components/app-area-sel";
|
|
|
+export default {
|
|
|
+ name: "app-delivery-module",
|
|
|
+ components: {
|
|
|
+ AppAreaSel,
|
|
|
+ TuiListCell,
|
|
|
+ AppDatePicker,
|
|
|
+ // AppTextarea,
|
|
|
+ SimpleAddress
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ anonymous: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ region: [],
|
|
|
+ showRegion: false,
|
|
|
+ form: {
|
|
|
+ receiveUserName: "", // 收花人姓名；到店自提的姓名
|
|
|
+ receiveMobile: "", // 收花人手机；到店自提的电话；
|
|
|
+ receiveProvince: "", // 收花人省份
|
|
|
+ receiveCity: "", // 收花人城市
|
|
|
+ receiveAddress: "", // 收花人城市
|
|
|
+ receiveFloor: "", // 收花人门楼号和牌号
|
|
|
+ receiveFullAddress: "", // 收花人完整地址，从腾讯地图接口获取
|
|
|
+ // bookName: '', // 订花人姓名
|
|
|
+ bookMobile: "", // 订花人手机号
|
|
|
+ reachTime: 0, // 配送时间
|
|
|
+ reachPeriod: "0", // 配送时段，0上午1下午2晚上
|
|
|
+ needCard: "1", // 是否要贺卡 0不要 1要
|
|
|
+ cardInfo: "", // 贺卡信息
|
|
|
+ remark: "" // 备注
|
|
|
+ },
|
|
|
+ region: {
|
|
|
+ latitude: 0,
|
|
|
+ longitude: 0
|
|
|
+ },
|
|
|
+ // 省市联动
|
|
|
+ cityPickerValueDefault: [0, 0]
|
|
|
+ // pickerText: ''
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({ orderShop: "getOrderShop" })
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ orderShop(val) {
|
|
|
+ console.log("val", val);
|
|
|
+ this.form.receiveProvince = val.shop.province ? val.shop.province : "";
|
|
|
+ this.form.receiveCity = val.shop.city ? val.shop.city : "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ if (!this.$util.isEmpty(this.orderShop)) {
|
|
|
+ this.form.receiveProvince = this.orderShop.shop.province
|
|
|
+ ? this.orderShop.shop.province
|
|
|
+ : "";
|
|
|
+ this.form.receiveCity = this.orderShop.shop.city
|
|
|
+ ? this.orderShop.shop.city
|
|
|
+ : "";
|
|
|
+ }
|
|
|
+ // if (this.anonymous) {
|
|
|
+ this.form.anonymous = "0";
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ selTimeFn(e) {
|
|
|
+ this.form.reachTime = e.detail.value;
|
|
|
+ },
|
|
|
+ // 选择地址
|
|
|
+ selRegionFn() {
|
|
|
+ if (!this.form.receiveCity) {
|
|
|
+ this.$msg("请先选择地址！");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this.showRegion = true;
|
|
|
+ // let that = this
|
|
|
+ // uni.chooseLocation({
|
|
|
+ // success: res => {
|
|
|
+ // this.form.receiveFullAddress = res.address
|
|
|
+ // this.region.latitude = res.latitude
|
|
|
+ // this.region.longitude = res.longitude
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ },
|
|
|
+ changeAreaFn(e) {
|
|
|
+ console.log("changeAreaFn", e);
|
|
|
+ this.form.receiveAddress = e.title;
|
|
|
+ this.form.receiveFullAddress = e.address;
|
|
|
+ this.region.latitude = e.location.lat;
|
|
|
+ this.region.longitude = e.location.lng;
|
|
|
+ this.$emit("changeAddress", e);
|
|
|
+ },
|
|
|
+ // -----
|
|
|
+ timeTodaySelFn(index) {
|
|
|
+ this.form.reachPeriod = index;
|
|
|
+ },
|
|
|
+ needCardChange() {
|
|
|
+ this.form.needCard = this.form.needCard == 1 ? 0 : 1;
|
|
|
+ },
|
|
|
+ anonymityChange() {
|
|
|
+ this.form.anonymous = this.form.anonymous == 1 ? 0 : 1;
|
|
|
+ },
|
|
|
+ // 省市联动
|
|
|
+ openAddres() {
|
|
|
+ this.$refs.simpleAddress.open();
|
|
|
+ },
|
|
|
+ onCityConfirm(e) {
|
|
|
+ this.form.receiveAddress = e.label;
|
|
|
+ this.form.receiveProvince = e.provinceName;
|
|
|
+ this.form.receiveCity = e.cityName;
|
|
|
+ // this.pickerText = JSON.stringify(e)
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .app-delivery-module {
|
|
|
- .module-com {
|
|
|
- margin-bottom: 20px;
|
|
|
- background-color: #fff;
|
|
|
- .module-tit {
|
|
|
- padding: 20px 18px;
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 600;
|
|
|
- border-bottom: 1px solid $borderColor;
|
|
|
- }
|
|
|
- .module-det {
|
|
|
- padding: 0 30px;
|
|
|
- }
|
|
|
- }
|
|
|
- // 公共
|
|
|
- .line-cell {
|
|
|
- .tui-title {
|
|
|
- width: 210px;
|
|
|
- color: $fontColor2;
|
|
|
- }
|
|
|
- .tui-input {
|
|
|
- width: calc(100% - 210px);
|
|
|
- font-size: 28px;
|
|
|
- }
|
|
|
- .tui-placeholder {
|
|
|
- color: #ccc;
|
|
|
- }
|
|
|
- .phcolor {
|
|
|
- color: #ccc;
|
|
|
- }
|
|
|
- }
|
|
|
- // 今天时间选择
|
|
|
- .delivery-time {
|
|
|
- @include disFlex(center, center);
|
|
|
- background-color: #fff;
|
|
|
- padding: 20px 0;
|
|
|
- // border-top: 1px solid $borderColor;
|
|
|
- .button-com {
|
|
|
- padding-top: 14px;
|
|
|
- padding-bottom: 10px;
|
|
|
- margin: 0 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- // 贺卡
|
|
|
- .gift-wrap {
|
|
|
- .gift-content {
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
- .need-gift {
|
|
|
- margin-left: 14px;
|
|
|
- color: $fontColor2;
|
|
|
- }
|
|
|
- .gitf-textarea {
|
|
|
- margin-top: 40px;
|
|
|
- }
|
|
|
- }
|
|
|
+.app-delivery-module {
|
|
|
+ .module-com {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ background-color: #fff;
|
|
|
+ .module-tit {
|
|
|
+ padding: 20px 18px;
|
|
|
+ font-size: 28px;
|
|
|
+ font-weight: 600;
|
|
|
+ border-bottom: 1px solid $borderColor;
|
|
|
+ }
|
|
|
+ .module-det {
|
|
|
+ padding: 0 30px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 公共
|
|
|
+ .line-cell {
|
|
|
+ .tui-title {
|
|
|
+ width: 210px;
|
|
|
+ color: $fontColor2;
|
|
|
+ }
|
|
|
+ .tui-input {
|
|
|
+ width: calc(100% - 210px);
|
|
|
+ font-size: 28px;
|
|
|
+ }
|
|
|
+ .tui-placeholder {
|
|
|
+ color: #ccc;
|
|
|
+ }
|
|
|
+ .phcolor {
|
|
|
+ color: #ccc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 今天时间选择
|
|
|
+ .delivery-time {
|
|
|
+ @include disFlex(center, center);
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 20px 0;
|
|
|
+ // border-top: 1px solid $borderColor;
|
|
|
+ .button-com {
|
|
|
+ padding-top: 14px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ margin: 0 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 贺卡
|
|
|
+ .gift-wrap {
|
|
|
+ .gift-content {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .need-gift {
|
|
|
+ margin-left: 14px;
|
|
|
+ color: $fontColor2;
|
|
|
+ }
|
|
|
+ .gitf-textarea {
|
|
|
+ margin-top: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- // 匿名派送
|
|
|
- .none-name-delivery {
|
|
|
- // padding-left: 30px;
|
|
|
- // padding: 26px 30px;
|
|
|
- // margin-top: 40px;
|
|
|
- margin-bottom: 20px;
|
|
|
- background-color: #fff;
|
|
|
- .none-name-text {
|
|
|
- margin-left: 14px;
|
|
|
- color: $fontColor2;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ // 匿名派送
|
|
|
+ .none-name-delivery {
|
|
|
+ // padding-left: 30px;
|
|
|
+ // padding: 26px 30px;
|
|
|
+ // margin-top: 40px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ background-color: #fff;
|
|
|
+ .none-name-text {
|
|
|
+ margin-left: 14px;
|
|
|
+ color: $fontColor2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
shish