fix
This commit is contained in:
318
src/views/affiliate/affiliatePage.vue
Normal file
318
src/views/affiliate/affiliatePage.vue
Normal file
@@ -0,0 +1,318 @@
|
||||
<template>
|
||||
<div class="affiliateHome_page">
|
||||
<div class="affiliateHome_page_left">
|
||||
<div class="affiliateHome_title ">
|
||||
<div class="modal_title_text" @click="setBack">
|
||||
<i class="fi fi-sr-left"></i>
|
||||
<div class="modal_title_intro affiliateHome_title_text">Back</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal_title_text">Affiliate</div>
|
||||
<a-menu
|
||||
id="dddddd"
|
||||
class="menu_list_content"
|
||||
theme="dark"
|
||||
v-model:openKeys="openKeys"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
mode="inline"
|
||||
@click="handleClick"
|
||||
>
|
||||
|
||||
<div v-for="(menu) in rootSubmenuKeys" :key="menu.key" >
|
||||
<a-menu-item :key="menu.key" :name="menu.name" :route="menu.route" v-if="!menu.children">
|
||||
<template #icon>
|
||||
<span :class="['icon','iconfont', 'menu_icon', menu.icon]"></span>
|
||||
</template>
|
||||
<span class="menu_title" :title="menu.name">{{menu.name}}</span>
|
||||
</a-menu-item>
|
||||
<a-sub-menu :key="menu.key" v-else>
|
||||
<template #icon>
|
||||
<span :class="['icon','iconfont', 'menu_icon', menu.icon]"></span>
|
||||
</template>
|
||||
<template #expandIcon><span :class="['icon','iconfont', 'menu_icon', menu.expandIcon]"></span></template>
|
||||
<template #title><span class="menu_title" :title="menu.name">{{menu.name}}</span></template>
|
||||
<div >
|
||||
<a-menu-item v-for="child in menu.children" :key="child.key" :name="child.name" :route="child.route"><span class="menu_title" :title="child.name">{{child.name}}</span></a-menu-item>
|
||||
</div>
|
||||
</a-sub-menu>
|
||||
</div>
|
||||
</a-menu>
|
||||
</div>
|
||||
<div class="affiliateHome_page_right">
|
||||
<div class="affiliateHome_page_right_header">
|
||||
<div class="page_name">
|
||||
<div v-show="!routers.length" class="page_name_title">{{nowPageName}}</div>
|
||||
<a-breadcrumb v-show="routers.length" :routes="routers">
|
||||
<template #itemRender="{ route, routes, paths }">
|
||||
<span v-if="routes.indexOf(route) === routes.length - 1">
|
||||
{{ route.breadcrumbName }}
|
||||
</span>
|
||||
<router-link v-else :to="`${paths.join('/')}`">
|
||||
{{ route.breadcrumbName }}
|
||||
</router-link>
|
||||
</template>
|
||||
</a-breadcrumb>
|
||||
</div>
|
||||
</div>
|
||||
<div class="affiliateHome_page_right_content">
|
||||
<router-view v-slot="{ Component }">
|
||||
<keep-alive>
|
||||
<component :is="Component" />
|
||||
</keep-alive>
|
||||
</router-view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { message, Upload } from "ant-design-vue";
|
||||
import { defineComponent, onMounted, h, ref, nextTick, inject,reactive, toRefs } from "vue";
|
||||
import { Https } from "@/tool/https";
|
||||
import { useStore } from "vuex";
|
||||
import { useRouter,useRoute } from 'vue-router'
|
||||
import { country } from "@/tool/country";
|
||||
import { getUploadUrl } from "@/tool/util";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
},
|
||||
props: ["msg",'sketchCatecoryList'],
|
||||
setup() {
|
||||
const router = useRouter()
|
||||
// const route:any = useRoute()
|
||||
const store:any = useStore()
|
||||
const state:any = reactive({
|
||||
rootSubmenuKeys: [{
|
||||
name:'Affiliate Home',
|
||||
route:'/affiliate',
|
||||
icon:'yonghu',
|
||||
expandIcon:'icon-xiala',
|
||||
key:'sub1',
|
||||
isShow:true,
|
||||
// children: [
|
||||
// {
|
||||
// name:'User Management',
|
||||
// route:'/home/excil1',
|
||||
// icon:'',
|
||||
// key:'/home/excil22',
|
||||
// isShow:true,
|
||||
// },
|
||||
// {
|
||||
// code:'ROLE_MANAGER',
|
||||
// name:'Access Permission',
|
||||
// route:'/home/excil2',
|
||||
// icon:'',
|
||||
// key:'/home/excil33',
|
||||
// isShow:true,
|
||||
// },
|
||||
// ],
|
||||
},],
|
||||
openKeys: [],
|
||||
selectedKeys: ['sub1'],
|
||||
nowPageName:'Affiliate Home',//当前页面名称
|
||||
});
|
||||
let routers:any = ref([])
|
||||
|
||||
|
||||
const onOpenChange = (openKeys: string[]) => {
|
||||
const latestOpenKey:any = openKeys.find(key => state.openKeys.indexOf(key) === -1);
|
||||
if (state.rootSubmenuKeys.indexOf(latestOpenKey!) === -1) {
|
||||
state.openKeys = openKeys;
|
||||
} else {
|
||||
state.openKeys = latestOpenKey ? [latestOpenKey] : [];
|
||||
}
|
||||
};
|
||||
let handleClick = (event:any) => {
|
||||
// state.selectedKeys = [Number(event.key)]
|
||||
state.nowPageName = event.item.name
|
||||
router.push({path:event.item.route})
|
||||
}
|
||||
let setBack = ()=>{
|
||||
router.push('/home');
|
||||
}
|
||||
onMounted(() => {
|
||||
state.rootSubmenuKeys.forEach((item:any) => {
|
||||
if(item.children){
|
||||
item.children.forEach((item:any) => {
|
||||
if(item.route == router.currentRoute.value.path){
|
||||
state.selectedKeys[0] = item.key
|
||||
}
|
||||
});
|
||||
}else{
|
||||
if(item.route == router.currentRoute.value.path){
|
||||
state.selectedKeys[0] = item.key
|
||||
}
|
||||
}
|
||||
});
|
||||
//储存所有用户id和name
|
||||
Https.axiosGet(Https.httpUrls.getAllUserId,).then((rv: any) => {
|
||||
if (rv) {
|
||||
store.commit('setAllUserList',rv);
|
||||
}
|
||||
})
|
||||
let allCountry = country
|
||||
sessionStorage.setItem('allCountry',JSON.stringify(allCountry));
|
||||
// state.nowPageName = state.rootSubmenuKeys[0].name
|
||||
// router.push(state.rootSubmenuKeys[0].route)
|
||||
|
||||
})
|
||||
return {
|
||||
...toRefs(state),
|
||||
onOpenChange,
|
||||
routers,
|
||||
handleClick,
|
||||
setBack,
|
||||
};
|
||||
},
|
||||
data(prop) {
|
||||
return {
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
},
|
||||
watch:{
|
||||
// newWindowState:{
|
||||
// handler(newVal,oldVal){
|
||||
// console.log(newVal);
|
||||
// if(newVal){
|
||||
// this.newWindow?.close();
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
.affiliateHome_page {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
background: rgba(243,244,248,0.4);
|
||||
.affiliateHome_title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 222;
|
||||
.modal_title_text{
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
margin-bottom: 0;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
.affiliateHome_title_text{
|
||||
line-height: 1;
|
||||
}
|
||||
.modal_title_text:hover .affiliateHome_title_text{
|
||||
text-decoration: underline;
|
||||
}
|
||||
i{
|
||||
font-size: 1.2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
.affiliateHome_page_left{
|
||||
width: 20%;
|
||||
padding-top: 20px;
|
||||
.modal_title_text{
|
||||
// font-size: var(--aida-fsize1-8);
|
||||
line-height: 10rem;
|
||||
text-align: center;
|
||||
}
|
||||
.ant-menu-dark.menu_list_content{
|
||||
padding-left: 1.8rem;
|
||||
// width: 30rem;
|
||||
width: 100%;
|
||||
height: calc(100% - 16rem);
|
||||
background: #FFFFFF;
|
||||
flex-shrink: 0;
|
||||
overflow-y: auto;
|
||||
&::-webkit-scrollbar{
|
||||
width: 0;
|
||||
}
|
||||
.menu_icon{
|
||||
font-size: 2.4rem;
|
||||
color: #808185;
|
||||
}
|
||||
|
||||
.ant-menu-item{
|
||||
padding-left: 3.1rem !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 6.6rem;
|
||||
border-radius: 3.3rem 0px 0px 3.3rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
&.ant-menu-item-only-child{
|
||||
padding-left: 5.6rem !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.ant-menu-submenu-title{
|
||||
padding-left: 3.1rem !important;
|
||||
height: 6.6rem;
|
||||
|
||||
}
|
||||
.ant-menu-inline.ant-menu-sub{
|
||||
background: #FFFFFF;
|
||||
padding-left: 4rem;
|
||||
}
|
||||
|
||||
.menu_title{
|
||||
font-size: 1.8rem;
|
||||
font-family: Adobe Heiti Std;
|
||||
font-weight: normal;
|
||||
color: #808185;
|
||||
}
|
||||
.ant-menu-item-selected{
|
||||
background: #F3F4F8;
|
||||
|
||||
.menu_title{
|
||||
color: #343579;
|
||||
}
|
||||
|
||||
.menu_icon{
|
||||
color: #808185;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.affiliateHome_page_right{
|
||||
flex: 1;
|
||||
width: 80%;
|
||||
.affiliateHome_page_right_header{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 6.6rem;
|
||||
padding: 0 2.8rem 0 3.0rem;
|
||||
|
||||
.page_name{
|
||||
border-left: solid .4rem #161F29;
|
||||
.page_name_title,.ant-breadcrumb-link{
|
||||
font-size: 1.8rem;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
padding-left: 1.2rem;
|
||||
line-height: 1.8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.affiliateHome_page_right_content{
|
||||
height: 100%;
|
||||
padding: 0 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
86
src/views/affiliate/affiliateRegister.vue
Normal file
86
src/views/affiliate/affiliateRegister.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<div class="affiliateRegister">
|
||||
<div class="title">AiDA 3.0 Questionnaire</div>
|
||||
<div class="info">Have questions or suggestions? We'd love to hear from you. Send us a message and we'll respond as soon as possible.</div>
|
||||
<div class="textarea_box">
|
||||
<div class="text"></div>
|
||||
<textarea :value="textarea"></textarea>
|
||||
</div>
|
||||
<div class="gallery_btn" style="width: 100%;" @click="submit">Register</div>
|
||||
</div>
|
||||
<div class="mark_loading" v-show="loadingShow">
|
||||
<a-spin size="large" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { message, Upload } from "ant-design-vue";
|
||||
import { defineComponent, onMounted, h, ref, nextTick, inject,reactive, toRefs } from "vue";
|
||||
import { Https } from "@/tool/https";
|
||||
import { useRouter,useRoute } from 'vue-router'
|
||||
export default defineComponent({
|
||||
components: {
|
||||
},
|
||||
props: ["msg",'sketchCatecoryList'],
|
||||
setup() {
|
||||
const router = useRouter()
|
||||
const affiliateRegisterData:any = reactive({
|
||||
loadingShow:false,
|
||||
textarea:'',//当前页面名称
|
||||
});
|
||||
const submit = ()=>{
|
||||
affiliateRegisterData.loadingShow = true
|
||||
let data = {
|
||||
promotionMethod:affiliateRegisterData.textarea,
|
||||
}
|
||||
Https.axiosGet(Https.httpUrls.affiliateRegistration,{params:data}).then(()=>{
|
||||
affiliateRegisterData.loadingShow = false
|
||||
message.success('success')
|
||||
}).catch((err)=>{
|
||||
affiliateRegisterData.loadingShow = false
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
|
||||
})
|
||||
return {
|
||||
...toRefs(affiliateRegisterData),
|
||||
submit,
|
||||
};
|
||||
},
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.affiliateRegister{
|
||||
width: 100rem;
|
||||
margin: 0 auto;
|
||||
margin-top: 14.5rem;
|
||||
>.title{
|
||||
font-size: 4rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
>.info{
|
||||
margin-bottom: 4rem;
|
||||
font-size: 1.8rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
>.textarea_box{
|
||||
margin-bottom: 5rem;
|
||||
>.text{
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
textarea{
|
||||
width: 100%;
|
||||
height: 18rem !important;
|
||||
border: 2px solid;
|
||||
border-radius: 2rem;
|
||||
background: #f7f8fa;
|
||||
padding: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user