JayChou 3 months ago
commit bbeb4d0ffd
  1. 4
      src/Layout/tabbar/index.vue
  2. BIN
      src/assets/images/LOGO2.png
  3. 83
      src/views/professionalListProfile/index.vue

@ -1,5 +1,5 @@
<template> <template>
<div :class="!flog ? 'tabbar' : 'tabbar-active'"> <div :class="!flog&&false ? 'tabbar' : 'tabbar-active'">
<div class="container"> <div class="container">
<div class="logo-box"> <div class="logo-box">
<div class="logo"><img src="../../assets/images/LOGO.png"></div> <div class="logo"><img src="../../assets/images/LOGO.png"></div>
@ -18,7 +18,7 @@
<!-- <div>企业入口</div> <!-- <div>企业入口</div>
<div>教师入口</div> <div>教师入口</div>
<div>学生入口</div> --> <div>学生入口</div> -->
<!-- <div>登录注册入口</div> --> <div>登录注册入口</div>
</div> </div>
</div> </div>
</div> </div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

@ -3,21 +3,61 @@ import { ref } from 'vue';
const paginationData = ref({ const paginationData = ref({
pageNo: 1, pageNo: 1,
pageSize: 7, pageSize: 8,
total: 7 total: 8
}) })
function paginationChange(currentPage: number, pageSize: number) { function paginationChange(currentPage: number, pageSize: number) {
} }
// 使 // 使
const isPraise = ref(true) const dataList = ref([
const isStar = ref(true) {
function handlePraise() { id: '1',
isPraise.value = !isPraise.value isPraise: false,
isStar: false
},
{
id: '2',
isPraise: false,
isStar: false
},
{
id: '3',
isPraise: false,
isStar: false
},
{
id: '4',
isPraise: false,
isStar: false
},
{
id: '5',
isPraise: false,
isStar: false
},
{
id: '6',
isPraise: false,
isStar: false
},
{
id: '7',
isPraise: false,
isStar: false
},
{
id: '8',
isPraise: false,
isStar: false
},
])
function handlePraise(item:any) {
item.isPraise = !item.isPraise
} }
function handleStar() { function handleStar(item:any) {
isStar.value = !isStar.value item.isStar = !item.isStar
} }
</script> </script>
@ -30,15 +70,7 @@ function handleStar() {
<div class="btn"> <div class="btn">
<div class="course"> <div class="course">
<ul class="course_list"> <ul class="course_list">
<li v-if="1" @click="" class="add_course"> <li v-for="item in dataList" :key="item.id">
<div class="plus">
<el-icon class="avatar-uploader-icon">
<Plus />
</el-icon>
</div>
<h2 class="course_name">点击添加课程</h2>
</li>
<li v-for="item in 7" :key="item">
<img title="点击查看课程详情" :src="''" alt="" @click="" /> <img title="点击查看课程详情" :src="''" alt="" @click="" />
<h2 title="点击查看课程基本信息" class="course_name" @click=""> <h2 title="点击查看课程基本信息" class="course_name" @click="">
软件项目管理 软件项目管理
@ -52,21 +84,20 @@ function handleStar() {
</p> </p>
<div class="parent"> <div class="parent">
<div class="div1" @click="handlePraise"> <div class="div1" @click="handlePraise(item)">
<SvgIcon v-if="isPraise" width="12px" height="12px" name="Praise"></SvgIcon> <SvgIcon v-if="!item.isPraise" width="12px" height="12px" name="Praise">
</SvgIcon>
<SvgIcon v-else width="12px" height="12px" name="PraiseFilled" <SvgIcon v-else width="12px" height="12px" name="PraiseFilled"
color="#f7ba2a"></SvgIcon> color="#f7ba2a"></SvgIcon>
</div> </div>
<div class="div2" @click="handleStar"> <div class="div2" @click="handleStar(item)">
<SvgIcon v-if="isStar" width="12px" height="12px" name="Star"></SvgIcon> <SvgIcon v-if="!item.isStar" width="12px" height="12px" name="Star">
</SvgIcon>
<SvgIcon v-else width="12px" height="12px" name="StarFilled" <SvgIcon v-else width="12px" height="12px" name="StarFilled"
color="#f7ba2a"></SvgIcon> color="#f7ba2a"></SvgIcon>
</div> </div>
</div> </div>
<el-icon class="del" @click="">
<Delete />
</el-icon>
<el-button class="object" round plain @click=""> <el-button class="object" round plain @click="">
查看课程详情 查看课程详情
</el-button> </el-button>
@ -77,7 +108,7 @@ function handleStar() {
</div> </div>
</div> </div>
<el-pagination v-model:current-page="paginationData.pageNo" v-model:page-size="paginationData.pageSize" <el-pagination v-model:current-page="paginationData.pageNo" v-model:page-size="paginationData.pageSize"
:page-sizes="[2, 5, 7, 10]" :background="true" layout="jumper,total, sizes, prev, pager, next " :page-sizes="[2, 5, 8, 10]" :background="true" layout="jumper,total, sizes, prev, pager, next "
:total="paginationData.total" @change="paginationChange" :total="paginationData.total" @change="paginationChange"
style="margin-top: 10px; justify-content: center" /> style="margin-top: 10px; justify-content: center" />
@ -93,7 +124,7 @@ function handleStar() {
grid-column-gap: 5px; grid-column-gap: 5px;
grid-row-gap: 0px; grid-row-gap: 0px;
position: absolute; position: absolute;
margin-left: 245px; margin-left: 280px;
margin-top: -80px; margin-top: -80px;
color: #0052ff; color: #0052ff;
cursor: pointer; cursor: pointer;

Loading…
Cancel
Save