Skip to content

E
educationStu
Commit e298b48c authored by 罗超's avatar 罗超
Browse files
Options

2

parent ca53f6d4
Hide whitespace changes
Inline Side-by-side
Showing with 238 additions and 13 deletions
src/components/bottom.vue 0 → 100644
View file @ e298b48c
<template>
<view class="bottom">
<image src="../static/image/bottomlogo.png" mode="" class="img" />
</view>
</template>
<style scoped>
.bottom {
width: 100vw;
height: 130rpx;
display: flex;
justify-content: center;
align-items: center;
}
.img {
width: 165rpx;
height: 55rpx;
}
</style>
src/pages.json
View file @ e298b48c
...@@ -30,7 +30,8 @@ ...@@ -30,7 +30,8 @@
"path": "pages/person/person", "path": "pages/person/person",
"style":{ "style":{
"navigationBarTitleText":"个人中心", "navigationBarTitleText":"个人中心",
"backgroundColor":"#f5f5f5" "backgroundColor":"#f5f5f5",
"navigationBarBackgroundColor":"#f5f5f5"
} }
}], }],
"subPackages": [{ "subPackages": [{
......
src/pages/person/person.vue
View file @ e298b48c
...@@ -12,7 +12,8 @@ ...@@ -12,7 +12,8 @@
:src="pageData.StuIcon" :src="pageData.StuIcon"
mode="aspectFill" mode="aspectFill"
style="width:100%;height:100%;border-radius: 50%;" style="width:100%;height:100%;border-radius: 50%;"
></image> >
</image>
</view> </view>
</view> </view>
<view class="orderInfo flex_between_center"> <view class="orderInfo flex_between_center">
...@@ -23,8 +24,8 @@ ...@@ -23,8 +24,8 @@
src="../../static/image/person/order1.png" src="../../static/image/person/order1.png"
mode="aspectFill" mode="aspectFill"
class="orderIcon" class="orderIcon"
></image ></image>
></view> </view>
<view class="orderName"> <view class="orderName">
语培订单 语培订单
</view> </view>
...@@ -36,8 +37,8 @@ ...@@ -36,8 +37,8 @@
src="../../static/image/person/order2.png" src="../../static/image/person/order2.png"
mode="aspectFill" mode="aspectFill"
class="orderIcon" class="orderIcon"
></image ></image>
></view> </view>
<view class="orderName"> <view class="orderName">
留学订单 留学订单
</view> </view>
...@@ -46,11 +47,11 @@ ...@@ -46,11 +47,11 @@
<view class=" flex_between_center" style="width:100%"> <view class=" flex_between_center" style="width:100%">
<view class="orderNum">{{ pageData.ContractNum }}</view> <view class="orderNum">{{ pageData.ContractNum }}</view>
<image <image
src="../../static/image/person/order1.png" src="../../static/image/person/order3.png"
mode="aspectFill" mode="aspectFill"
class="orderIcon" class="orderIcon"
></image ></image>
></view> </view>
<view class="orderName"> <view class="orderName">
合同信息 合同信息
</view> </view>
...@@ -89,10 +90,67 @@ ...@@ -89,10 +90,67 @@
</view> </view>
</view> </view>
<view class="courseBox"> <view class="courseBox">
<view class="left"></view> <view class="left">
<view class="right"> </view> <image
:src="pageData.CourseInfo.B2BIcon"
mode="aspectFill"
style="width:100%;height:100%;border-radius: 30rpx;"
></image>
</view>
<view class="right">
<view class="className one_line">{{
pageData.CourseInfo.CourseName
}}</view>
<view class="Grade" style="margin-bottom:20rpx">{{
pageData.CourseInfo.ClassName
}}</view>
<view class="Grade">等级：{{ pageData.CourseInfo.CourseRate }}</view>
<view
><text class="Grade">状态：</text>
<text class="StatusName">{{
pageData.CourseInfo.ClassStatusName
}}</text>
</view>
</view>
</view> </view>
</view> </view>
<view class="serve">
<view class="serveSubTitle">随时电话联系哟</view>
<view class="serveTitle">服务人员信息</view>
<view v-for="(item,index) in AssistList" :key="index" class="serviceItem">
<view class="headimg">
<image
:src="item.UserIcon"
mode="aspectFill"
style="width:100%;height:100%;border-radius: 24rpx;"
v-if="item.UserIcon"
/>
<view
class="flex_center_center"
style="width:100%;height:100%;border-radius: 24rpx;font-size: 46rpx;font-weight: bold;color: #FFFFFF;background-color: #4c50e7;"
v-else
>{{ item.EmployeeName.slice(0, 1) }}</view
>
</view>
<view class="serviceInfo flex_between_center">
<view class="flex_start_around" style="width:380rpx;height:100%">
<view class="flex_start_center" style="height:32rpx">
<text class="EmployeeName">{{ item.EmployeeName }}</text
><text class="AssistTypeName">{{ item.AssistTypeName }}</text>
</view>
<view class="Mobile" >{{item.Mobile }}</view>
</view>
<view style="width:60rpx;height:40rpx;" @click="callphone(item.Mobile)">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/callphone.png"
mode="aspectFit"
style="width:100%;height:100%"
/>
</view>
</view>
</view>
</view>
<bottom />
</view> </view>
</template> </template>
...@@ -108,11 +166,35 @@ import { ...@@ -108,11 +166,35 @@ import {
onMounted, onMounted,
inject, inject,
} from "vue"; } from "vue";
import bottom from "../../components/bottom";
export default { export default {
components: {
bottom,
},
setup(props, context) { setup(props, context) {
let { proxy } = getCurrentInstance(); let { proxy } = getCurrentInstance();
let data = reactive({ let data = reactive({
pageData: {}, pageData: {},
AssistList: [
{
AssistTypeName: "市场经理",
EmployeeName: "阿里粑粑",
UserIcon: "",
Mobile: "18011251414",
},
{
AssistTypeName: "市场经理",
EmployeeName: "阿里粑粑",
UserIcon: "",
Mobile: "18011251414",
},
{
AssistTypeName: "市场经理",
EmployeeName: "阿里粑粑",
UserIcon: "",
Mobile: "18011251414",
},
],
}); });
const methods = { const methods = {
async getData() { async getData() {
...@@ -121,6 +203,11 @@ export default { ...@@ -121,6 +203,11 @@ export default {
console.log(431, data.pageData); console.log(431, data.pageData);
}); });
}, },
callphone(num) {
uni.makePhoneCall({
phoneNumber: num,
});
},
}; };
onMounted(() => { onMounted(() => {
...@@ -129,6 +216,7 @@ export default { ...@@ -129,6 +216,7 @@ export default {
let that = methods; let that = methods;
return { return {
...toRefs(data), ...toRefs(data),
...methods
}; };
}, },
}; };
...@@ -136,7 +224,7 @@ export default { ...@@ -136,7 +224,7 @@ export default {
<style scoped> <style scoped>
.person { .person {
height: 100vh; min-height: 100vh;
background-color: #f5f5f5; background-color: #f5f5f5;
} }
...@@ -188,38 +276,46 @@ export default { ...@@ -188,38 +276,46 @@ export default {
flex-wrap: wrap; flex-wrap: wrap;
align-content: space-between; align-content: space-between;
} }
.orderItem .orderNum { .orderItem .orderNum {
font-size: 46rpx; font-size: 46rpx;
font-weight: 800; font-weight: 800;
font-style: italic; font-style: italic;
color: #111111; color: #111111;
} }
.orderItem .orderIcon { .orderItem .orderIcon {
width: 65rpx; width: 65rpx;
height: 65rpx; height: 65rpx;
background-color: #fff; background-color: #fff;
} }
.orderItem .orderName { .orderItem .orderName {
font-size: 24rpx; font-size: 24rpx;
font-weight: 500; font-weight: 500;
color: #666666; color: #666666;
} }
.courseInfo { .courseInfo {
height: 535rpx; /* height: 535rpx; */
background-color: #ebebeb; background-color: #ebebeb;
padding: 35rpx; padding: 35rpx;
margin-bottom: 50rpx;
} }
.courseInfo .title { .courseInfo .title {
font-size: 28rpx; font-size: 28rpx;
font-weight: bold; font-weight: bold;
color: #111111; color: #111111;
margin-bottom: 30rpx; margin-bottom: 30rpx;
} }
.statistic { .statistic {
/* height: 70rpx; */ /* height: 70rpx; */
display: flex; display: flex;
margin-bottom: 50rpx; margin-bottom: 50rpx;
} }
.statisticItem { .statisticItem {
min-width: 80rpx; min-width: 80rpx;
/* height: 70rpx; */ /* height: 70rpx; */
...@@ -228,6 +324,7 @@ export default { ...@@ -228,6 +324,7 @@ export default {
align-content: space-between; align-content: space-between;
margin-right: 100rpx; margin-right: 100rpx;
} }
.statisticItem .time { .statisticItem .time {
width: 100%; width: 100%;
font-size: 46rpx; font-size: 46rpx;
...@@ -236,6 +333,7 @@ export default { ...@@ -236,6 +333,7 @@ export default {
font-style: italic; font-style: italic;
color: #111111; color: #111111;
} }
.statisticItem .unit { .statisticItem .unit {
font-size: 20rpx; font-size: 20rpx;
font-weight: 500; font-weight: 500;
...@@ -243,19 +341,119 @@ export default { ...@@ -243,19 +341,119 @@ export default {
font-style: normal; font-style: normal;
margin-left: 10rpx; margin-left: 10rpx;
} }
.statisticName { .statisticName {
font-size: 20rpx; font-size: 20rpx;
font-weight: 500; font-weight: 500;
color: #666666; color: #666666;
white-space: nowrap; white-space: nowrap;
} }
.courseBox { .courseBox {
display: flex; display: flex;
} }
.courseBox .left { .courseBox .left {
width: 215rpx; width: 215rpx;
height: 275rpx; height: 275rpx;
background: #d5f3e9; background: #d5f3e9;
border-radius: 30rpx; border-radius: 30rpx;
margin-right: 40rpx;
}
.courseBox .right {
width: 420rpx;
padding-top: 25rpx;
}
.courseBox .className {
font-size: 36rpx;
font-weight: bold;
color: #111111;
}
.courseBox .Grade {
font-size: 22rpx;
font-weight: 500;
color: #666666;
margin: 10rpx 0;
}
.courseBox .StatusName {
/* height: 30rpx; */
line-height: 30rpx;
font-size: 22rpx;
font-weight: 500;
color: #333333;
background-color: #5de3a6;
box-sizing: border-box;
border-radius: 4rpx;
padding: 5rpx 10rpx;
}
.serve {
padding: 0 35rpx;
background-color: #f5f5f5;
}
.serveTitle {
font-size: 46rpx;
font-weight: bold;
color: #111111;
}
.serveSubTitle {
font-size: 28rpx;
font-weight: 500;
color: #666666;
margin-bottom: 20rpx;
}
.serviceItem {
box-sizing: border-box;
width: 680rpx;
height: 185rpx;
background-color: #ffffff;
border-radius: 24rpx;
margin-top: 30rpx;
display: flex;
/* justify-content: space-between; */
align-items: center;
padding: 25rpx;
}
.serviceItem .headimg {
width: 130rpx;
height: 130rpx;
border-radius: 24rpx;
margin-right: 30rpx;
}
.serviceInfo {
width: 435rpx;
height: 100%;
}
.EmployeeName {
font-size: 34rpx;
font-weight: bold;
color: #111111;
}
.AssistTypeName {
height: 26rpx;
background-color: #fa9717;
border-radius: 6rpx;
font-size: 20rpx;
font-weight: 500;
color: #ffffff;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
margin-left: 15rpx;
padding: 3rpx 6rpx;
}
.Mobile {
font-size: 28rpx;
font-weight: 500;
color: #111111;
} }
</style> </style>
src/static/css/common.css
View file @ e298b48c
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
} }
.flex_center_center { .flex_center_center {
display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
flex-flow: column wrap flex-flow: column wrap
...@@ -35,6 +36,7 @@ ...@@ -35,6 +36,7 @@
} }
.flex_start_center { .flex_start_center {
display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
...@@ -64,6 +66,12 @@ ...@@ -64,6 +66,12 @@
justify-content: flex-start; justify-content: flex-start;
align-content: space-between; align-content: space-between;
} }
.flex_start_around {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-content: space-around;
}
.flex_direction { .flex_direction {
flex-direction: column; flex-direction: column;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment