|
|
@@ -3,7 +3,27 @@
|
|
|
<van-nav-bar class="navBar" title="金牌店档案编辑" left-arrow @click-left="onClickLeft" />
|
|
|
<div class="content" v-if="detail">
|
|
|
<van-form ref="tabstoreVal">
|
|
|
- <van-field v-model="detail.ownerMobile" label="主经营者电话" />
|
|
|
+ <van-field
|
|
|
+ class="sendCode"
|
|
|
+ v-model="detail.ownerMobile"
|
|
|
+ label="主经营者电话"
|
|
|
+ placeholder="请输入主经营者电话"
|
|
|
+ type="tel">
|
|
|
+ <template #button>
|
|
|
+ <van-button
|
|
|
+ size="small"
|
|
|
+ style="color: white; background: rgb(0, 87, 186); border-radius: 6px"
|
|
|
+ @click="sendCode(item, index)"
|
|
|
+ :disabled="time != null"
|
|
|
+ >发送验证码<span v-if="time">({{ timeNum }})</span>
|
|
|
+ </van-button>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field
|
|
|
+ v-model="verificationVal"
|
|
|
+ placeholder="请输入验证码"
|
|
|
+ type="number"
|
|
|
+ @blur="verification(verificationVal)" />
|
|
|
<van-field v-model="detail.ownerName" label="主经营者姓名" />
|
|
|
<van-field v-model="detail.ownerBirthday" label="主经营者出生日期" />
|
|
|
<van-field v-model="detail.mainProductCategorys" label="主营/擅长经营品类" />
|
|
|
@@ -28,14 +48,86 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { sendAndCheckVerCode } from '@/api/index';
|
|
|
+import { getStoreArchives } from '@/api/storeManagement';
|
|
|
export default {
|
|
|
name: 'JPattributeEditor',
|
|
|
data() {
|
|
|
return {
|
|
|
detail: null,
|
|
|
+ time: null, //计时
|
|
|
+ timeNum: 30,
|
|
|
+ verificationVal: '',
|
|
|
};
|
|
|
},
|
|
|
+ activated() {
|
|
|
+ if (this.time) clearInterval(this.time);
|
|
|
+ this.time = null; //计时
|
|
|
+ this.timeNum = 30;
|
|
|
+ this.getDetaild();
|
|
|
+ },
|
|
|
methods: {
|
|
|
+ getDetaild() {
|
|
|
+ getStoreArchives({ storeCode: this.$route.query.storeCode }).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.detail = res.data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 发送验证码
|
|
|
+ sendCode(val) {
|
|
|
+ if (!/^1[3456789]\d{9}$/.test(val) || val == '') {
|
|
|
+ this.$toast('格式错误');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.time) return;
|
|
|
+ clearInterval(this.time);
|
|
|
+ this.timeNum = 30;
|
|
|
+ this.sendCodeFun(
|
|
|
+ {
|
|
|
+ type: '1', //String 调用类型:1:发送验证码 2:校验验证码
|
|
|
+ phone: val, //String 手机号
|
|
|
+ verification: '', //String 手机号验证码
|
|
|
+ },
|
|
|
+ () => {
|
|
|
+ this.time = setInterval(() => {
|
|
|
+ this.timeNum--;
|
|
|
+ if (this.timeNum <= 0) {
|
|
|
+ clearInterval(this.time);
|
|
|
+ this.time = null;
|
|
|
+ }
|
|
|
+ }, 1000);
|
|
|
+ this.$toast('发送成功');
|
|
|
+ }
|
|
|
+ );
|
|
|
+ },
|
|
|
+ sendCodeFun(params, callback) {
|
|
|
+ sendAndCheckVerCode(params).then((res) => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ callback && callback(res);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ verification(val) {
|
|
|
+ // 验证码
|
|
|
+ if (val == '') {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 手机号
|
|
|
+ if (this.detail.ownerMobile == '') {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.sendCodeFun(
|
|
|
+ {
|
|
|
+ type: '2', //String 调用类型:1:发送验证码 2:校验验证码
|
|
|
+ phone: this.detail.ownerMobile, //String 手机号
|
|
|
+ verification: val, //String 手机号验证码
|
|
|
+ },
|
|
|
+ (res) => {
|
|
|
+ this.$toast(res.data ? '验证成功' : '验证码错误');
|
|
|
+ }
|
|
|
+ );
|
|
|
+ },
|
|
|
// 保存
|
|
|
confirmShare() {},
|
|
|
onClickLeft() {
|
|
|
@@ -45,7 +137,7 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss" scoped>
|
|
|
+<style lang="scss">
|
|
|
.JPattributeEditor {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
@@ -59,6 +151,21 @@ export default {
|
|
|
background: #fff;
|
|
|
padding: 10px 15px;
|
|
|
margin-top: 10px;
|
|
|
+ background: #fff;
|
|
|
+ .van-cell {
|
|
|
+ padding: 10px 0;
|
|
|
+ border-bottom: 1px solid #ccc;
|
|
|
+ }
|
|
|
+ .van-field__label {
|
|
|
+ width: 9em;
|
|
|
+ }
|
|
|
+ .sendCode {
|
|
|
+ border: none !important;
|
|
|
+ input {
|
|
|
+ border: 1px solid #f1f1f1;
|
|
|
+ height: 35px;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
.footer-btn {
|
|
|
display: flex;
|