|
|
@@ -3,14 +3,23 @@
|
|
|
<form @submit="formSubmit">
|
|
|
<div class="module-com input-line-wrap">
|
|
|
<tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title required">手机号</div>
|
|
|
+ <div class="tui-title">花店名称</div>
|
|
|
+ <input v-model="form.name" placeholder-class="phcolor" class="tui-input" name="phone" placeholder="请输入(选填)" maxlength="50" type="text" />
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">店长姓名</div>
|
|
|
+ <input v-model="form.adminName" placeholder-class="phcolor" class="tui-input" name="phone" placeholder="请输入(选填)" maxlength="50" type="text" />
|
|
|
+ </tui-list-cell>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title required">店长手机号</div>
|
|
|
<input v-model="form.mobile" placeholder-class="phcolor" class="tui-input" name="mobile" placeholder="请输入" maxlength="50" type="number" />
|
|
|
</tui-list-cell>
|
|
|
<tui-list-cell class="line-cell" :hover="false">
|
|
|
<div class="tui-title required">确认手机号</div>
|
|
|
<input v-model="form.confirmMobile" placeholder-class="phcolor" class="tui-input" name="confirmMobile" placeholder="请输入" maxlength="50" type="number" />
|
|
|
</tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
+
|
|
|
+ <!-- <tui-list-cell class="line-cell" :hover="false">
|
|
|
<div class="tui-title required">余额</div>
|
|
|
<input v-model="form.balance" placeholder-class="phcolor" class="tui-input" name="balance" placeholder="请输入" maxlength="50" type="number" />
|
|
|
</tui-list-cell>
|
|
|
@@ -22,19 +31,50 @@
|
|
|
<div class="tui-placeholder" v-else>请选择</div>
|
|
|
</picker>
|
|
|
</tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">姓名</div>
|
|
|
- <input v-model="form.realName" placeholder-class="phcolor" class="tui-input" name="phone" placeholder="请输入(选填)" maxlength="50" type="text" />
|
|
|
- </tui-list-cell>
|
|
|
+
|
|
|
<tui-list-cell class="line-cell" :hover="false">
|
|
|
<div class="tui-title required">确认密码</div>
|
|
|
<input v-model="form.confirmPassword" placeholder-class="phcolor" class="tui-input" name="confirmPassword" placeholder="请输入确认密码" maxlength="50" type="password" />
|
|
|
+ </tui-list-cell> -->
|
|
|
+ <!-- <div class="prompt-text">注册会员时会根据手机号识别此客户,等级和余额自动同步到帐户里。</div> -->
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="margin-top:20px"
|
|
|
+ class="module-com input-line-wrap">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres">
|
|
|
+ <div class="tui-title">所在城市</div>
|
|
|
+ <div class="tui-input" v-if="form.province">{{ form.province + '-' + form.city }}</div>
|
|
|
+ <div class="tui-placeholder" v-else>请选择</div>
|
|
|
</tui-list-cell>
|
|
|
- <div class="prompt-text">注册会员时会根据手机号识别此客户,等级和余额自动同步到帐户里。</div>
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn">
|
|
|
+ <div class="tui-title">详细地址</div>
|
|
|
+ <div class="tui-input" v-if="form.address">{{ form.address }}</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.floor"
|
|
|
+ placeholder-class="phcolor"
|
|
|
+ placeholder-style="color:#CCCCCC"
|
|
|
+ class="tui-input"
|
|
|
+ name="floor"
|
|
|
+ placeholder="楼号门牌号(选填)"
|
|
|
+ />
|
|
|
+ </tui-list-cell>
|
|
|
<div class="btn-wrap">
|
|
|
<button class="admin-button-com blue big" formType="submit">确认</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!-- 选择地区 -->
|
|
|
+ <app-area-sel :show.sync="showRegion" @change="changeAreaFn" :city="form.city" />
|
|
|
+ <!-- 省市联动 -->
|
|
|
+ <simple-address
|
|
|
+ ref="simpleAddress"
|
|
|
+ :pickerValueDefault="cityPickerValueDefault"
|
|
|
+ @onConfirm="onCityConfirm"
|
|
|
+ ></simple-address>
|
|
|
</form>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -46,31 +86,66 @@ const form = require('@/utils/formValidation.js')
|
|
|
// api
|
|
|
import { getLevel } from '@/utils/config'
|
|
|
import { add } from '@/api/member'
|
|
|
+// import {
|
|
|
+// regionTree
|
|
|
+// } from "@/api/official";
|
|
|
+import AppAreaSel from "@/components/app-area-sel";
|
|
|
+import SimpleAddress from "@/components/plugin/simple-address";
|
|
|
export default {
|
|
|
name: 'member-add',
|
|
|
components: {
|
|
|
- TuiListCell
|
|
|
+ TuiListCell,
|
|
|
+ AppAreaSel,
|
|
|
+ SimpleAddress,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ showRegion:false,
|
|
|
+ // 省市联动
|
|
|
+ regionData: [],
|
|
|
+ cityPickerValueDefault: [0, 0],
|
|
|
form: {
|
|
|
+ floor:'',
|
|
|
+ address:'',
|
|
|
+ province:'',
|
|
|
+ city:'',
|
|
|
mobile: '',
|
|
|
confirmMobile: '',
|
|
|
- balance: 0,
|
|
|
- memberLevel: '',
|
|
|
- realName: '',
|
|
|
- confirmPassword: ''
|
|
|
+ name: '',
|
|
|
+ adminName: '',
|
|
|
+ lat:'',
|
|
|
+ long: ''
|
|
|
},
|
|
|
levelSelData: {}
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapGetters({ levelData: 'getLevel' })
|
|
|
},
|
|
|
onLoad() {
|
|
|
- getLevel()
|
|
|
},
|
|
|
methods: {
|
|
|
+ init(){
|
|
|
+ },
|
|
|
+ onCityConfirm(e) {
|
|
|
+ this.form.province = e.provinceName;
|
|
|
+ this.form.city = e.cityName;
|
|
|
+ },
|
|
|
+ changeAreaFn(e) {
|
|
|
+ console.log("changeAreaFn", e);
|
|
|
+ this.form.address = e.address;
|
|
|
+ this.form.lat = e.location.lat;
|
|
|
+ this.form.long = e.location.lng;
|
|
|
+ },
|
|
|
+ selRegionFn(){
|
|
|
+ if (!this.form.city) {
|
|
|
+ this.$msg("请先选择城市!");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this.showRegion = true;
|
|
|
+ },
|
|
|
+ openAddres(){
|
|
|
+ this.$refs.simpleAddress.open();
|
|
|
+ },
|
|
|
confirmFn() {
|
|
|
add(this.form).then(res => {
|
|
|
this.$msg('添加成功!')
|