zhangqi
/
kuailelunwen_new_houtai
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

注册第一步优化

pull/105/head
pengda 4 weeks ago
parent
42b762d061
commit
0da7bf4d12
4 changed files with 115 additions and 63 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 18
      src/components/domainBind.vue
  2. 115
      src/components/site/addSiteStep/step1.vue
  3. 13
      src/views/agent/siteAdd.vue
  4. 32
      src/views/agent/siteTemplate.vue

18
src/components/domainBind.vue
View File

@ -1,10 +1,11 @@
<template> <template>
<div> <div>
<el-form class="el-row demo-ruleForm" ref="formRef" :rules="rules" :model="data"> <el-form class="el-row demo-ruleForm" ref="bindFormRef" :rules="rules" :model="data">
<GuipFormItem column="column" class="combo-formItem w540" :label="label" :class="label ? '' : 'combo-formItem-nolabel'"> <GuipFormItem column="column" class="combo-formItem w540" :label="label" :class="label ? '' : 'combo-formItem-nolabel'">
<div slot="formDom" class="self-drop-wrap flex w540"> <div slot="formDom" class="self-drop-wrap flex w540">
<GuipInput prop="prefix" v-model="data.prefix" style="width: 60%;" placeholder="仅支持数字、字母" @blur="inputEnd"></GuipInput> <GuipInput prop="prefix" v-model="data.prefix" style="width: 60%;" placeholder="仅支持数字、字母" @blur="inputEnd">
<!-- 只用作选中内容展示 --> <i slot="suffix" v-if="data.prefix" class="el-icon-close" @click="handleClear"></i>
</GuipInput>
<div @click="toggleDrop" class="point flex appendDrop" style="width: 40%;">{{data.domain}}</div> <div @click="toggleDrop" class="point flex appendDrop" style="width: 40%;">{{data.domain}}</div>
</div> </div>
<!--触发 真实下拉操作 --> <!--触发 真实下拉操作 -->
@ -55,7 +56,7 @@ export default {
}, },
rules:{ rules:{
prefix: [ prefix: [
{ required: true, message: '请输入域名前缀', trigger: 'blur' } { required: true, message: '请输入域名前缀', trigger: []}
], ],
}, },
isShowAddDomainDialog: false, isShowAddDomainDialog: false,
@ -74,6 +75,8 @@ export default {
} }
}, },
mounted(){ mounted(){
this.data.prefix = this.defaultPrefix
this.data.domain = this.defaultDomain
this.getDomainList() this.getDomainList()
}, },
methods:{ methods:{
@ -86,7 +89,9 @@ export default {
label: '.'+item, label: '.'+item,
value: '.'+item value: '.'+item
})); }));
if(!response.data.includes(this.data.domain) || !this.data.domain) this.data.domain = '.'+response.data[0]
let domain = this.data.domain.startsWith('.') ? this.data.domain.slice(1) : this.data.domain;
if(!response.data.includes(domain) || !domain) this.data.domain = '.'+response.data[0]
} else { } else {
if(!this.data.domain) this.data.domain = '暂无域名' if(!this.data.domain) this.data.domain = '暂无域名'
} }
@ -97,6 +102,9 @@ export default {
console.error(error, 'error') console.error(error, 'error')
}) })
}, },
handleClear() {
this.data.prefix = '';
},
toggleDrop(e) { toggleDrop(e) {
this.$refs.dropDomain.toggleDropdown(e) this.$refs.dropDomain.toggleDropdown(e)
}, },

115
src/components/site/addSiteStep/step1.vue
View File

@ -23,16 +23,19 @@
<div class="flex-right"> <div class="flex-right">
<GuipFormItem column="column" class="mb24"> <GuipFormItem column="column" class="mb24">
<div slot="formLeft">域名来源</div> <div slot="formLeft">域名来源</div>
<GuipRadio slot="formDom" v-model="formData.domain_type" :options="formData.domain_types" prop="domain" :rules="formRules.domain" <GuipRadio slot="formDom" v-model="formData.domain_type" :options="formData.domain_types" prop="domain"/>
@change="radioDomainChange" />
</GuipFormItem> </GuipFormItem>
<GuipFormItem column="column"> <GuipFormItem column="column" v-if="formData.domain_type==='1'">
<div slot="formLeft">域名设置</div> <div slot="formLeft">域名设置</div>
<GuipInput v-show="formData.domain_type==='1'" slot="formDom" v-model="formData.domain_prefix" class="w540"> <GuipInput slot="formDom" ref="GuipInput" prop="domain_prefix" placeholder="仅支持数字、字母"
<i slot="suffix" class="el-icon-close" @click="handleClear"></i> v-model="formData.domain_prefix" :rules="formRules.domain_prefix" class="w540">
<span slot="appendshow">{{formData.domain_name}}</span> <i slot="suffix" v-if="formData.domain_prefix" class="el-icon-close" @click="handleClear"></i>
<span slot="appendshow">{{formData.plat_domain}}</span>
</GuipInput> </GuipInput>
<domainBind v-show="formData.domain_type==='2'" slot="formDom" :defaultPrefix="formData.domain_prefix" :defaultDomain="formData.domain_name" @handleEvent="handleChangeDomain" /> </GuipFormItem>
<GuipFormItem column="column" v-if="formData.domain_type==='2'">
<div slot="formLeft">域名设置</div>
<domainBind ref="domainBind" slot="formDom" :defaultPrefix="formData.domain_prefix" :defaultDomain="formData.domain_name" @handleEvent="handleChangeDomain" />
</GuipFormItem> </GuipFormItem>
</div> </div>
</div> </div>
@ -142,9 +145,15 @@ export default {
}, },
computed: { computed: {
submitData() { submitData() {
let domain = "";
if (this.formData.domain_type === '1') {
domain = this.formData.domain_prefix + this.formData.plat_domain
} else if (this.formData.domain_type === '2') {
domain = this.formData.domain_prefix + this.formData.domain_name
}
return { return {
short_name: this.formData.short_name, short_name: this.formData.short_name,
domain: this.formData.domain_prefix + this.formData.domain_name, domain: domain,
sale_channel: this.formData.sale_channel, sale_channel: this.formData.sale_channel,
site_type: this.formData.site_type, site_type: this.formData.site_type,
site_tpl: this.formData.site_tpl, site_tpl: this.formData.site_tpl,
@ -163,6 +172,7 @@ export default {
return true; return true;
} }
console.log(this.siteInfo)
this.getAddInfo() this.getAddInfo()
}, },
methods:{ methods:{
@ -172,19 +182,12 @@ export default {
this.formData.site_tpl = siteTplInfo.site_tpl this.formData.site_tpl = siteTplInfo.site_tpl
this.formData.site_tpl_name = siteTplInfo.site_tpl_name this.formData.site_tpl_name = siteTplInfo.site_tpl_name
this.formData.picture = siteTplInfo.picture this.formData.picture = siteTplInfo.picture
localStorage.removeItem('site_tpl_info')
} }
const ico = await db.get('ico') const ico = await db.get('ico')
if(ico){ if(ico) this.formData.site_tpl_ico = ico
this.formData.site_tpl_ico = ico
await db.remove('ico')
}
const logo = await db.get('logo') const logo = await db.get('logo')
if(logo){ if(logo) this.formData.site_tpl_logo = logo
this.formData.site_tpl_logo = logo
await db.remove('logo')
}
}, },
getAddInfo() { getAddInfo() {
const that = this const that = this
@ -197,7 +200,6 @@ export default {
that.formData.domain_type = String(addInfo.domain_type) that.formData.domain_type = String(addInfo.domain_type)
that.formData.domain_types = addInfo.domain_types that.formData.domain_types = addInfo.domain_types
that.formData.plat_domain = addInfo.plat_domain that.formData.plat_domain = addInfo.plat_domain
that.formData.domain_name = addInfo.plat_domain
that.formData.site_type = String(addInfo.site_type) that.formData.site_type = String(addInfo.site_type)
that.formData.site_types = addInfo.site_types that.formData.site_types = addInfo.site_types
@ -218,12 +220,9 @@ export default {
that.formData.picture = that.siteInfo.picture that.formData.picture = that.siteInfo.picture
that.formData.not_finished_uid = that.siteInfo.uid that.formData.not_finished_uid = that.siteInfo.uid
//域名存在且不是平台主域名 that.formData.domain_type = String(that.siteInfo.domain_type)
if(that.siteInfo.domain){ that.formData.domain_prefix = that.siteInfo.domain_prefix;
that.formData.domain_type = String(that.siteInfo.domain_type) that.formData.domain_name = that.siteInfo.domain_name;
that.formData.domain_prefix = that.siteInfo.domain_prefix;
that.formData.domain_name = that.siteInfo.domain_name;
}
}) })
} }
return true return true
@ -238,9 +237,6 @@ export default {
const value = this.formData.sale_channel; const value = this.formData.sale_channel;
this.formData.sale_channel_label = labels && labels[value] ? labels[value] : ''; this.formData.sale_channel_label = labels && labels[value] ? labels[value] : '';
}, },
radioDomainChange(){
this.formData.domain_name = this.formData.domain_type === '1' ? this.formData.plat_domain : ''
},
radioTypeChange(){ radioTypeChange(){
if(this.formData.site_type){ if(this.formData.site_type){
this.formData.site_tpl = this.formData.site_type_tpl[this.formData.site_type].site_tpl this.formData.site_tpl = this.formData.site_type_tpl[this.formData.site_type].site_tpl
@ -264,32 +260,55 @@ export default {
return false; return false;
} }
localStorage.setItem('formData', JSON.stringify(this.formData)) localStorage.setItem('formData', JSON.stringify(this.formData))
this.$router.push(`/agent/siteTemplate?site_type=${this.formData.site_type}`) if(this.formData.not_finished_uid){
this.$router.push(`/agent/siteTemplate?uid=${this.formData.not_finished_uid}`)
}else{
this.$router.push(`/agent/siteTemplate?site_type=${this.formData.site_type}`)
}
}, },
saveConfirm() { saveConfirm() {
const that = this const that = this
let formValid = false;
that.$refs.formRef.validate((valid) => { that.$refs.formRef.validate((valid) => {
if (valid) { formValid = valid
const that = this });
that.$http('POST', '/agentnew/ajax_add_new_site', that.submitData).then(response => {
if(response.status && response.data.uid){
that.formData.uid = response.data.uid
that.$emit('handelSiteInfo', that.formData)
if(that.formData.sale_channel === '2'){ let domainValid = false;
//自用站点无需设置收款方式 if(that.formData.domain_type === '2'){
that.$emit('handelStep', 3) that.$refs.domainBind.$refs.bindFormRef.validate(valid => {
}else{ domainValid = valid
that.$emit('handelStep', 2) })
} }else{
return true; domainValid = true
}
if (formValid && domainValid) {
that.$http('POST', '/agentnew/ajax_add_new_site', that.submitData).then(async response => {
if(response.status && response.data.uid){
await that.deleteSiteTplData()
that.formData.uid = response.data.uid
that.$emit('handelSiteInfo', that.formData)
if(that.formData.sale_channel === '2'){
//自用站点无需设置收款方式
that.$emit('handelStep', 3)
}else{
that.$emit('handelStep', 2)
} }
that.$message.error(response.info); return true;
}).catch(error => { }
console.error(error, 'error') that.$message.error(response.info);
}) }).catch(error => {
} console.error(error, 'error')
}); })
}
},
async deleteSiteTplData(){
localStorage.removeItem('activeStep')
localStorage.removeItem('site_tpl_info')
await db.remove('ico')
await db.remove('logo')
}, },
} }
} }
@ -357,7 +376,7 @@ export default {
} }
.channel-radio .el-radio{ .channel-radio .el-radio{
min-width: 120px; min-width: 120px;
margin-bottom: 12px; line-height: 16px;
} }
} }
</style> </style>

13
src/views/agent/siteAdd.vue
View File

@ -51,7 +51,7 @@
<!-- 参数 在子组件页面一样用 props接收 、ref绑定的组件示例 --> <!-- 参数 在子组件页面一样用 props接收 、ref绑定的组件示例 -->
<!-- 默认页面展示 的初始组件 Franchise--> <!-- 默认页面展示 的初始组件 Franchise-->
<component :is="process" :siteInfo="siteInfo" ref="dynamicComponent" @handelSiteInfo="handelSiteInfo" @handelStep="handelStep"/> <component :is="process" :key="stepKey" :siteInfo="siteInfo" ref="dynamicComponent" @handelSiteInfo="handelSiteInfo" @handelStep="handelStep"/>
</div> </div>
</template> </template>
<script> <script>
@ -73,6 +73,7 @@ export default {
return { return {
siteInfo:{}, siteInfo:{},
showAlert:true, showAlert:true,
stepKey: Date.now(),
activeStep: '1',//当前步骤条 activeStep: '1',//当前步骤条
process: '', //进度默认为站点开通 process: '', //进度默认为站点开通
prodid: '',//要添加的服务类型 prodid: '',//要添加的服务类型
@ -102,13 +103,20 @@ export default {
methods: { methods: {
getNotFinishedSite() { getNotFinishedSite() {
const that = this const that = this
that.payList = []
this.$http('POST', '/agentnew/ajax_get_not_finished_site', {}).then(response => { this.$http('POST', '/agentnew/ajax_get_not_finished_site', {}).then(response => {
if(response.status){ if(response.status){
that.$nextTick(() => { that.$nextTick(() => {
const unsiteInfo = response.data const unsiteInfo = response.data
if(Object.keys(unsiteInfo).length>0){ if(Object.keys(unsiteInfo).length>0){
that.siteInfo = unsiteInfo that.siteInfo = unsiteInfo
that.stepKey = Date.now();
const step = localStorage.getItem('activeStep')
if(step){
that.activeStep = step
return true
}
if(that.siteInfo.open_process === '3'){ if(that.siteInfo.open_process === '3'){
if(that.siteInfo.sale_channel === '2'){ if(that.siteInfo.sale_channel === '2'){
that.activeStep = 3 //自用不出售 不设置收款方式 that.activeStep = 3 //自用不出售 不设置收款方式
@ -137,6 +145,7 @@ export default {
goCurActiveStep(step) { goCurActiveStep(step) {
if (step < this.activeStep) { if (step < this.activeStep) {
this.activeStep = step this.activeStep = step
localStorage.setItem('activeStep', step)
} }
}, },
renderStepDesc(step) { renderStepDesc(step) {

32
src/views/agent/siteTemplate.vue
View File

@ -157,6 +157,16 @@ export default {
this.$router.push('/') this.$router.push('/')
return false; return false;
} }
//站点不存在 读取本地存储设置的数据
const siteTplInfo = JSON.parse(localStorage.getItem('site_tpl_info'))
if(!this.$route.query.uid && siteTplInfo) {
this.tpl_id = siteTplInfo.site_tpl
this.pictureUrl = siteTplInfo.picture
this.previewUrl = siteTplInfo.preview
this.previewLogo = siteTplInfo.previewLogo
this.previewIco = siteTplInfo.previewIco
}
this.get_site_tpl_list(); this.get_site_tpl_list();
}, },
methods: { methods: {
@ -169,14 +179,16 @@ export default {
this.$http('POST', '/agentnew/ajax_get_site_tpl_list', obj).then(response => { this.$http('POST', '/agentnew/ajax_get_site_tpl_list', obj).then(response => {
if(response.status) { if(response.status) {
this.$nextTick(() => { this.$nextTick(() => {
this.tpl_id = response.data.tpl_data.tpl_id if(!this.tpl_id) {
this.pictureUrl = response.data.tpl_data.picture this.tpl_id = response.data.tpl_data.tpl_id
this.previewUrl = response.data.tpl_data.thumbnail this.pictureUrl = response.data.tpl_data.picture
this.tpl_customize = response.data.tpl_data.tpl_customize this.previewUrl = response.data.tpl_data.thumbnail
this.previewLogo = response.data.tpl_data.site_tpl_logo
this.previewIco = response.data.tpl_data.site_tpl_ico
this.tpl_customize = response.data.tpl_data.tpl_customize
this.priv_down_url = response.data.tpl_data.priv_down_url
}
this.is_public_tpl = response.data.tpl_data.is_public_tpl this.is_public_tpl = response.data.tpl_data.is_public_tpl
this.priv_down_url = response.data.tpl_data.priv_down_url
this.previewLogo = response.data.tpl_data.site_tpl_logo
this.previewIco = response.data.tpl_data.site_tpl_ico
this.templeteList = [...response.data.list] this.templeteList = [...response.data.list]
}) })
@ -200,6 +212,9 @@ export default {
site_tpl: this.tpl_id, site_tpl: this.tpl_id,
site_tpl_name: this.tpl_name, site_tpl_name: this.tpl_name,
picture: this.pictureUrl, picture: this.pictureUrl,
preview: this.previewUrl,
previewLogo: this.previewLogo,
previewIco: this.previewIco,
} }
localStorage.setItem('site_tpl_info', JSON.stringify(site_tpl_info)) localStorage.setItem('site_tpl_info', JSON.stringify(site_tpl_info))
this.$router.go(-1) this.$router.go(-1)
@ -211,9 +226,10 @@ export default {
this.formData.set('is_public_tpl', this.is_public_tpl) this.formData.set('is_public_tpl', this.is_public_tpl)
this.$http('POST', '/agentnew/ajax_update_site_tpl', this.formData).then(response => { this.$http('POST', '/agentnew/ajax_update_site_tpl', this.formData).then(response => {
if(response.status){ if(response.status){
this.$Message.success(response.info)
this.$router.go(-1) this.$router.go(-1)
return true
} }
this.$Message.error(response.info)
}).catch(error => { }).catch(error => {
console.error(error, 'error') console.error(error, 'error')
}) })

Write Preview
Loading…
Cancel
Save