静态样式完成
|
After Width: | Height: | Size: 565 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 847 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 939 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 643 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 684 B |
|
After Width: | Height: | Size: 1017 B |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 78 KiB |
|
After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 314 KiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 679 KiB |
|
After Width: | Height: | Size: 186 KiB |
|
After Width: | Height: | Size: 98 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 240 KiB |
|
After Width: | Height: | Size: 758 B |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 200 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 9.1 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 9.9 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 5.1 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 190 KiB |
|
After Width: | Height: | Size: 272 KiB |
|
After Width: | Height: | Size: 213 KiB |
|
After Width: | Height: | Size: 222 KiB |
|
After Width: | Height: | Size: 5.6 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 7.2 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 6.8 KiB |
|
After Width: | Height: | Size: 52 KiB |
@ -0,0 +1,88 @@
|
|||||||
|
|
||||||
|
<template>
|
||||||
|
<div style="background-color: #f8f8f8;padding-bottom: 248px;">
|
||||||
|
<div class="container ">
|
||||||
|
<el-button type="text" link @click="$router.go(-1);" class="btnReturn ">
|
||||||
|
<div class="flx-center">
|
||||||
|
<img style="width: 18px;height: 18px;margin-right: 5px;" src="@/assets/icons/returnOrder.png" alt=""/>
|
||||||
|
<span style="color: black;font-size: 18px;line-height: 18px;">返回</span>
|
||||||
|
</div>
|
||||||
|
</el-button>
|
||||||
|
<el-row >
|
||||||
|
<el-col :span="12" v-for="(item,index) in inviteList" :key="index" >
|
||||||
|
<div
|
||||||
|
class="flx-wrap"
|
||||||
|
:class="['inviteListBox', { 'invite-active': inviteIndex === index }]"
|
||||||
|
@click="setInviteActive(item,index)"
|
||||||
|
>
|
||||||
|
<div class="flx-justify-between">
|
||||||
|
<span>{{ item.title }}</span>
|
||||||
|
<span ><img style="padding-bottom: 5px;" src="@/assets/icons/about/invite/address.png" alt=""> {{ item.address }}</span>
|
||||||
|
</div>
|
||||||
|
<div>{{ item.content }}</div>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name:"inviteList",
|
||||||
|
components: {
|
||||||
|
|
||||||
|
// Switcher
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
console.log(this.$route.query.id)
|
||||||
|
this.inviteData =JSON.parse( localStorage.getItem("inviteIndex") );
|
||||||
|
if(this.inviteData) {
|
||||||
|
this.inviteIndex = +this.inviteData.listIndex;
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
inviteData:{},
|
||||||
|
id:this.$route.query.id,
|
||||||
|
inviteIndex:0,
|
||||||
|
inviteList: [
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
{ id:'1',address:'深圳',content:'大专 | 经验不限',title: '跨境物流销售'},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
setInviteActive(item,index) {
|
||||||
|
this.inviteIndex = index
|
||||||
|
localStorage.setItem('inviteIndex',JSON.stringify({...this.inviteData,listIndex:index}));
|
||||||
|
this.$router.push({
|
||||||
|
name: 'inviteListDetail',
|
||||||
|
query:{
|
||||||
|
id:item.id
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style src="../index.css" scoped>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -1,3 +1,16 @@
|
|||||||
::v-deep .el-icon-arrow-down:before {
|
::v-deep .el-icon-arrow-down:before {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
.version-selector {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.version-label {
|
||||||
|
margin-right: 8px; /* 调整间距 */
|
||||||
|
}
|
||||||
|
::v-deep .el-input__inner {
|
||||||
|
border: none;
|
||||||
|
width: 120px;
|
||||||
|
}
|
||||||
@ -1,214 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="flx">
|
|
||||||
|
|
||||||
<el-button type="primary" class="btn "
|
|
||||||
style="border: 1px solid #1A1E31;border-radius: 4px;margin-right: 10px;"
|
|
||||||
v-if="receivedValue === 'buttonOrder'">
|
|
||||||
<div class="btns" style="font-size: 14px;left: 15px;top:5px;color: #fff;" >去下单</div>
|
|
||||||
<input
|
|
||||||
class="selectfile"
|
|
||||||
style="width: 100%;height: 100%;"
|
|
||||||
type="file"
|
|
||||||
ref="fileInput"
|
|
||||||
@change="handleFileChange" />
|
|
||||||
</el-button>
|
|
||||||
<a href="https://public-aaf-shenzhen-file.oss-cn-beijing.aliyuncs.com/aaf1.0/template/AAF-下单系统模板.xls" download>
|
|
||||||
<el-button type="">
|
|
||||||
下载模板
|
|
||||||
</el-button>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import {aliOssUpload} from "@/utils/order/useBackUploadImport.js";
|
|
||||||
export default {
|
|
||||||
components :{
|
|
||||||
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
receivedValue: String,
|
|
||||||
imgValue: String
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
url: null,
|
|
||||||
imageurl: this.imgValue || ''
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
beforeUpload(file) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
aliOssUpload(file.name, new Blob([file]))
|
|
||||||
.then(result => {
|
|
||||||
console.log("文件上传成功", result);
|
|
||||||
this.$emit("testFunc", { resultData: result });
|
|
||||||
resolve(result);
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error("文件上传失败", error);
|
|
||||||
reject(error);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleFileChange(event) {
|
|
||||||
const files = event.target.files;
|
|
||||||
for (let i = 0; i < files.length; i++) {
|
|
||||||
const file = files[i];
|
|
||||||
console.log("文件信息:", file);
|
|
||||||
this.beforeUpload(file)
|
|
||||||
.then(() => {
|
|
||||||
console.log("Image downloaded successfully!");
|
|
||||||
})
|
|
||||||
.catch(downloadError => {
|
|
||||||
console.error("Download failed:", downloadError);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
// Reset the file input
|
|
||||||
event.target.value = '';
|
|
||||||
},
|
|
||||||
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped >
|
|
||||||
.file {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 301px;
|
|
||||||
height: 140px;
|
|
||||||
overflow: hidden; /* Add this line */
|
|
||||||
cursor: pointer;
|
|
||||||
background: #f5f5f5;
|
|
||||||
border: 1px dashed #d9d9d9;
|
|
||||||
border-radius: 4px;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
.fileAvatar {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 107px;
|
|
||||||
height: 107px;
|
|
||||||
overflow: hidden; /* Add this line */
|
|
||||||
cursor: pointer;
|
|
||||||
background: #f5f5f5;
|
|
||||||
border: 1px dashed #d9d9d9;
|
|
||||||
border-radius: 4px;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
.selectfile {
|
|
||||||
position: absolute; /* Change from relative to absolute */
|
|
||||||
top: 0; /* Add this line */
|
|
||||||
left: 0; /* Add this line */
|
|
||||||
width: 301px; /* Add this line */
|
|
||||||
height: 141px; /* Add this line */
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
.selectfileAvatar {
|
|
||||||
position: absolute !important; /* Change from relative to absolute */
|
|
||||||
top: 0; /* Add this line */
|
|
||||||
left: 0; /* Add this line */
|
|
||||||
width: 107px; /* Add this line */
|
|
||||||
height: 107px; /* Add this line */
|
|
||||||
opacity: 0;
|
|
||||||
border-radius: 28px;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
.avatar:hover .overlay {
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
opacity: 1;
|
|
||||||
border-radius: 28px;
|
|
||||||
}
|
|
||||||
.iconpos {
|
|
||||||
position: absolute;
|
|
||||||
top: 75px;
|
|
||||||
left: 72px;
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.blackBG {
|
|
||||||
width: 100px;
|
|
||||||
height: 30px;
|
|
||||||
border: none;
|
|
||||||
|
|
||||||
}
|
|
||||||
.blackBG .btns {
|
|
||||||
color: #1A1E31;
|
|
||||||
top: 5px;
|
|
||||||
left: 9px;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar {
|
|
||||||
position: relative;
|
|
||||||
width: 107px;
|
|
||||||
height: 107px;
|
|
||||||
border-radius: 28px;
|
|
||||||
border:none;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.avatar.el-button {
|
|
||||||
border-radius: 28px;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
}
|
|
||||||
.avatar.el-button span {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.avatars {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 28px;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
border-radius: 28px;
|
|
||||||
|
|
||||||
}
|
|
||||||
.uploadImg {
|
|
||||||
width:301px;
|
|
||||||
height:141px;
|
|
||||||
/* background-image: url("@/assets/images/Rectangle.png"); */
|
|
||||||
background-size:120%;
|
|
||||||
background-position: center;
|
|
||||||
backdrop-filter: blur(2px);
|
|
||||||
}
|
|
||||||
.overlay {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
line-height: 107px;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
opacity: 0;
|
|
||||||
border-radius: 28px;
|
|
||||||
|
|
||||||
}
|
|
||||||
.el-button {
|
|
||||||
width: 84px;
|
|
||||||
height: 28px;
|
|
||||||
border-radius: 4px;
|
|
||||||
border: 1px solid #1A1E31;
|
|
||||||
background: #fff;
|
|
||||||
color: #1A1E31;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
.el-button:hover {
|
|
||||||
border: 1px solid #1A1E31;
|
|
||||||
background: #fff;
|
|
||||||
color: #1A1E31;
|
|
||||||
}
|
|
||||||
.el-button--primary{
|
|
||||||
background: #1A1E31;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.el-button--primary:hover{
|
|
||||||
transform: none;
|
|
||||||
background: #1A1E31;
|
|
||||||
color: #fff;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||