Commit f7e2b5dc81bd3e1798c8f226c2fd7cadd4387f66

Authored by 夏洋涛
2 parents 52c5aa1e 437deddc
Exists in master

Merge branch 'master' of http://git.shunzhi.net/sxhgroup/sxhpersonalcenterzlb

src/assets/rank/1.png 0 → 100644

2.52 KB

src/assets/rank/2.png 0 → 100644

2.9 KB

src/assets/rank/3.png 0 → 100644

3.28 KB

src/assets/rank/bj.png 0 → 100644

9.08 KB

src/assets/rank/blue_rank.png 0 → 100644

276 KB

src/assets/rank/by.png 0 → 100644

9.72 KB

src/assets/rank/hj.png 0 → 100644

10.8 KB

src/assets/rank/jb.png 0 → 100644

13.6 KB

src/assets/rank/qz.png 0 → 100644

11.5 KB

src/assets/rank/rank.png 0 → 100644

369 Bytes

src/assets/rank/rank_on.png 0 → 100644

381 Bytes

src/assets/rank/red_rank.png 0 → 100644

178 KB

src/assets/rank/red_rank1.png 0 → 100644

201 KB

src/assets/rank/tx.png 0 → 100644

7.31 KB

src/assets/rank/wxsn.png 0 → 100644

228 KB

src/component/Tabbar4.vue
... ... @@ -10,6 +10,11 @@
10 10 <img v-else src="../assets/tabbar4/tab2_off.png" alt="">
11 11 <p>每日一习</p>
12 12 </div>
  13 + <!-- <div class="tab" :class="active=='rank'?'active':''" @click="handleRank">
  14 + <img v-if="active=='rank'" src="../assets/rank/rank_on.png" alt="">
  15 + <img v-else src="../assets/rank/rank.png" alt="">
  16 + <p>排行榜</p>
  17 + </div> -->
13 18 <div class="tab" :class="active=='fruit'?'active':''" @click="handleFruit">
14 19 <img v-if="active=='fruit'" src="../assets/tabbar4/fruit_on.png" alt="">
15 20 <img v-else src="../assets/tabbar4/fruit_off.png" alt="">
... ... @@ -43,6 +48,9 @@ export default {
43 48 handleFruit() {
44 49 // this.$router.replace({ path:'/achievements' })
45 50 this.$router.replace({ path:'/achievementsOne' })
  51 + },
  52 + handleRank() {
  53 + this.$router.replace({ path:'/rank' })
46 54 }
47 55 }
48 56 }
... ...
src/main.js
1 1 import Vue from 'vue'
2   -import { Popup, Toast, Picker, Tag, Tab, Tabs, Area, Search, Swipe, SwipeItem, Cell, List, Collapse, CollapseItem, Button, Field, Icon, Sticky, DropdownMenu, DropdownItem, Rate, Calendar, Checkbox, Empty, Lazyload, Radio, RadioGroup, CellGroup, Dialog, CheckboxGroup, NavBar, PullRefresh, Cascader , ImagePreview } from 'vant';
  2 +import { Popup, Toast, Picker, Tag, Tab, Tabs, Area, Search, Swipe,Col, Row , SwipeItem, Cell, List, Collapse, CollapseItem, Button, Field, Icon, Sticky, DropdownMenu, DropdownItem, Rate, Calendar, Checkbox, Empty, Lazyload, Radio, RadioGroup, CellGroup, Dialog, CheckboxGroup, NavBar, PullRefresh, Cascader , ImagePreview } from 'vant';
3 3 import App from './App.vue'
4 4 import router from './router'
5 5 import store from './store'
... ... @@ -10,6 +10,8 @@ Vue.prototype.Moment = Moment;
10 10 // Vue.prototype.yanxueUrl = 'https://yanxue.myjxt.com';
11 11 // Vue.prototype.dataUrl = 'http://47.110.50.251:9010'
12 12 Vue.prototype.dataUrl = 'https://proxy.shunzhi.net/consulte'
  13 +// Vue.prototype.kqUrl = 'http://47.110.50.251:9092/'
  14 +Vue.prototype.kqUrl = 'https://proxy.shunzhi.net/achieve'
13 15  
14 16 import yxAxios from '@/https/yxAxios'
15 17 Vue.prototype.yxAxios = yxAxios;
... ... @@ -54,7 +56,9 @@ Vue
54 56 .use(RadioGroup)
55 57 .use(Cascader)
56 58 .use(ImagePreview)
57   - .use(Radio);
  59 + .use(Radio)
  60 + .use(Col)
  61 + .use(Row);
58 62 Vue.config.productionTip = false;
59 63 Vue.config.ignoredElements = ['wx-open-launch-app'];
60 64 new Vue({
... ...
src/router/index.js
... ... @@ -39,6 +39,10 @@ import achievements from &#39;@/views/Yanxue/achievements.vue&#39; //研学成果
39 39 import achievementsOne from '@/views/Yanxue/achievementsOne.vue' //研学成果
40 40 import chooseSchoolOne from '@/views/Yanxue/chooseSchoolOne.vue' //研学成果
41 41 import pageDetails from '@/views/Yanxue/pageDetails.vue' //研学成果
  42 +import rank from '@/views/answerRank/rank.vue' //排行榜
  43 +import ans_rank from '@/views/answerRank/ans_rank.vue' //答题排行榜
  44 +import brush_questions from '@/views/answerRank/brush_questions.vue' //刷题记录
  45 +import stars from '@/views/answerRank/stars.vue' //五星少年
42 46  
43 47 Vue.use(VueRouter)
44 48 const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace];
... ... @@ -298,6 +302,38 @@ const routes = [{
298 302 }
299 303 },
300 304 {
  305 + path: '/rank',
  306 + name: 'rank',
  307 + component: rank,
  308 + meta: {
  309 + title: '排行榜'
  310 + }
  311 + },
  312 + {
  313 + path: '/ans_rank',
  314 + name: 'ans_rank',
  315 + component: ans_rank,
  316 + meta: {
  317 + title: '排行榜'
  318 + }
  319 + },
  320 + {
  321 + path: '/brush_questions',
  322 + name: 'brush_questions',
  323 + component: brush_questions,
  324 + meta: {
  325 + title: '刷题记录'
  326 + }
  327 + },
  328 + {
  329 + path: '/stars',
  330 + name: 'stars',
  331 + component: stars,
  332 + meta: {
  333 + title: '五星少年'
  334 + }
  335 + },
  336 + {
301 337 path: '/YanxueDetail',
302 338 name: 'YanxueDetail',
303 339 component: YanxueDetail,
... ...
src/views/Service/AbroadDetail.vue
... ... @@ -159,6 +159,9 @@ export default {
159 159 duration: 0,
160 160 forbidClick: true,
161 161 });
  162 +
  163 + this.addReadNum(this.courseId)
  164 +
162 165 this.mgop({
163 166 api: 'mgop.sz.hswsy.GetCourseDetail', // 必须
164 167 host: 'https://mapi.zjzwfw.gov.cn/',
... ... @@ -304,6 +307,21 @@ export default {
304 307 backHome () {
305 308 this.$router.push({ name: "ServiceKQ" });
306 309 },
  310 + //添加浏览量
  311 + addReadNum(courseId) {
  312 + this.yxAxios
  313 + .post(`${this.kqUrl}/visitRecord/setCourseVisit`, {
  314 + courseId: courseId,
  315 + userId: JSON.parse(localStorage.getItem('userInfo')).userId
  316 + })
  317 + .then((res) => {
  318 + if (res.data.success) {
  319 + console.log("阅读量成功");
  320 + } else {
  321 + console.log("阅读量失败");
  322 + }
  323 + });
  324 + }
307 325 },
308 326 components: {
309 327 AbroadDes,
... ...
src/views/Service/ServiceKQ.vue
... ... @@ -52,6 +52,8 @@ export default {
52 52 console.log('非浙里办渠道访问,显示测试用户数据')
53 53 this.centerNo = '2021111017103639979048000010279'
54 54 localStorage.setItem('centerNo', '2021111017103639979048000010279')
  55 + let userInfo = JSON.stringify({'userId': 10})
  56 + localStorage.setItem('userInfo', userInfo)
55 57 this.getUserInfo()
56 58 }
57 59 }
... ...
src/views/Yanxue/achievementsOne.vue
... ... @@ -58,19 +58,30 @@ export default {
58 58 this.$router.push({ name: "chooseSchoolOne" });
59 59 },
60 60 getData() {
  61 + let schoolId = this.$route.query.schoolId?this.$route.query.schoolId: ''
  62 +
61 63 this.yxAxios
62   - .post(`${this.dataUrl}/sys/yx/consultList`, {
63   - page: 1,
64   - pageSize: 999,
65   - schoolId: this.$route.query.schoolId*1
66   - })
  64 + .get(`${this.kqUrl}/schoolConsult/consultList?pageNum=1&pageSize=999&schoolId=`+schoolId)
67 65 .then((res) => {
68   - if (res.data.success) {
  66 + if (res.data.code == 200) {
69 67 this.newsList = res.data.data.list;
70 68 } else {
71 69 this.$message.warning(res.data.message);
72 70 }
73 71 });
  72 + // this.yxAxios
  73 + // .post(`${this.dataUrl}/sys/yx/consultList`, {
  74 + // page: 1,
  75 + // pageSize: 999,
  76 + // schoolId: this.$route.query.schoolId*1
  77 + // })
  78 + // .then((res) => {
  79 + // if (res.data.success) {
  80 + // this.newsList = res.data.data.list;
  81 + // } else {
  82 + // this.$message.warning(res.data.message);
  83 + // }
  84 + // });
74 85 },
75 86 },
76 87 mounted() {
... ...
src/views/Yanxue/chooseSchoolOne.vue
... ... @@ -13,7 +13,7 @@
13 13 :key="i"
14 14 @click="toActive(v)"
15 15 >
16   - {{ v.schoolName }}
  16 + {{ v.name }}
17 17 </div>
18 18 </div>
19 19 </div>
... ... @@ -37,25 +37,35 @@ export default {
37 37 toActive(v) {
38 38 this.$router.push({
39 39 name: "achievementsOne",
40   - query: { schoolId: v.id },
  40 + query: { schoolId: v.num },
41 41 });
42 42 },
43 43 //切换
44 44 tabsChange() {},
45 45 getList() {
46 46 this.yxAxios
47   - .post(`${this.dataUrl}/sys/yx/schoolList`, {
48   - page: 1,
49   - pageSize: 999,
50   - schoolType: this.tabsName +1
51   - })
  47 + .get(`${this.kqUrl}/schoolConsult/schoolList?schoolType=`+ (this.tabsName +1))
52 48 .then((res) => {
53   - if (res.data.success) {
54   - this.schoolList = res.data.data.list;
  49 + if (res.data.code == 200) {
  50 + this.schoolList = res.data.data;
  51 + console.log(this.schoolList)
55 52 } else {
56 53 this.$message.warning(res.data.message);
57 54 }
58 55 });
  56 + // this.yxAxios
  57 + // .post(`${this.dataUrl}/sys/yx/schoolList`, {
  58 + // page: 1,
  59 + // pageSize: 999,
  60 + // schoolType: this.tabsName +1
  61 + // })
  62 + // .then((res) => {
  63 + // if (res.data.success) {
  64 + // this.schoolList = res.data.data.list;
  65 + // } else {
  66 + // this.$message.warning(res.data.message);
  67 + // }
  68 + // });
59 69 },
60 70 },
61 71 mounted() {
... ...
src/views/Yanxue/pageDetails.vue
... ... @@ -45,11 +45,9 @@ export default {
45 45 //获取数据
46 46 getTable() {
47 47 this.yxAxios
48   - .post(`${this.dataUrl}/sys/yx/getConsultDetail`, {
49   - id: this.$route.query.dataId,
50   - })
  48 + .get(`${this.kqUrl}/schoolConsult/consultDetails?consultId=`+this.$route.query.dataId)
51 49 .then((res) => {
52   - if (res.data.success) {
  50 + if (res.data.code == 200) {
53 51 this.imgUrl = res.data.data.imgUrl;
54 52 if (!res.data.data.background) {
55 53 this.background = res.data.data.imgUrl;
... ... @@ -63,6 +61,25 @@ export default {
63 61 this.$message.warning(res.data.message);
64 62 }
65 63 });
  64 + // this.yxAxios
  65 + // .post(`${this.dataUrl}/sys/yx/getConsultDetail`, {
  66 + // id: this.$route.query.dataId,
  67 + // })
  68 + // .then((res) => {
  69 + // if (res.data.success) {
  70 + // this.imgUrl = res.data.data.imgUrl;
  71 + // if (!res.data.data.background) {
  72 + // this.background = res.data.data.imgUrl;
  73 + // } else {
  74 + // this.background = res.data.data.background;
  75 + // }
  76 + // let arr = JSON.parse(res.data.data.modelList);
  77 + // this.modelList = arr;
  78 + // // this.showFrame();
  79 + // } else {
  80 + // this.$message.warning(res.data.message);
  81 + // }
  82 + // });
66 83 },
67 84 //打开图片
68 85 openImg(x, y, v) {
... ... @@ -76,8 +93,9 @@ export default {
76 93 //添加浏览量
77 94 addReadNum() {
78 95 this.yxAxios
79   - .post(`${this.dataUrl}/sys/yx/updateRead`, {
80   - id: this.$route.query.dataId,
  96 + .post(`${this.kqUrl}/visitRecord/setConsultVisit`, {
  97 + consultId: this.$route.query.dataId,
  98 + userId: JSON.parse(localStorage.getItem('userInfo')).userId
81 99 })
82 100 .then((res) => {
83 101 if (res.data.success) {
... ... @@ -86,6 +104,17 @@ export default {
86 104 console.log("阅读量失败");
87 105 }
88 106 });
  107 + // this.yxAxios
  108 + // .post(`${this.dataUrl}/sys/yx/updateRead`, {
  109 + // id: this.$route.query.dataId,
  110 + // })
  111 + // .then((res) => {
  112 + // if (res.data.success) {
  113 + // console.log("阅读量成功");
  114 + // } else {
  115 + // console.log("阅读量失败");
  116 + // }
  117 + // });
89 118 },
90 119 //视频
91 120 showFrame() {
... ...
src/views/answerRank/ans_rank.vue 0 → 100644
... ... @@ -0,0 +1,227 @@
  1 +<template>
  2 + <div class="bck">
  3 + <div class="updete">更新时间:2022-8-22</div>
  4 +
  5 + <div class="context">
  6 + <div class="title">
  7 + <div
  8 + :class="active == 'a' ? 'title_check' : 'title_nocheck'"
  9 + @click="chooseTag('a')"
  10 + >
  11 + <div>个人排行榜</div>
  12 + <div class="blue_div"></div>
  13 + </div>
  14 + <div
  15 + :class="active == 'b' ? 'title_check' : 'title_nocheck'"
  16 + @click="chooseTag('b')"
  17 + >
  18 + <div>学校排行榜</div>
  19 + <div class="blue_div"></div>
  20 + </div>
  21 + </div>
  22 +
  23 + <div class="card">
  24 + <div class="card_item">
  25 + <img src="@/assets/rank/tx.png" />
  26 + <div>熊初墨</div>
  27 + </div>
  28 + <div class="card_item_red">
  29 + <div>暂无名次</div>
  30 + <div>20分</div>
  31 + </div>
  32 + </div>
  33 +
  34 + <div class="table_title titleFont">
  35 + <div class="title_1">排名</div>
  36 + <div class="title_2">
  37 + <div class="title_2_2">姓名</div>
  38 + <div class="title_2_3">得分</div>
  39 + </div>
  40 + </div>
  41 +
  42 + <div
  43 + class="table_title conFont"
  44 + v-for="(v, i) in rankList"
  45 + :key="i"
  46 + >
  47 + <div class="title_1" v-if="i == 0">
  48 + <img src="@/assets/rank/1.png" />
  49 + </div>
  50 + <div class="title_1" v-if="i == 1">
  51 + <img src="@/assets/rank/2.png" />
  52 + </div>
  53 + <div class="title_1" v-if="i == 2">
  54 + <img src="@/assets/rank/3.png" />
  55 + </div>
  56 + <div class="title_1" v-if="i > 2">{{ i + 1 }}</div>
  57 + <div class="title_2">
  58 + <div class="title_2_2">柯桥中学</div>
  59 + <div class="title_2_3">120</div>
  60 + </div>
  61 + </div>
  62 + </div>
  63 + </div>
  64 +</template>
  65 +
  66 +<script>
  67 +import Tabbar4 from "@/component/Tabbar4";
  68 +export default {
  69 + components: { Tabbar4 },
  70 + data() {
  71 + return {
  72 + active: "a",
  73 + rankList: [{}, {}, {}, {}],
  74 + };
  75 + },
  76 + methods: {
  77 + chooseTag(val) {
  78 + this.active = val;
  79 + },
  80 + },
  81 +};
  82 +</script>
  83 +
  84 +<style lang="scss" scoped>
  85 +.bck {
  86 + position: absolute;
  87 + width: 100vw;
  88 + min-height: 100vh;
  89 + background-image: url("../../assets/rank/red_rank.png");
  90 + -moz-background-size: 100% 100%;
  91 + background-size: 100% 100%;
  92 +
  93 + .updete {
  94 + position: absolute;
  95 + top: 15vh;
  96 + left: 6vw;
  97 + font-size: 4.2vw;
  98 + color: #fff;
  99 + opacity: 0.8;
  100 + }
  101 +
  102 + .context {
  103 + width: 94vw;
  104 + min-height: 1100px;
  105 + background-color: #fff;
  106 + margin-top: 310px;
  107 + margin-left: 3vw;
  108 + margin-bottom: 50px;
  109 + border-radius: 80px;
  110 + padding: 2vw 5vw;
  111 + box-sizing: border-box;
  112 +
  113 + .title {
  114 + width: 90%;
  115 + height: 100px;
  116 + margin-top: 40px;
  117 + display: flex;
  118 + align-items: center;
  119 +
  120 + .title_check {
  121 + font-size: 5vw;
  122 + color: #333333;
  123 + margin: 0 3vw;
  124 + font-weight: 800;
  125 +
  126 + .blue_div {
  127 + width: 50px;
  128 + height: 15px;
  129 + border-radius: 10px;
  130 + margin-left: 10vw;
  131 + margin-top: 20px;
  132 + background-color: #0b91f3;
  133 + }
  134 + }
  135 + .title_nocheck {
  136 + font-size: 4.2vw;
  137 + color: #999999;
  138 + margin: 0 3vw;
  139 +
  140 + .blue_div {
  141 + width: 50px;
  142 + height: 15px;
  143 + border-radius: 10px;
  144 + margin-left: 10vw;
  145 + margin-top: 20px;
  146 + background-color: #fff;
  147 + }
  148 + }
  149 + }
  150 +
  151 + .card {
  152 + width: 100%;
  153 + height: 170px;
  154 + margin-top: 20px;
  155 + box-shadow: 1px 1px 4px rgb(197, 197, 197);
  156 + padding: 3vw;
  157 + box-sizing: border-box;
  158 + display: flex;
  159 + justify-content: space-between;
  160 +
  161 + .card_item {
  162 + width: 50%;
  163 + font-size: 4.6vw;
  164 + font-weight: 700;
  165 + color: #333333;
  166 + display: flex;
  167 + align-items: center;
  168 + padding-left: 10px;
  169 + box-sizing: border-box;
  170 +
  171 + img {
  172 + width: 90px;
  173 + height: 90px;
  174 + margin-right: 17px;
  175 + }
  176 + }
  177 + .card_item_red {
  178 + width: 50%;
  179 + font-size: 4vw;
  180 + color: #fd4649;
  181 + display: flex;
  182 + align-items: center;
  183 + justify-content: space-around;
  184 + }
  185 + }
  186 +
  187 + .table_title {
  188 + width: 100%;
  189 + height: 100px;
  190 + margin-top: 25px;
  191 + padding: 20px 3vw 3vw 0;
  192 + box-sizing: border-box;
  193 + display: flex;
  194 + justify-content: space-between;
  195 + align-items: center;
  196 +
  197 + .title_1 {
  198 + width: 15%;
  199 + text-align: center;
  200 +
  201 + img {
  202 + width: 55px;
  203 + height: 70px;
  204 + }
  205 + }
  206 + .title_2 {
  207 + width: 70%;
  208 + display: flex;
  209 + justify-content: space-between;
  210 +
  211 + .title_2_3 {
  212 + width: 10vw;
  213 + text-align: left;
  214 + }
  215 + }
  216 + }
  217 + .titleFont {
  218 + font-size: 4.5vw;
  219 + color: #999999;
  220 + }
  221 + .conFont {
  222 + font-size: 4.45vw;
  223 + color: #333333;
  224 + }
  225 + }
  226 +}
  227 +</style>
0 228 \ No newline at end of file
... ...
src/views/answerRank/brush_questions.vue 0 → 100644
... ... @@ -0,0 +1,111 @@
  1 +<template>
  2 + <div>
  3 + <div class="card">
  4 + <div class="card_title">
  5 + <div>星期一</div>
  6 + <span>2021年3月12</span>
  7 + </div>
  8 +
  9 + <div class="card_con">
  10 + <div class="card_L"></div>
  11 + <div class="card_R">
  12 + <div class="card_R_text">
  13 + <div class="text_title">革命遗址-青铜级</div>
  14 + <div class="text_grey">用时:20:21</div>
  15 + <div class="text_grey">错误:3题</div>
  16 + </div>
  17 + <div class="card_R_btn">
  18 + <div class="btn">查看</div>
  19 + </div>
  20 + </div>
  21 + </div>
  22 + </div>
  23 + </div>
  24 +</template>
  25 +
  26 +<script>
  27 +export default {
  28 + data() {
  29 + return {};
  30 + },
  31 +};
  32 +</script>
  33 +
  34 +<style lang="scss" scoped>
  35 +.card {
  36 + padding: 3vw 5vw;
  37 + box-sizing: border-box;
  38 +
  39 + .card_title {
  40 + display: flex;
  41 + align-items: center;
  42 + color: #333333;
  43 + font-size: 35px;
  44 + font-weight: 700;
  45 + margin: 20px 0;
  46 +
  47 + span {
  48 + color: #999999;
  49 + font-size: 30px;
  50 + margin-left: 30px;
  51 + }
  52 + }
  53 +
  54 + .card_con {
  55 + display: flex;
  56 +
  57 + .card_L {
  58 + width: 5px;
  59 + margin-left: 5vw;
  60 + background-color: #f5f6fa;
  61 + }
  62 + .card_R {
  63 + width: 80%;
  64 + height: 210px;
  65 + margin: 50px 0 50px 10vw;
  66 + background-color: #f6f9fd;
  67 + padding: 30px;
  68 + box-sizing: border-box;
  69 + display: flex;
  70 + justify-content: space-between;
  71 +
  72 + .card_R_text {
  73 + width: 80%;
  74 + display: flex;
  75 + align-content: space-between;
  76 + flex-wrap: wrap;
  77 + margin-left: 10px;
  78 +
  79 + .text_title {
  80 + width: 100%;
  81 + font-size: 30px;
  82 + color: #333333;
  83 + }
  84 + .text_grey {
  85 + width: 100%;
  86 + font-size: 28px;
  87 + color: #999999;
  88 + }
  89 + }
  90 + .card_R_btn {
  91 + width: 20%;
  92 + display: flex;
  93 + align-items: center;
  94 +
  95 + .btn {
  96 + width: 120px;
  97 + height: 60px;
  98 + background-color: #6673ff;
  99 + color: #fff;
  100 + font-size: 28px;
  101 + border-radius: 28px;
  102 + display: flex;
  103 + align-items: center;
  104 + justify-content: center;
  105 + letter-spacing: 2px;
  106 + }
  107 + }
  108 + }
  109 + }
  110 +}
  111 +</style>
0 112 \ No newline at end of file
... ...
src/views/answerRank/rank.vue 0 → 100644
... ... @@ -0,0 +1,170 @@
  1 +<template>
  2 + <div class="bck">
  3 + <div class="context">
  4 + <div class="title">
  5 + <div
  6 + :class="active == 'a' ? 'title_check' : 'title_nocheck'"
  7 + @click="chooseTag('a')"
  8 + >
  9 + <div>研学成果量</div>
  10 + <div class="blue_div"></div>
  11 + </div>
  12 + <div
  13 + :class="active == 'b' ? 'title_check' : 'title_nocheck'"
  14 + @click="chooseTag('b')"
  15 + >
  16 + <div>成果浏览量</div>
  17 + <div class="blue_div"></div>
  18 + </div>
  19 + </div>
  20 +
  21 + <div class="table_title titleFont">
  22 + <div class="title_1">排名</div>
  23 + <div class="title_2">
  24 + <div class="title_2_2">学校名称</div>
  25 + <div class="title_2_3">数量</div>
  26 + </div>
  27 + </div>
  28 +
  29 + <div class="table_title conFont" v-for="(v,i) in rankList" :key="i">
  30 + <div class="title_1" v-if="i == 0">
  31 + <img src="@/assets/rank/1.png" />
  32 + </div>
  33 + <div class="title_1" v-if="i == 1">
  34 + <img src="@/assets/rank/2.png" />
  35 + </div>
  36 + <div class="title_1" v-if="i == 2">
  37 + <img src="@/assets/rank/3.png" />
  38 + </div>
  39 + <div class="title_1" v-if="i > 2">{{i +1}}</div>
  40 + <div class="title_2">
  41 + <div class="title_2_2">柯桥中学</div>
  42 + <div class="title_2_3">120</div>
  43 + </div>
  44 + </div>
  45 + </div>
  46 +
  47 + <tabbar4 active="rank"></tabbar4>
  48 + </div>
  49 +</template>
  50 +
  51 +<script>
  52 +import Tabbar4 from "@/component/Tabbar4";
  53 +export default {
  54 + components: { Tabbar4 },
  55 + data() {
  56 + return {
  57 + active: "a",
  58 + rankList: [
  59 + {},
  60 + {},
  61 + {},
  62 + {},
  63 + ]
  64 + };
  65 + },
  66 + methods: {
  67 + chooseTag(val) {
  68 + this.active = val;
  69 + },
  70 + },
  71 +};
  72 +</script>
  73 +
  74 +<style lang="scss" scoped>
  75 +.bck {
  76 + position: absolute;
  77 + width: 100vw;
  78 + height: 100vh;
  79 + background-image: url("../../assets/rank/blue_rank.png");
  80 + -moz-background-size: 100% 100%;
  81 + background-size: 100% 100%;
  82 +
  83 + .context {
  84 + width: 100vw;
  85 + min-height: 1100px;
  86 + background-color: #fff;
  87 + margin-top: 310px;
  88 + border-radius: 80px;
  89 + padding: 2vw 5vw;
  90 + box-sizing: border-box;
  91 +
  92 + .title {
  93 + width: 90%;
  94 + height: 100px;
  95 + margin-top: 40px;
  96 + display: flex;
  97 + align-items: center;
  98 +
  99 + .title_check {
  100 + font-size: 5vw;
  101 + color: #333333;
  102 + margin: 0 3vw;
  103 + font-weight: 800;
  104 +
  105 + .blue_div {
  106 + width: 50px;
  107 + height: 15px;
  108 + border-radius: 10px;
  109 + margin-left: 10vw;
  110 + margin-top: 20px;
  111 + background-color: #0b91f3;
  112 + }
  113 + }
  114 + .title_nocheck {
  115 + font-size: 4.2vw;
  116 + color: #999999;
  117 + margin: 0 3vw;
  118 +
  119 + .blue_div {
  120 + width: 50px;
  121 + height: 15px;
  122 + border-radius: 10px;
  123 + margin-left: 10vw;
  124 + margin-top: 20px;
  125 + background-color: #fff;
  126 + }
  127 + }
  128 + }
  129 +
  130 + .table_title {
  131 + width: 100%;
  132 + height: 110px;
  133 + margin-top: 25px;
  134 + padding: 20px 3vw 3vw 0;
  135 + box-sizing: border-box;
  136 + display: flex;
  137 + justify-content: space-between;
  138 + align-items: center;
  139 +
  140 + .title_1 {
  141 + width: 15%;
  142 + text-align: center;
  143 +
  144 + img {
  145 + width: 55px;
  146 + height: 70px;
  147 + }
  148 + }
  149 + .title_2 {
  150 + width: 70%;
  151 + display: flex;
  152 + justify-content: space-between;
  153 +
  154 + .title_2_3{
  155 + width: 10vw;
  156 + text-align: left;
  157 + }
  158 + }
  159 + }
  160 + .titleFont {
  161 + font-size: 4.5vw;
  162 + color: #999999;
  163 + }
  164 + .conFont {
  165 + font-size: 4.45vw;
  166 + color: #333333;
  167 + }
  168 + }
  169 +}
  170 +</style>
0 171 \ No newline at end of file
... ...
src/views/answerRank/stars.vue 0 → 100644
... ... @@ -0,0 +1,206 @@
  1 +<template>
  2 + <div class="bck">
  3 + <div class="box">
  4 + <div class="box_L">
  5 + <div class="L_top">
  6 + <div class="pic">
  7 + <img src="@/assets/rank/tx.png" />
  8 + </div>
  9 + <div class="font_box">
  10 + <div class="font_name">熊初墨</div>
  11 + <div class="font_sch">柯桥实验小学元培学院</div>
  12 + </div>
  13 + </div>
  14 + <div class="L_mid">
  15 + <div class="mid_item">
  16 + <div>
  17 + <span class="strong_font">23</span>
  18 + <span>分</span>
  19 + </div>
  20 + <div class="grey_font">已完成题数</div>
  21 + </div>
  22 + <div class="mid_item">
  23 + <div>
  24 + <span class="strong_font">50</span>
  25 + <span>%</span>
  26 + </div>
  27 + <div class="grey_font">正确率</div>
  28 + </div>
  29 + </div>
  30 + <div class="yellowFont">*积分可用于兑换各种福利</div>
  31 + </div>
  32 +
  33 + <div class="box_R">
  34 + <div class="box_R_item">
  35 + <div class="title">
  36 + <div>排行榜</div>
  37 + <span>RANKS</span>
  38 + </div>
  39 + <div class="imgBox">
  40 + <img src="@/assets/rank/jb.png" />
  41 + </div>
  42 + </div>
  43 + <div class="box_R_item">
  44 + <div class="title">
  45 + <div>刷题记录</div>
  46 + <span>RECORD</span>
  47 + </div>
  48 + <div class="imgBox">
  49 + <img src="@/assets/rank/qz.png" />
  50 + </div>
  51 + </div>
  52 + </div>
  53 + </div>
  54 +
  55 + <div class="card">
  56 +
  57 + </div>
  58 + </div>
  59 +</template>
  60 +
  61 +<script>
  62 +export default {
  63 + data() {
  64 + return {};
  65 + },
  66 +};
  67 +</script>
  68 +
  69 +<style lang="scss" scoped>
  70 +.bck {
  71 + position: absolute;
  72 + width: 100vw;
  73 + min-height: 100vh;
  74 + background-image: url("../../assets/rank/red_rank.png");
  75 + -moz-background-size: 100% 100%;
  76 + background-size: 100% 100%;
  77 +
  78 + .box {
  79 + display: flex;
  80 + justify-content: space-between;
  81 + margin: 5vw 3vw;
  82 +
  83 + .box_L {
  84 + width: 45vw;
  85 + height: 350px;
  86 + background-color: #fff;
  87 + border-radius: 30px;
  88 + padding: 3vw 2vw;
  89 + box-sizing: border-box;
  90 + display: flex;
  91 + flex-wrap: wrap;
  92 + align-content: space-between;
  93 +
  94 + .L_top {
  95 + width: 100%;
  96 + display: flex;
  97 + justify-content: space-between;
  98 +
  99 + .pic {
  100 + display: flex;
  101 + align-items: center;
  102 +
  103 + img {
  104 + width: 13vw;
  105 + height: 13vw;
  106 + }
  107 + }
  108 + .font_box {
  109 + width: 25vw;
  110 + display: flex;
  111 + align-content: space-between;
  112 + flex-wrap: wrap;
  113 +
  114 + .font_name {
  115 + font-size: 30px;
  116 + color: #333333;
  117 + }
  118 + .font_sch {
  119 + font-size: 27px;
  120 + color: #999;
  121 + white-space: nowrap; //文本强制不换行;
  122 + text-overflow: ellipsis; //文本溢出显示省略号;
  123 + overflow: hidden; //溢出的部分隐藏;
  124 + }
  125 + }
  126 + }
  127 +
  128 + .L_mid {
  129 + width: 100%;
  130 + display: flex;
  131 + justify-content: space-between;
  132 +
  133 + .mid_item {
  134 + width: 100%;
  135 + text-align: center;
  136 + font-size: 25px;
  137 +
  138 + .grey_font {
  139 + color:#999;
  140 + font-size: 25px;
  141 + margin-top: 5px;
  142 + }
  143 +
  144 + .strong_font {
  145 + font-size: 50px;
  146 + font-weight: bold;
  147 + }
  148 + }
  149 + }
  150 +
  151 + .yellowFont {
  152 + width: 100%;
  153 + font-size: 24px;
  154 + color: #ff7a1c;
  155 + text-align: center;
  156 + }
  157 + }
  158 + .box_R {
  159 + width: 45vw;
  160 + height: 350px;
  161 + display: flex;
  162 + flex-wrap: wrap;
  163 + align-content: space-between;
  164 +
  165 + .box_R_item {
  166 + width: 100%;
  167 + height: 170px;
  168 + border-radius: 30px;
  169 + display: flex;
  170 + justify-content: space-between;
  171 + padding: 20px 30px;
  172 + box-sizing: border-box;
  173 +
  174 + .title {
  175 + font-size: 30px;
  176 + color: #000000;
  177 +
  178 + span {
  179 + color: #999999;
  180 + font-size: 22px;
  181 + }
  182 + }
  183 +
  184 + .imgBox {
  185 + display: flex;
  186 + align-items: center;
  187 +
  188 + img {
  189 + width: 110px;
  190 + height: 110px;
  191 + }
  192 + }
  193 + }
  194 + }
  195 + }
  196 +
  197 + .card {
  198 + width: 100%;
  199 + min-height: 800px;
  200 + background-color: #fff;
  201 + border-radius: 30px;
  202 + padding: 2vw;
  203 + box-sizing: border-box;
  204 + }
  205 +}
  206 +</style>
0 207 \ No newline at end of file
... ...