|
|
@@ -0,0 +1,278 @@
|
|
|
+<template>
|
|
|
+ <div class="add-shop">
|
|
|
+ <div class="userBox">
|
|
|
+ <div class="u_item flex_r flex_ac">
|
|
|
+ <div class="label">业务员</div>
|
|
|
+ <div class="text">{{ userinfo.nickname }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="u_item flex_r flex_ac">
|
|
|
+ <div class="label">手机号</div>
|
|
|
+ <div class="text">{{ userinfo.mobile }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <uni-forms ref="form" :modelValue="formData" label-width="80px" validateTrigger="blur">
|
|
|
+ <!-- <uni-forms-item label="业务员">
|
|
|
+ <div class="formCon">{{ userinfo.nickname }}</div>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="手机号">
|
|
|
+ <div class="formCon">{{ userinfo.mobile }}</div>
|
|
|
+ </uni-forms-item> -->
|
|
|
+
|
|
|
+ <uni-forms-item label="店铺名称" required name="name">
|
|
|
+ <uni-easyinput v-model="formData.name" type="text" placeholder="请输入店铺名称" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="商家logo" required name="logo">
|
|
|
+ <div class="upimg flex_c flex_ac flex_jc flex_wrap" @click="uplogoimg">
|
|
|
+ <div class="iconfont"></div>
|
|
|
+ <div class="upmsg">最多1张</div>
|
|
|
+ </div>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="商家分类" required name="business">
|
|
|
+ <uni-data-select v-model="formData.business" :localdata="TypeDesc.business" placeholder="请选择商家分类"></uni-data-select>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="商家属性" required name="attribute">
|
|
|
+ <uni-data-select v-model="formData.attribute" :localdata="TypeDesc.attribute" placeholder="请选择商家属性"></uni-data-select>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="合作类型" required name="type">
|
|
|
+ <uni-data-select v-model="formData.type" :localdata="TypeDesc.type" placeholder="请选择合作类型"></uni-data-select>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="让利比率" required name="discount">
|
|
|
+ <uni-easyinput v-model="formData.discount" type="text" placeholder="请输入让利比率" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="省市区" required name="province">
|
|
|
+ <div class="selectAdder flex_r flex_ac flex_jb" @click="btnClick">
|
|
|
+ <div v-if="userAddress">{{userAddress}}</div>
|
|
|
+ <div class="msg" v-else>请选择省市区地址</div>
|
|
|
+ <div class="ico iconfont"></div>
|
|
|
+ </div>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="详细地址" required name="address">
|
|
|
+ <uni-easyinput v-model="formData.address" type="text" placeholder="请输入详细地址" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="经度" required name="longitude">
|
|
|
+ <uni-easyinput v-model="formData.longitude" type="text" placeholder="请输入经度" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="纬度" required name="latitude">
|
|
|
+ <uni-easyinput v-model="formData.latitude" type="text" placeholder="请输入纬度" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="联系人" required name="contact">
|
|
|
+ <uni-easyinput v-model="formData.contact" type="text" placeholder="请输入联系人" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="联系电话" required name="phone">
|
|
|
+ <uni-easyinput v-model="formData.phone" type="text" placeholder="请输入联系电话" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="商家微信" required name="we_chat">
|
|
|
+ <uni-easyinput v-model="formData.we_chat" type="text" placeholder="请输入商家微信" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="开票类型" required name="billing_type">
|
|
|
+ <uni-data-select v-model="billing_type" :localdata="TypeDesc.billing_type" placeholder="请选择开票类型"></uni-data-select>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="开户行" required name="bank">
|
|
|
+ <uni-easyinput v-model="formData.bank" type="text" placeholder="请输入开户行" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="银行卡号" required name="card_no">
|
|
|
+ <uni-easyinput v-model="formData.card_no" type="text" placeholder="请输入银行卡号" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="开户姓名" required name="account_name">
|
|
|
+ <uni-easyinput v-model="formData.account_name" type="text" placeholder="请输入开户姓名" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="身份证号" required name="card_id">
|
|
|
+ <uni-easyinput v-model="formData.card_id" type="text" placeholder="请输入身份证号" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="开户手机" required name="open_phone">
|
|
|
+ <uni-easyinput v-model="formData.open_phone" type="text" placeholder="请输入开户手机" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="平台截图" name="other_type">
|
|
|
+ <uni-data-select v-model="other_type" :localdata="TypeDesc.other_type" placeholder="请选择平台"></uni-data-select>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="上传截图">
|
|
|
+ <div class="upimg flex_c flex_ac flex_jc flex_wrap">
|
|
|
+ <div class="iconfont"></div>
|
|
|
+ <div class="upmsg">最多1张</div>
|
|
|
+ </div>
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-forms>
|
|
|
+ <button class="button" @click="submit">校验表单</button>
|
|
|
+ <select-address :address.sync="address" ref="selectAddress" @change="changeAddress" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { post } from "@/request/api.js";
|
|
|
+import selectAddress from "@/components/lcw-select-address/lcw-select-address.vue";
|
|
|
+export default {
|
|
|
+ name: "add-shop",
|
|
|
+ props: {},
|
|
|
+ components: {selectAddress},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ userinfo: uni.getStorageSync("userinfo"),
|
|
|
+ formData: {},
|
|
|
+ rules: {
|
|
|
+ name: { rules: [{ required: true, errorMessage: '请输入店铺名称' }]},
|
|
|
+ logo: { rules: [{ required: true, errorMessage: '请上传店铺logo' }]},
|
|
|
+ business: { rules: [{ required: true, errorMessage: '请选择商家分类' }]},
|
|
|
+ attribute: { rules: [{ required: true, errorMessage: '请选择商家属性' }]},
|
|
|
+ type: { rules: [{ required: true, errorMessage: '请选择合作类型' }]},
|
|
|
+ discount: { rules: [{ required: true, errorMessage: '请输入让利比率' }]},
|
|
|
+ province: { rules: [{ required: true, errorMessage: '请选择省市区地址' }]},
|
|
|
+ address: { rules: [{ required: true, errorMessage: '请输入详细地址' }]},
|
|
|
+ longitude: { rules: [{ required: true, errorMessage: '请输入经度' }]},
|
|
|
+ latitude: { rules: [{ required: true, errorMessage: '请输入纬度' }]},
|
|
|
+ contact: { rules: [{ required: true, errorMessage: '请输入联系人' }]},
|
|
|
+ phone: { rules: [{ required: true, errorMessage: '请输入联系电话' }]},
|
|
|
+ we_chat: { rules: [{ required: true, errorMessage: '商家微信' }]},
|
|
|
+ billing_type: { rules: [{ required: true, errorMessage: '请选择开票类型' }]},
|
|
|
+ bank: { rules: [{ required: true, errorMessage: '请输入开户行' }]},
|
|
|
+ card_no: { rules: [{ required: true, errorMessage: '请输入银行卡号' }]},
|
|
|
+ account_name: { rules: [{ required: true, errorMessage: '请输入开户姓名' }]},
|
|
|
+ card_id: { rules: [{ required: true, errorMessage: '请输入身份证号' }]},
|
|
|
+ open_phone: { rules: [{ required: true, errorMessage: '请输入开户手机' }]},
|
|
|
+ },
|
|
|
+ TypeDesc: {},
|
|
|
+ address: {
|
|
|
+ province: "",
|
|
|
+ city: "",
|
|
|
+ area: "",
|
|
|
+ street: "",
|
|
|
+ },
|
|
|
+ userAddress: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ upimg(count=1) {
|
|
|
+ let that = this
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ uni.chooseMedia({
|
|
|
+ count,
|
|
|
+ mediaType: ["image"],
|
|
|
+ sizeType: ["compressed"],
|
|
|
+ sourceType: ["album", "camera"],
|
|
|
+ success: async (res) => {
|
|
|
+ console.log(res);
|
|
|
+ let arr = [];
|
|
|
+ for (const it of res.tempFiles) {
|
|
|
+ let url = await that.$up(it.tempFilePath)
|
|
|
+ arr.push(url)
|
|
|
+ }
|
|
|
+ resolve(arr)
|
|
|
+ },
|
|
|
+ });
|
|
|
+ })
|
|
|
+ },
|
|
|
+ uplogoimg(){
|
|
|
+ this.upimg().then(res=>{
|
|
|
+ console.log(res);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ submit(form) {
|
|
|
+ this.$refs.form
|
|
|
+ .validate()
|
|
|
+ .then((res) => {
|
|
|
+ console.log("表单数据信息:", res);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.log("表单错误信息:", err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getTypeDesc(){
|
|
|
+ let res = await post("v1/merchant/typeDesc");
|
|
|
+ if(res.code == 0){
|
|
|
+ this.TypeDesc = res.data
|
|
|
+ }
|
|
|
+ },
|
|
|
+ btnClick() {
|
|
|
+ this.$refs.selectAddress.open();
|
|
|
+ },
|
|
|
+ changeAddress(address) {
|
|
|
+ //选择成功回调
|
|
|
+ this.address = address;
|
|
|
+ this.userAddress = "";
|
|
|
+ for (const i in address) {
|
|
|
+ if (i != "regional_code") this.userAddress += address[i] + " ";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取当前位置
|
|
|
+ async getLocation() {
|
|
|
+ let adres = await uni.Location();
|
|
|
+ this.$set(this.formData,"longitude",adres.lng)
|
|
|
+ this.$set(this.formData,"latitude",adres.lat)
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+ this.$refs.form.setRules(this.rules);
|
|
|
+ },
|
|
|
+ onLoad(da) {
|
|
|
+ this.getLocation()
|
|
|
+ this.getTypeDesc()
|
|
|
+ },
|
|
|
+ onShow() {},
|
|
|
+ mounted() {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+.add-shop {
|
|
|
+ // .uni-forms-item {
|
|
|
+ // margin-bottom: 25rpx !important;
|
|
|
+ // }
|
|
|
+ // .uni-forms-item__error{
|
|
|
+ // display: none;
|
|
|
+ // }
|
|
|
+
|
|
|
+ .uni-forms-item__label {
|
|
|
+ color: #222;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-stat__select {
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style scoped lang='scss'>
|
|
|
+.add-shop {
|
|
|
+ padding: 28rpx 32rpx;
|
|
|
+ .userBox{
|
|
|
+ color: #222;
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-bottom: 44rpx;
|
|
|
+
|
|
|
+ .u_item{
|
|
|
+ margin-bottom: 28rpx;
|
|
|
+ }
|
|
|
+ .label{
|
|
|
+ width: 80px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .formCon{
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .upimg{
|
|
|
+ width: 170rpx;
|
|
|
+ height: 130rpx;
|
|
|
+ border: 2rpx dashed #999;
|
|
|
+ font-size: 23rpx;
|
|
|
+ color: #999;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ .iconfont{
|
|
|
+ color: #999;
|
|
|
+ font-size: 70rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .selectAdder{
|
|
|
+ height: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: 1px solid #e5e5e5;
|
|
|
+ padding: 0 10px;
|
|
|
+ font-size: 24rpx;
|
|
|
+ .msg{
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ .ico{
|
|
|
+ color: #888;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|