去除mainPage.vueH5端页面
This commit is contained in:
parent
99906a5ff6
commit
24c17646b5
|
@ -1,601 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="main-container">
|
|
||||||
<div class="hsd-title">
|
|
||||||
<!-- <img src="@/assets/img1/logo.svg">-->
|
|
||||||
<img src="@/assets/orangeUi/logo.svg">
|
|
||||||
</div>
|
|
||||||
<div class="head-cg">
|
|
||||||
<!-- <img src="@/assets/img1/cg.svg">-->
|
|
||||||
<img src="@/assets/orangeUi/cg.svg">
|
|
||||||
</div>
|
|
||||||
<div class="main-content">
|
|
||||||
<div class="main-text">
|
|
||||||
{{ store.user.userName }},您已成功报名!<p>感谢您参与本次 <em style="font-style: normal; color:red; font-weight: 700">{{
|
|
||||||
getUserInfo(store.getMajorId) }}</em> 学科评卷工作!
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="main-icon">
|
|
||||||
<div class="main-item">
|
|
||||||
<van-row wrap>
|
|
||||||
<van-col span="6" v-if="showIcon.show0">
|
|
||||||
<img @click="show0 = true" src="../assets/imgs/my.svg" alt="">
|
|
||||||
<van-dialog title="个人信息" :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }" :show-confirm-button="false"
|
|
||||||
v-model:show="show0">
|
|
||||||
<div class="tishi">
|
|
||||||
|
|
||||||
<van-form @submit="onSubmit">
|
|
||||||
<van-cell-group inset>
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.userName"
|
|
||||||
v-model="user.userName" name="userName" label="姓名" type="text" />
|
|
||||||
<van-field readonly style="height: 35px; line-height:100%" v-if="user.identityId"
|
|
||||||
v-model="user.identityId" name="userCardId" label="身份证号" />
|
|
||||||
<!-- <van-field-->
|
|
||||||
<!-- style="height: 35px; line-height: 100%"-->
|
|
||||||
<!-- v-model="user.sex"-->
|
|
||||||
<!-- readonly-->
|
|
||||||
<!-- name="picker"-->
|
|
||||||
<!-- label="性别"-->
|
|
||||||
|
|
||||||
<!-- />-->
|
|
||||||
<!-- <van-field-->
|
|
||||||
<!-- style="height: 35px; line-height: 100%"-->
|
|
||||||
<!-- readonly-->
|
|
||||||
<!-- v-model="user.age"-->
|
|
||||||
<!-- name="age"-->
|
|
||||||
<!-- label="年龄"-->
|
|
||||||
<!-- type="text"-->
|
|
||||||
|
|
||||||
<!-- />-->
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.phone" v-model="user.phone"
|
|
||||||
name="phone" label="手机号" type="number" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" v-if="user.jobTitle" v-model="user.jobTitle"
|
|
||||||
readonly name="picker" label="职称" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.office" v-model="user.office"
|
|
||||||
name="office" label="职务" type="text" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.workName"
|
|
||||||
v-model="user.workName" name="workName" label="单位名称" type="text" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.workPhone"
|
|
||||||
v-model="user.workPhone" name="workPhoen" label="单位电话" type="text" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" v-if="user.pyCard" readonly v-model="user.pyCard"
|
|
||||||
name="pyCard" label="银行卡号" type="number" />
|
|
||||||
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.bankAddress"
|
|
||||||
v-model="user.bankAddress" name="bankAddress" label="开户所在地" type="text" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.bankName"
|
|
||||||
v-model="user.bankName" name="bankName" label="开户行" type="text" />
|
|
||||||
<van-field style="height: 35px; line-height: 100%" readonly v-if="user.carStatus === 1"
|
|
||||||
v-model="user.carNumber" name="carNumber" label="车牌号" type="text" height="40px" />
|
|
||||||
<van-field name="dormitoryStatus" v-if="user.dormitoryStatus === 1" :readonly="true"
|
|
||||||
style="height: 35px; line-height: 50%" label="是否住宿">
|
|
||||||
<template #input>
|
|
||||||
<van-radio-group checked-color="#8D2328" style="height: 35px; line-height: 50%"
|
|
||||||
v-model="user.dormitoryStatus" direction="horizontal">
|
|
||||||
<!-- <van-radio name="1">是</van-radio>-->
|
|
||||||
<!-- <van-radio name="0">否</van-radio>-->
|
|
||||||
{{ user.dormitoryStatus === 1 ? '是' : '否' }}
|
|
||||||
</van-radio-group>
|
|
||||||
</template>
|
|
||||||
</van-field>
|
|
||||||
<van-field v-if="user.studentId" style="height: 35px; line-height: 100%" readonly
|
|
||||||
v-model="user.studentId" name="studentId" label="学号" type="text" height="40px" />
|
|
||||||
<van-field v-if="user.teacherId" style="height: 35px; line-height: 100%" readonly
|
|
||||||
v-model="user.teacherId" name="teacherId" label="工号" type="text" height="40px" />
|
|
||||||
<van-field v-if="user.mealCard" style="height: 35px; line-height: 100%" readonly
|
|
||||||
v-model="user.mealCard" name="teacherId" label="饭卡" type="text" height="40px" />
|
|
||||||
|
|
||||||
</van-cell-group>
|
|
||||||
</van-form>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span class="dialog-close-content" @click="show0 = false">×</span>
|
|
||||||
</van-dialog>
|
|
||||||
<p>我的信息</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
|
|
||||||
<van-col span="6" v-if="showIcon.show1">
|
|
||||||
<img @click="show1 = true" src="../assets/imgs/ditu.svg" alt="">
|
|
||||||
<div class="ditu-img" v-if="show1">
|
|
||||||
<span @click="show1 = false">
|
|
||||||
关闭 ✕
|
|
||||||
</span>
|
|
||||||
<div class="card-img">
|
|
||||||
<img src="@/assets/orangeUi/ditu.jpg" style="width: 100%;height: 100%" alt="师大地图">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p>师大地图</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
|
|
||||||
<van-col span="6" v-if="showIcon.show2">
|
|
||||||
<img @click="show2 = true" src="@/assets/imgs/txz.svg" alt="">
|
|
||||||
<div class="txz-img" v-if="show2">
|
|
||||||
<span @click="show2 = false">
|
|
||||||
关闭 ✕
|
|
||||||
</span>
|
|
||||||
<!-- <div class="card-pai">黑A·35648</div>-->
|
|
||||||
<div class="card-pai">{{ carNum() }}</div>
|
|
||||||
<div class="card-tishi">该车辆为评卷教师车辆,已向学校报备,请放行!</div>
|
|
||||||
</div>
|
|
||||||
<p>通行证</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
<van-col span="6" v-if="showIcon.show3">
|
|
||||||
<img @click="showGroup" src="@/assets/imgs/fenzu.svg" alt="">
|
|
||||||
<van-dialog :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }" :show-confirm-button="false"
|
|
||||||
:show-cancel-button="false" v-model:show="show3">
|
|
||||||
<span class="dialog-close-content" @click="show3 = false">×</span>
|
|
||||||
<div class="grop-by">
|
|
||||||
分组信息
|
|
||||||
<p v-if="!group">暂时未分组</p>
|
|
||||||
<p v-else>{{ group }}</p>
|
|
||||||
</div>
|
|
||||||
</van-dialog>
|
|
||||||
<p>所属分组</p>
|
|
||||||
</van-col>
|
|
||||||
<van-col span="6" v-if="showIcon.show4">
|
|
||||||
<img @click="show4 = true" src="@/assets/imgs/sushi.svg" alt="">
|
|
||||||
<van-dialog :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }" :show-confirm-button="false"
|
|
||||||
:show-cancel-button="false" v-model:show="show4">
|
|
||||||
<span class="dialog-close-content" @click="show4 = false">×</span>
|
|
||||||
<div class="grop-by">
|
|
||||||
宿舍分配
|
|
||||||
<p v-if="!store.LoginUser.dormitory">暂时未分配</p>
|
|
||||||
<p v-else>{{ store.LoginUser.dormitory }}</p>
|
|
||||||
</div>
|
|
||||||
</van-dialog>
|
|
||||||
<p>宿舍</p>
|
|
||||||
</van-col>
|
|
||||||
<van-col span="6" v-if="showIcon.show5">
|
|
||||||
<img @click="show5 = true" src="@/assets/imgs/didian.svg" alt="">
|
|
||||||
<van-dialog :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }" :show-confirm-button="false"
|
|
||||||
:show-cancel-button="false" v-model:show="show5">
|
|
||||||
<div class="grop-by">
|
|
||||||
评卷地点信息
|
|
||||||
<p>暂时未发布</p>
|
|
||||||
<!-- <p v-if="!group">暂时未发布</p>-->
|
|
||||||
<!-- <p v-else>{{ group }}</p>-->
|
|
||||||
</div>
|
|
||||||
<!-- <img src="@/assets/img/dt.jpg"/>-->
|
|
||||||
<span class="dialog-close-content" @click="show5 = false">×</span>
|
|
||||||
</van-dialog>
|
|
||||||
<p>评卷地点</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
<van-col span="6">
|
|
||||||
<img @click="show6 = true" src="@/assets/imgs/xysh.svg" alt="">
|
|
||||||
<div class="xysh-img" :class="handoffValue" v-if="show6" @click="toggleShow">
|
|
||||||
<span @click="show6 = false">
|
|
||||||
关闭 ✕
|
|
||||||
</span>
|
|
||||||
<!-- <em class="em-next"></em>-->
|
|
||||||
</div>
|
|
||||||
<p>校园生活</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
<van-col span="6" v-if="showIcon.show7">
|
|
||||||
<img @click="show7 = true" src="../assets/imgs/zhixie.svg" alt="">
|
|
||||||
<div class="zhixie-img" v-if="show7">
|
|
||||||
<span @click="show7 = false">
|
|
||||||
关闭 ✕
|
|
||||||
</span>
|
|
||||||
<div class="card-img">
|
|
||||||
<img src="@/assets/orangeUi/zhixie.jpg" style="width: 100%;height: 100%">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p>致谢</p>
|
|
||||||
</van-col>
|
|
||||||
|
|
||||||
|
|
||||||
<!-- <van-col span="6" v-if="showIcon.show8">-->
|
|
||||||
<!-- <img @click="show8 = true" src="@/assets/imgs/zz.svg" alt="">-->
|
|
||||||
<!-- <van-dialog-->
|
|
||||||
<!-- style="height: 80%;"-->
|
|
||||||
<!-- :overlayStyle="{ background: 'rgba(0, 0, 0, 0.8)' }"-->
|
|
||||||
<!-- :show-confirm-button="false"-->
|
|
||||||
<!-- cancel-button-text="长按图片保存"-->
|
|
||||||
<!-- cancel-button-color="#e34032"-->
|
|
||||||
<!-- v-model:show="show8" show-cancel-button>-->
|
|
||||||
<!-- <img src="@/assets/img/ryzs.png"/>-->
|
|
||||||
<!-- <span class="dialog-close-content" @click="show8 = false">×</span>-->
|
|
||||||
<!-- </van-dialog>-->
|
|
||||||
<!-- <p>证书</p>-->
|
|
||||||
<!-- </van-col>-->
|
|
||||||
</van-row>
|
|
||||||
|
|
||||||
<div class="main-bottom">
|
|
||||||
<!-- <img src="@/assets/img/bottom.png">-->
|
|
||||||
<!-- <img src="@/assets/img1/footer1.svg" >-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="footer">
|
|
||||||
<!-- <img class="bot-img" src="@/assets/img1/footer3.svg" >-->
|
|
||||||
<img class="bot-img" src="@/assets/orangeUi/footer_cg.svg">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
<script setup lang="ts">
|
|
||||||
import { onMounted, reactive, ref } from "vue";
|
|
||||||
import { useUserStore } from "@/store";
|
|
||||||
import api from "@/api";
|
|
||||||
import waiTApi from "@/api/waiTApi";
|
|
||||||
|
|
||||||
const store = useUserStore();
|
|
||||||
const show0 = ref(false);
|
|
||||||
const show1 = ref(false);
|
|
||||||
const show2 = ref(false);
|
|
||||||
const show3 = ref(false);
|
|
||||||
const show4 = ref(false);
|
|
||||||
const show5 = ref(false);
|
|
||||||
const show6 = ref(false);
|
|
||||||
const show7 = ref(false);
|
|
||||||
const show8 = ref(false);
|
|
||||||
const showDitu = ref(false);
|
|
||||||
const handoff = ref(false)
|
|
||||||
const handoffValue = ref("xysh-img1")
|
|
||||||
|
|
||||||
function toggleShow() {
|
|
||||||
if (handoff.value) {
|
|
||||||
handoffValue.value = "xysh-img2"
|
|
||||||
handoff.value = false
|
|
||||||
} else {
|
|
||||||
handoffValue.value = "xysh-img1"
|
|
||||||
handoff.value = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const user = store.LoginUser
|
|
||||||
/*
|
|
||||||
* 1. 获取用户信息
|
|
||||||
* 2. 获取用户分组信息
|
|
||||||
* 3. 获取用户宿舍信息
|
|
||||||
* 4. 获取用户评卷地点信息
|
|
||||||
* 5. 获取用户校园生活信息
|
|
||||||
* 6. 获取用户致谢信息
|
|
||||||
* 7. 获取用户证书信息
|
|
||||||
* */
|
|
||||||
const group = ref("")
|
|
||||||
const showIcon = reactive({
|
|
||||||
show0: false,
|
|
||||||
show1: false,
|
|
||||||
show2: false,
|
|
||||||
show3: false,
|
|
||||||
show4: false,
|
|
||||||
show5: false,
|
|
||||||
show6: false,
|
|
||||||
show7: false,
|
|
||||||
show8: false,
|
|
||||||
})
|
|
||||||
|
|
||||||
const showGroup = () => {
|
|
||||||
show3.value = true
|
|
||||||
waiTApi.getGroup(store.LoginUser.groupId).then(res => {
|
|
||||||
console.log(res.data.name)
|
|
||||||
group.value = res.data.name
|
|
||||||
|
|
||||||
}, err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
const carNum = () => {
|
|
||||||
let carNum = store.LoginUser!.carNumber
|
|
||||||
if (carNum) {
|
|
||||||
var s = carNum.substring(0, 2);
|
|
||||||
var s1 = carNum.substring(2);
|
|
||||||
return s + '·' + s1
|
|
||||||
} else {
|
|
||||||
return "暂没有车牌号"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 页面加载时获取用户信息
|
|
||||||
//onMounted(() => {
|
|
||||||
// api.getUser(store.getOpenId).then(res => {
|
|
||||||
// console.log("获取到的用户信息")
|
|
||||||
// // console.log( store.LoginUser.majorId)
|
|
||||||
// store.setMajorId(store.LoginUser.majorId)
|
|
||||||
// Object.assign(showIcon, res.data.data)
|
|
||||||
// }, err => {
|
|
||||||
// console.log(err)
|
|
||||||
// })
|
|
||||||
|
|
||||||
|
|
||||||
//});
|
|
||||||
|
|
||||||
function getUserInfo(majorId: number) {
|
|
||||||
let majorName = ""
|
|
||||||
majors.forEach(item => {
|
|
||||||
if (item.value === majorId) {
|
|
||||||
majorName = item.name
|
|
||||||
}
|
|
||||||
})
|
|
||||||
return majorName
|
|
||||||
}
|
|
||||||
|
|
||||||
const majors = [
|
|
||||||
{
|
|
||||||
id: 1,
|
|
||||||
name: '语文',
|
|
||||||
value: 1,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
name: '地理',
|
|
||||||
value: 4,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
name: '历史',
|
|
||||||
value: 7,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
name: '政治',
|
|
||||||
value: 8,
|
|
||||||
}]
|
|
||||||
</script>
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.dialog-close-content {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
top: 0;
|
|
||||||
font-weight: 700;
|
|
||||||
font-size: 30px;
|
|
||||||
//background-color: #42b983;
|
|
||||||
color: #949494;
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-container {
|
|
||||||
height: 100vh;
|
|
||||||
width: 100vw;
|
|
||||||
background: url("@/assets/orangeUi/bj5.svg") no-repeat;
|
|
||||||
//background: url("@/assets/img1/bj.svg") no-repeat;
|
|
||||||
background-size: 100%;
|
|
||||||
|
|
||||||
.hsd-title {
|
|
||||||
width: 100vw;
|
|
||||||
height: 15vh;
|
|
||||||
padding-top: 5vh;
|
|
||||||
|
|
||||||
//border: 1px solid red;
|
|
||||||
img {
|
|
||||||
width: 65%;
|
|
||||||
margin-top: 8vh;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.head-cg {
|
|
||||||
width: 100vw;
|
|
||||||
height: 15vh;
|
|
||||||
|
|
||||||
//border: 1px solid black;
|
|
||||||
img {
|
|
||||||
margin-top: 5vh;
|
|
||||||
width: 90%;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-content {
|
|
||||||
margin-top: 10vh;
|
|
||||||
width: 100vw;
|
|
||||||
height: 10vh;
|
|
||||||
//border: 1px solid orange;
|
|
||||||
color: black;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-icon {
|
|
||||||
width: 97vw;
|
|
||||||
height: 20vh;
|
|
||||||
margin: 0 auto;
|
|
||||||
margin-top: 5vh;
|
|
||||||
|
|
||||||
//border: 1px solid green;
|
|
||||||
.main-item {
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 50%;
|
|
||||||
margin-top: 15%;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin-top: -5px;
|
|
||||||
font-size: 0.7rem;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
width: 100vw;
|
|
||||||
height: 20vh;
|
|
||||||
|
|
||||||
//border: 1px solid blue;
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.grop-by {
|
|
||||||
width: 100%;
|
|
||||||
height: 100px;
|
|
||||||
|
|
||||||
p {
|
|
||||||
text-align: center;
|
|
||||||
line-height: 100px;
|
|
||||||
font-size: initial;
|
|
||||||
color: red;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.txz-img {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
//border: 5px solid red;
|
|
||||||
background-image: url("@/assets/orangeUi/txz.svg");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: cover;
|
|
||||||
/* 修改这里 */
|
|
||||||
z-index: 999;
|
|
||||||
|
|
||||||
span {
|
|
||||||
width: 30vw;
|
|
||||||
//border: 1px solid red;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #262626;
|
|
||||||
font-size: 20px;
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-pai {
|
|
||||||
position: absolute;
|
|
||||||
left: 8.5vw;
|
|
||||||
top: 71vh;
|
|
||||||
//font-size: 24px;
|
|
||||||
font-family: 微软雅黑;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 35px;
|
|
||||||
height: 2.5rem;
|
|
||||||
width: 80%;
|
|
||||||
opacity: 1;
|
|
||||||
//color: rgba(141, 35, 40, 0.6);
|
|
||||||
//color: rgba(255, 255, 255, 0.8);
|
|
||||||
color: white;
|
|
||||||
|
|
||||||
font-weight: 600;
|
|
||||||
border-radius: 132px;
|
|
||||||
background: rgba(255, 255, 255, 1), rgba(255, 255, 255, 1);
|
|
||||||
border: 4px solid rgba(255, 255, 255, 0.7);
|
|
||||||
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1), 0px 3px 7px rgba(0, 0, 0, 0.1), 0px 12px 12px rgba(0, 0, 0, 0.09), 0px 27px 16px rgba(0, 0, 0, 0.05), 0px 47px 19px rgba(0, 0, 0, 0.01), 0px 74px 21px rgba(0, 0, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-tishi {
|
|
||||||
position: absolute;
|
|
||||||
top: 80vh;
|
|
||||||
left: 10vw;
|
|
||||||
text-align: left;
|
|
||||||
width: 80vw;
|
|
||||||
font-size: 18px;
|
|
||||||
color: white;
|
|
||||||
margin: 0 auto;
|
|
||||||
text-indent: 34px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//地图
|
|
||||||
.ditu-img {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
background-color: white;
|
|
||||||
z-index: 999;
|
|
||||||
|
|
||||||
img {
|
|
||||||
padding-top: 30%;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
position: absolute;
|
|
||||||
left: 80%;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #262626;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.zhixie-img {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
background-color: white;
|
|
||||||
z-index: 999;
|
|
||||||
|
|
||||||
img {
|
|
||||||
margin-top: 20%;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
position: absolute;
|
|
||||||
left: 80%;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #262626;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.xysh-img1 {
|
|
||||||
background: url("@/assets/orangeUi/xysh1.jpg") no-repeat center center;
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.xysh-img2 {
|
|
||||||
background: url("@/assets/orangeUi/xysh2.jpg") no-repeat center center;
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.xysh-img {
|
|
||||||
//background: url("@/assets/orangeUi/xysh.svg") no-repeat center;
|
|
||||||
////background-size: cover;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
background-color: white;
|
|
||||||
|
|
||||||
//background: url() no-repeat;
|
|
||||||
.card-img {
|
|
||||||
//padding-top: 10%;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
width: 30vw;
|
|
||||||
//border: 1px solid red;
|
|
||||||
font-weight: 700;
|
|
||||||
color: #262626;
|
|
||||||
font-size: 20px;
|
|
||||||
position: absolute;
|
|
||||||
right: 5px;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 下一页
|
|
||||||
.em-next {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
right: 10px;
|
|
||||||
/* 将元素向上移动自身高度的一半,以居中对齐 */
|
|
||||||
//transform: translateY(-50%);
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 20px 20px 0 0;
|
|
||||||
/* 创建一个向右的三角形 */
|
|
||||||
border-color: #050505 transparent transparent transparent;
|
|
||||||
transform: rotate(135deg);
|
|
||||||
/* 箭头颜色为红色,其余部分透明 */
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in New Issue