parent
1695a4c4d4
commit
6618757af3
12 changed files with 915 additions and 1008 deletions
@ -1,26 +0,0 @@ |
|||||||
<template> |
|
||||||
<view class="per-mask"> |
|
||||||
<view class="mask"></view> |
|
||||||
<view class="texts"> |
|
||||||
<view class="text">权限审核中，可联系下方平台运营加快审核进度</view> |
|
||||||
<image class="qrcode" :src="src" mode="widthFix"></image> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
export default { |
|
||||||
data() { |
|
||||||
return { |
|
||||||
src: uni.getSystemInfoSync().uniPlatform === 'mp-toutiao' ? 'https://occupationlab.com/images/dyQrcode.jpg' : 'https://occupationlab.com/images/customer.png' |
|
||||||
} |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
|
|
||||||
} |
|
||||||
} |
|
||||||
</script> |
|
||||||
|
|
||||||
<style scoped lang="scss"> |
|
||||||
|
|
||||||
</style> |
|
||||||
@ -0,0 +1,60 @@ |
|||||||
|
<template> |
||||||
|
<uni-popup ref="alertDialog"> |
||||||
|
<view class="realname-wrap"> |
||||||
|
<uni-forms> |
||||||
|
<uni-forms-item label="真实姓名" required> |
||||||
|
<uni-easyinput type="text" v-model.trim="realNameForm.userName" placeholder="请输入真实姓名" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="学号"> |
||||||
|
<uni-easyinput type="text" v-model.trim="realNameForm.workNumber" placeholder="请输入学号" /> |
||||||
|
</uni-forms-item> |
||||||
|
</uni-forms> |
||||||
|
<button class="btn" type="primary" @click="realNameSubmit">确认</button> |
||||||
|
</view> |
||||||
|
</uni-popup> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { checkUserNameOrWorkNumber, updateUserNameOrWorkNumber } from '@/apis/modules/user.js' |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
src: uni.getSystemInfoSync().uniPlatform === 'mp-toutiao' ? 'https://occupationlab.com/images/dyQrcode.jpg' : 'https://occupationlab.com/images/customer.png' |
||||||
|
} |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
console.log(3333) |
||||||
|
this.handleRealName() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 提示填写姓名（登录后调用一次） |
||||||
|
async handleRealName () { |
||||||
|
const res = await checkUserNameOrWorkNumber() |
||||||
|
// 如果没有真实姓名，则弹框提示填写 |
||||||
|
if (!res.hasName) this.$refs.alertDialog.open() |
||||||
|
}, |
||||||
|
// 真实姓名提交 |
||||||
|
async realNameSubmit() { |
||||||
|
const form = this.realNameForm |
||||||
|
if (!form.userName) return this.$util.errMsg('请输入真实姓名！') |
||||||
|
await updateUserNameOrWorkNumber({ |
||||||
|
userName: form.userName, |
||||||
|
workNumber: form.workNumber |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped lang="scss"> |
||||||
|
.realname-wrap { |
||||||
|
width: 460rpx; |
||||||
|
padding: 30rpx; |
||||||
|
background-color: #fff; |
||||||
|
border-radius: 20rpx; |
||||||
|
.btn { |
||||||
|
line-height: 2.2; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -1,360 +0,0 @@ |
|||||||
<template> |
|
||||||
<view> |
|
||||||
<view :class="[{'not-auth': !per}]"> |
|
||||||
<view class="filter"> |
|
||||||
<uni-search-bar class="search" radius="30" placeholder="请输入学校名称，商务经理，订单号" v-model="keyword" clearButton="auto" cancelButton="none" /> |
|
||||||
<view :class="['sort', sort]" @click="switchSort"></view> |
|
||||||
<uni-icons class="icon" custom-prefix="iconfont" type="icon-filter" size="22" color="#007eff" @click="popup = true"></uni-icons> |
|
||||||
</view> |
|
||||||
<ul class="tab"> |
|
||||||
<li v-for="(tab, i) in tabs" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li> |
|
||||||
</ul> |
|
||||||
|
|
||||||
<template v-if="list.length"> |
|
||||||
<view class="list"> |
|
||||||
<uni-swipe-action> |
|
||||||
<uni-swipe-action-item |
|
||||||
v-for="item in list" |
|
||||||
:threshold="0" |
|
||||||
:right-options="delOption" |
|
||||||
@click="del(item)" |
|
||||||
> |
|
||||||
<view class="item" @click="toDetail(item)"> |
|
||||||
<view class="c-name">{{ item.orderNumber }}</view> |
|
||||||
<view class="info"> |
|
||||||
<view class="left"> |
|
||||||
<view v-if="curTab" class="line"> |
|
||||||
<text class="name">商务经理：</text> |
|
||||||
<text class="val">{{ item.businessManagerName }}</text> |
|
||||||
</view> |
|
||||||
<view class="line"> |
|
||||||
<text class="name">客户名称：</text> |
|
||||||
<text class="val">{{ item.customerName }}</text> |
|
||||||
</view> |
|
||||||
<view class="line"> |
|
||||||
<text class="name">订单金额：</text> |
|
||||||
<text class="val">{{ item.orderAmount }}元</text> |
|
||||||
</view> |
|
||||||
<view class="line"> |
|
||||||
<text class="name">订单内容：</text> |
|
||||||
<view class="val ell-wrap"> |
|
||||||
<view :class="{ell: !item.toggle}">{{ item.orderContent }}</view> |
|
||||||
<view v-if="item.orderContent && item.orderContent.length > 14" class="toggle" @click.stop="toggle(item)">{{ item.toggle ? '收起' : '展开' }}</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<view class="line"> |
|
||||||
<text class="name">下单日期：</text> |
|
||||||
<text class="val">{{ item.createTime }}</text> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<view :class="['type', 'type' + item.orderStatus]"> |
|
||||||
{{ filterData[0].data.find(e => e.value === item.orderStatus).title }} |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</uni-swipe-action-item> |
|
||||||
</uni-swipe-action> |
|
||||||
</view> |
|
||||||
<uni-load-more :status="status" /> |
|
||||||
</template> |
|
||||||
<empty v-else></empty> |
|
||||||
|
|
||||||
<uni-icons class="plus" type="plus-filled" size="60" color="#007eff" @click="$util.to('/order/orderDetail/orderDetail')"></uni-icons> |
|
||||||
<filter-popup :data="filterData" :form.sync="filterForm" v-model="popup" title="全部筛选" height="1104rpx" @finsh="subFinsh"></filter-popup> |
|
||||||
</view> |
|
||||||
|
|
||||||
<notAuth v-if="!per"></notAuth> |
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import { queryCustomer } from '@/apis/modules/client.js' |
|
||||||
import { list, del } from '@/apis/modules/order.js' |
|
||||||
export default { |
|
||||||
data() { |
|
||||||
return { |
|
||||||
per: true, // 是否有权限 |
|
||||||
popup: false, |
|
||||||
//筛选表单数据 |
|
||||||
filterData: [ |
|
||||||
{ |
|
||||||
children: false,//是否有子项 |
|
||||||
title: "订单状态", |
|
||||||
key: "orderStatus", //键名 接收对象名字 |
|
||||||
keyValue: "value", //获取的值是哪个 |
|
||||||
isRadio: true, //是否单选 否则多选 |
|
||||||
data: [ |
|
||||||
{ |
|
||||||
title: "待发货", |
|
||||||
value: 0 |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: "已完成", |
|
||||||
value: 1 |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: "已取消", |
|
||||||
value: 2 |
|
||||||
}, |
|
||||||
], |
|
||||||
} |
|
||||||
], |
|
||||||
filterForm: {}, |
|
||||||
curTab: 0, |
|
||||||
tabs: [ |
|
||||||
{ |
|
||||||
name: '我的订单', |
|
||||||
id: 0 |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: '团队全部订单', |
|
||||||
id: 1 |
|
||||||
} |
|
||||||
], |
|
||||||
reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据 |
|
||||||
status: 'more', // 上拉加载状态 more|loading|noMore |
|
||||||
searchTimer: null, |
|
||||||
orderStatus: '', |
|
||||||
sort: 'desc', |
|
||||||
keyword: '', |
|
||||||
list: [], |
|
||||||
page: 1, |
|
||||||
pageSize: 10, |
|
||||||
delOption: [{ |
|
||||||
text: '删除', |
|
||||||
style: { |
|
||||||
backgroundColor: '#F56C6C' |
|
||||||
} |
|
||||||
}], |
|
||||||
} |
|
||||||
}, |
|
||||||
watch: { |
|
||||||
keyword () { |
|
||||||
clearTimeout(this.searchTimer) |
|
||||||
this.searchTimer = setTimeout(() => { |
|
||||||
this.initList() |
|
||||||
}, 500) |
|
||||||
} |
|
||||||
}, |
|
||||||
// 下拉刷新 |
|
||||||
onPullDownRefresh() { |
|
||||||
this.initList() |
|
||||||
setTimeout(() => { |
|
||||||
uni.stopPullDownRefresh() |
|
||||||
}, 1500) |
|
||||||
}, |
|
||||||
// 上拉加载 |
|
||||||
onReachBottom() { |
|
||||||
if (this.reachBottom >= 0) { |
|
||||||
this.reachBottom = 1 |
|
||||||
this.status = 'loading' |
|
||||||
this.getList() |
|
||||||
} |
|
||||||
}, |
|
||||||
onShow() { |
|
||||||
this.per = true |
|
||||||
// 清除订单缓存 |
|
||||||
try { |
|
||||||
uni.removeStorageSync('orderForm') |
|
||||||
uni.removeStorageSync('courses') |
|
||||||
} catch (e) {} |
|
||||||
this.initRole() |
|
||||||
this.$uma.trackEvent('order') // 友盟统计 |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
// 初始化权限 |
|
||||||
initRole() { |
|
||||||
const auth = uni.getStorageSync('auth') |
|
||||||
if (!auth.includes('订单')) { |
|
||||||
this.per = false |
|
||||||
this.list = [ |
|
||||||
{ |
|
||||||
businessManagerName: '智信云', |
|
||||||
customerName: '智信云师资培训班', |
|
||||||
orderContent: 'python实训系统', |
|
||||||
createTime: '2023-08-08' |
|
||||||
}, |
|
||||||
{ |
|
||||||
businessManagerName: '智信云智信云智信云', |
|
||||||
customerName: '智信云师资培训班', |
|
||||||
orderContent: 'python实训系统', |
|
||||||
createTime: '2023-08-08' |
|
||||||
}, |
|
||||||
{ |
|
||||||
businessManagerName: '智信云智信云', |
|
||||||
customerName: '智信云师资培训班', |
|
||||||
orderContent: 'python系统', |
|
||||||
createTime: '2023-08-08' |
|
||||||
}, |
|
||||||
{ |
|
||||||
businessManagerName: '智信云', |
|
||||||
customerName: '智信云师资培训班智信云师资培训班', |
|
||||||
orderContent: 'python实训系统,实训系统', |
|
||||||
createTime: '2023-08-08' |
|
||||||
}, |
|
||||||
{ |
|
||||||
businessManagerName: '智信云', |
|
||||||
customerName: '智信云师资培训班', |
|
||||||
orderContent: 'python实训系统', |
|
||||||
createTime: '2023-08-08' |
|
||||||
} |
|
||||||
] |
|
||||||
} |
|
||||||
this.tabs = [] |
|
||||||
auth.includes('订单:我的订单') && this.tabs.push({ |
|
||||||
name: '我的订单', |
|
||||||
id: 0 |
|
||||||
}) |
|
||||||
auth.includes('订单:团队全部订单') && this.tabs.push({ |
|
||||||
name: '团队全部订单', |
|
||||||
id: 1 |
|
||||||
}) |
|
||||||
const len = this.tabs.length |
|
||||||
// 只有一个的话，取第一个，而且不用显示tab |
|
||||||
if (len === 1) { |
|
||||||
this.curTab = this.tabs[0].id |
|
||||||
this.tabs = [] |
|
||||||
} |
|
||||||
this.per && this.initList() |
|
||||||
}, |
|
||||||
getList() { |
|
||||||
const data = { |
|
||||||
businessManagerId: this.$util.getBmId(), |
|
||||||
teamId: uni.getStorageSync('team').id, |
|
||||||
keywords: this.keyword, |
|
||||||
pageNum: this.page, |
|
||||||
pageSize: this.pageSize, |
|
||||||
sort: this.sort, |
|
||||||
orderStatus: this.orderStatus, |
|
||||||
type: this.curTab |
|
||||||
} |
|
||||||
uni.showLoading({ |
|
||||||
title: '加载中' |
|
||||||
}) |
|
||||||
list(data).then(({ data }) => { |
|
||||||
uni.hideLoading() |
|
||||||
// 未加载完所有数据，并且不是筛选，则拼接list，否则直接赋值 |
|
||||||
const list = data.records |
|
||||||
list.map(e => { |
|
||||||
if (e.orderContent) e.toggle = e.orderContent.length < 14 // 超过了14个字才需要显示展开按钮 |
|
||||||
}) |
|
||||||
this.list = this.reachBottom > 0 ? [...this.list, ...list] : list |
|
||||||
this.page++ // 每次获取了数据后page+1 |
|
||||||
const noMore = this.list.length === data.total // 是否加载完所有数据 |
|
||||||
this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore |
|
||||||
this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1 |
|
||||||
}).catch(e => { |
|
||||||
uni.hideLoading() |
|
||||||
}) |
|
||||||
}, |
|
||||||
initList() { |
|
||||||
this.page = 1 |
|
||||||
this.reachBottom = 0 |
|
||||||
this.getList() |
|
||||||
}, |
|
||||||
// 展开 |
|
||||||
toggle(item) { |
|
||||||
item.toggle = !item.toggle |
|
||||||
}, |
|
||||||
// 筛选确定回调 |
|
||||||
subFinsh(val) { |
|
||||||
const { orderStatus } = val |
|
||||||
this.orderStatus = orderStatus.length ? orderStatus[0] : '' |
|
||||||
this.initList() |
|
||||||
}, |
|
||||||
// 排序 |
|
||||||
switchSort() { |
|
||||||
this.sort = this.sort === 'desc' ? 'asc' : 'desc' |
|
||||||
this.initList() |
|
||||||
}, |
|
||||||
// tab切换 |
|
||||||
tabChange(tab) { |
|
||||||
this.curTab = tab.id |
|
||||||
this.initList() |
|
||||||
}, |
|
||||||
// 跳转详情 |
|
||||||
toDetail(item) { |
|
||||||
this.$util.to(`/order/orderDetail/orderDetail?orderId=${item.orderId}&show=1`) |
|
||||||
}, |
|
||||||
// 删除 |
|
||||||
del(e) { |
|
||||||
const that = this |
|
||||||
uni.showModal({ |
|
||||||
title: '提示', |
|
||||||
content: '确定要删除吗？', |
|
||||||
success(res) { |
|
||||||
if (res.confirm) { |
|
||||||
del({ |
|
||||||
ids: [e.orderId] |
|
||||||
}).then(res => { |
|
||||||
that.$util.sucMsg('删除成功') |
|
||||||
that.initList() |
|
||||||
}).catch(res => {}) |
|
||||||
} |
|
||||||
} |
|
||||||
}) |
|
||||||
}, |
|
||||||
} |
|
||||||
} |
|
||||||
</script> |
|
||||||
|
|
||||||
<style scoped lang="scss"> |
|
||||||
.list { |
|
||||||
margin-top: 20rpx; |
|
||||||
background-color: #fff; |
|
||||||
.item { |
|
||||||
width: 100%; |
|
||||||
padding: 20rpx 40rpx; |
|
||||||
border-bottom: 1px solid #f1f1f1; |
|
||||||
box-sizing: border-box; |
|
||||||
} |
|
||||||
.c-name { |
|
||||||
font-size: 30rpx; |
|
||||||
color: #333; |
|
||||||
} |
|
||||||
.info { |
|
||||||
display: flex; |
|
||||||
justify-content: space-between; |
|
||||||
align-items: center; |
|
||||||
margin-top: 10rpx; |
|
||||||
} |
|
||||||
.left { |
|
||||||
max-width: 70%; |
|
||||||
} |
|
||||||
.line { |
|
||||||
display: flex; |
|
||||||
padding: 10rpx 0; |
|
||||||
} |
|
||||||
.name { |
|
||||||
margin-right: 10rpx; |
|
||||||
white-space: nowrap; |
|
||||||
font-size: 28rpx; |
|
||||||
color: #999; |
|
||||||
} |
|
||||||
.val { |
|
||||||
max-width: 88%; |
|
||||||
font-size: 28rpx; |
|
||||||
color: #333; |
|
||||||
} |
|
||||||
.ell { |
|
||||||
white-space: nowrap; |
|
||||||
text-overflow: ellipsis; |
|
||||||
overflow: hidden; |
|
||||||
} |
|
||||||
.toggle { |
|
||||||
margin-top: 10rpx; |
|
||||||
white-space: nowrap; |
|
||||||
font-size: 24rpx; |
|
||||||
color: #0e92ef; |
|
||||||
} |
|
||||||
.type { |
|
||||||
margin-left: 20rpx; |
|
||||||
font-size: 28rpx; |
|
||||||
color: #ff7b2d; |
|
||||||
white-space: nowrap; |
|
||||||
} |
|
||||||
.type1 { |
|
||||||
color: #bdbdbd; |
|
||||||
} |
|
||||||
} |
|
||||||
</style> |
|
||||||
@ -1,285 +1,546 @@ |
|||||||
<template> |
<template> |
||||||
<view> |
<view class="page"> |
||||||
<view class="search-wrap"> |
<view class="block"> |
||||||
<image class="bg" src="@/static/image/info.png"></image> |
<view class="p-title"> |
||||||
<view class="info"> |
<image class="icon" src="https://eduvessel.com/images/occupationlab/user.svg" mode="widthFix"></image> 账号信息 |
||||||
<uni-search-bar class="search" radius="30" placeholder="请输入文章名称，标签" v-model="keyword" clearButton="auto" cancelButton="none" bgColor="#fff" /> |
</view> |
||||||
|
<view class="form-list"> |
||||||
|
<view class="line"> |
||||||
|
<view class="name"> |
||||||
|
<button class="avatar-btn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"> |
||||||
|
<image class="avatar" :src="hrUserInfo.avatar" mode=""></image> |
||||||
|
</button> |
||||||
|
</view> |
||||||
|
<view class="val">修改头像</view> |
||||||
|
<uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">学号</view> |
||||||
|
<view class="val">{{ userAccount.workNumber }}</view> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">手机号</view> |
||||||
|
<view class="val">{{ userAccount.phone }}</view> |
||||||
|
<view class="action" @click="$util.to('/user/phone/phone')">更换</view> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">邮箱</view> |
||||||
|
<view class="val">{{ hrUserInfo.email }}</view> |
||||||
|
<view class="action" @click="$util.to('/user/email/email')">{{ hrUserInfo.email ? '更换' : '添加'}}</view> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">密码</view> |
||||||
|
<view class="val">xxxxxx</view> |
||||||
|
<view class="action" @click="$util.to('/user/password/password')">更换</view> |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
|
|
||||||
<view class="type"> |
<view class="block"> |
||||||
<view v-for="(item, i) in classifications.slice(0, 4)" :key="i" :class="['item', {active: active == item.id}]" @click="classificationClick(item, 1)">{{ item.classificationName }}</view> |
<view class="p-title"> |
||||||
<uni-icons class="icon" custom-prefix="iconfont" type="icon-filter" size="22" color="#007eff" @click="typeVisible = true"></uni-icons> |
<image class="icon" src="https://eduvessel.com/images/occupationlab/basic.svg" mode="widthFix"></image> 基本信息 |
||||||
|
</view> |
||||||
|
<view class="form-list"> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">姓名</view> |
||||||
|
<input type="text" placeholder="请输入姓名" v-model="hrUserInfo.userName" /> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">性别</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择性别" popup-title="请选择性别" preload :clear-icon="false" :localdata="sex" v-model="hrUserInfo.sex"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">出生日期</view> |
||||||
|
<uni-datetime-picker class="picker-date" type="date" placeholder="请选择出生日期" :clear-icon="false" v-model="hrUserInfo.dateBirth" /> |
||||||
|
<!-- <uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons> --> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">身份证号</view> |
||||||
|
<input type="text" placeholder="请输入身份证号" v-model="hrUserInfo.idNumber" /> |
||||||
|
<uni-icons class="arrow" type="right" size="18" color="#ababab"></uni-icons> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">所在国家</view> |
||||||
|
<view class="val">中国</view> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">所在省份</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择省份" popup-title="请选择省份" preload :clear-icon="false" :localdata="provinces" v-model="hrUserInfo.provinceId" @change="getCity"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">所在城市</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择城市" popup-title="请选择城市" preload :clear-icon="false" :localdata="cities" v-model="hrUserInfo.cityId"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">受教育程度</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择受教育程度" popup-title="请选择受教育程度" preload :clear-icon="false" :localdata="educationDegreeList" v-model="hrUserInfo.educationDegree"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">当前所在学校</view> |
||||||
|
<view class="val">{{ hrUserInfo.schoolName }}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
|
|
||||||
<template v-if="list.length"> |
<view class="block"> |
||||||
<view class="list"> |
<view class="arch-title"> |
||||||
<view v-for="(item, i) in list" :key="i" class="item" @click="toDetail(item)"> |
<view class="p-title"> |
||||||
<view class="title ell">{{ item.title }}</view> |
<image class="icon" src="https://eduvessel.com/images/occupationlab/files.svg" mode="widthFix"></image> 个人档案 |
||||||
<view class="texts"> |
</view> |
||||||
<view class="left"> |
<uni-icons class="plus" type="plus" size="20" color="#007EFF" @click="addArch"></uni-icons> |
||||||
<view class="des">{{ item.mainBody }}</view> |
</view> |
||||||
<view class="metas"> |
|
||||||
<text class="date">{{ item.releaseTime }}</text> |
<view class="archives"> |
||||||
<view v-if="item.labelName" class="labels"> |
<view v-for="(archive, i) in archivesList" :key="i" class="form-list archive" v-show="!i || showArch"> |
||||||
<view v-for="(label, j) in item.labelName" :key="j" class="label">{{ label }}</view> |
<view class="line"> |
||||||
</view> |
<view class="name">职业</view> |
||||||
</view> |
<uni-data-picker class="picker-input" placeholder="请选择职业" popup-title="请选择职业" preload :clear-icon="false" :localdata="occupationList" v-model="archive.personalCareerId"></uni-data-picker> |
||||||
</view> |
</view> |
||||||
<image class="pic" :src="item.bannerImg"></image> |
<view class="line"> |
||||||
|
<view class="name">所在国家</view> |
||||||
|
<view class="val">中国</view> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">学校名称</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择学校" popup-title="请选择学校" preload :clear-icon="false" :localdata="schoolList" v-model="archive.schoolId"></uni-data-picker> |
||||||
</view> |
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">专业学科</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择专业学科" popup-title="请选择专业学科" preload :clear-icon="false" :localdata="subjectList" v-model="archive.disciplineId" @change="e => getItemProfessionalClass(e, i)"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">专业类</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择专业类" popup-title="请选择专业类" preload :clear-icon="false" :localdata="archive.ProfessionalClassList" v-model="archive.professionalClassId" @change="e => getItemProfessional(e, i)"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<view class="line"> |
||||||
|
<view class="name">专业</view> |
||||||
|
<uni-data-picker class="picker-input" placeholder="请选择专业" popup-title="请选择专业" preload :clear-icon="false" :localdata="archive.ProfessionalList" v-model="archive.professionalId"></uni-data-picker> |
||||||
|
</view> |
||||||
|
<uni-icons class="del" type="trash" size="20" color="#ccc" @click="delArchive(i)"></uni-icons> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<uni-load-more :status="status" /> |
<view class="fold" v-if="archivesList.length > 1"> |
||||||
</template> |
<view :class="{ active: showArch }" @click="showArch = !showArch"> |
||||||
<empty v-else></empty> |
展开更多 |
||||||
|
<uni-icons class="plus" type="bottom" size="20" color="#007EFF"></uni-icons> |
||||||
<view :class="['type-popup', {active: typeVisible}]"> |
</view> |
||||||
<uni-icons class="close" type="closeempty" size="20" color="#757575" @click="closeType"></uni-icons> |
|
||||||
<view class="title">所属分类</view> |
|
||||||
<view class="types"> |
|
||||||
<view v-for="(item, i) in classifications" :key="i" :class="['item', {active: active == item.id}]" @click="classificationClick(item)">{{ item.classificationName }}</view> |
|
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
|
|
||||||
|
<view class="btn-wrap"> |
||||||
|
<view class="btn" @click="submit">保存</view> |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import { partnerOperatingList, queryClassificationByType } from '@/apis/modules/article.js' |
import OSS from '@/libs/Oss/upload' |
||||||
|
import { queryProvince, queryCity, querySchool, queryUserInfoDetails, updateAvatars, courseDiscipline, courseProfessionalClass, courseProfessional, updatePersonCenter, deleteProfile } from '@/apis/modules/user.js' |
||||||
export default { |
export default { |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
classifications: [], |
hrUserInfo: { |
||||||
active: '', |
name:'', |
||||||
typeVisible: false, |
workNumber:'', |
||||||
reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据 |
password:"", |
||||||
status: 'more', // 上拉加载状态 more|loading|noMore |
phone:'', |
||||||
searchTimer: null, |
email:'', |
||||||
articleNameSort: '', |
provinceName:'', |
||||||
keyword: '', |
cityName:'', |
||||||
list: [], |
schoolName:'', |
||||||
page: 1, |
professionalName:'', |
||||||
pageSize: 10, |
experimentName:'', |
||||||
} |
sex: 1, |
||||||
}, |
dateBirth: '', |
||||||
watch: { |
educationDegree: '' |
||||||
keyword () { |
}, |
||||||
this.active = '' |
userAccount: {}, |
||||||
clearTimeout(this.searchTimer) |
sex: [{ |
||||||
this.searchTimer = setTimeout(() => { |
text: '男', |
||||||
this.initList() |
value: 1 |
||||||
}, 500) |
}, { |
||||||
} |
text: '女', |
||||||
}, |
value: 2 |
||||||
// 下拉刷新 |
}], |
||||||
onPullDownRefresh() { |
occupationList: [{ |
||||||
this.initList() |
value: 1, |
||||||
setTimeout(() => { |
text: '学生' |
||||||
uni.stopPullDownRefresh() |
},{ |
||||||
}, 1500) |
value: 2, |
||||||
}, |
text: '老师' |
||||||
// 上拉加载 |
}], |
||||||
onReachBottom() { |
provinces:[], |
||||||
if (this.reachBottom >= 0) { |
cities: [], |
||||||
this.reachBottom = 1 |
educationDegreeList: [ |
||||||
this.status = 'loading' |
{ |
||||||
this.getList() |
text: '专科', |
||||||
|
value: 1 |
||||||
|
}, |
||||||
|
{ |
||||||
|
text: '本科', |
||||||
|
value: 2 |
||||||
|
}, |
||||||
|
{ |
||||||
|
text: '硕士', |
||||||
|
value: 3 |
||||||
|
}, |
||||||
|
{ |
||||||
|
text: '博士', |
||||||
|
value: 4 |
||||||
|
}, |
||||||
|
{ |
||||||
|
text: '其他', |
||||||
|
value: 5 |
||||||
|
} |
||||||
|
], |
||||||
|
subjectList: [], //专业学科 |
||||||
|
schoolList: [], |
||||||
|
showArch: false, |
||||||
|
archivesList: [], |
||||||
|
archivesForm: { |
||||||
|
personalCareerId: '', |
||||||
|
schoolId: '', |
||||||
|
schoolName: '', |
||||||
|
ProfessionalClassList: [], |
||||||
|
professionalClassId: '', |
||||||
|
professionalClassName: '', |
||||||
|
ProfessionalList: [], |
||||||
|
disciplineId: '', |
||||||
|
disciplineName: '', |
||||||
|
professionalId: '', |
||||||
|
professionalName: '', |
||||||
|
}, |
||||||
} |
} |
||||||
}, |
}, |
||||||
onShow() { |
onShow() { |
||||||
this.keyword = '' |
this.getInfo() |
||||||
this.active = '' |
this.getProvince() |
||||||
this.typeVisible = false |
this.getSchool() |
||||||
this.initRole() |
this.getSubject() |
||||||
}, |
}, |
||||||
methods: { |
methods: { |
||||||
// 初始化权限 |
// 获取个人信息 |
||||||
initRole() { |
async getInfo() { |
||||||
if (!uni.getStorageSync('auth').includes('资讯')) { |
const { result } = await queryUserInfoDetails() |
||||||
this.per = false |
const { hrUserInfo: u, personalFileList: p } = result |
||||||
|
u.avatar = u.userAvatars || 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png' |
||||||
|
this.hrUserInfo = u |
||||||
|
this.userAccount = result.userAccount |
||||||
|
|
||||||
|
u.provinceId && this.getCity() |
||||||
|
|
||||||
|
if (p.length) { |
||||||
|
p.forEach(async (e, k) => { |
||||||
|
e.ProfessionalClassList = [] |
||||||
|
e.ProfessionalList = [] |
||||||
|
this.$set(e, 'subjectList', this.subjectList) |
||||||
|
this.$set(e, 'disciplineId', e.disciplineId ? e.disciplineId : '') |
||||||
|
this.$set(e, 'disciplineName', e.disciplineName ? e.disciplineName : '') |
||||||
|
this.$set(e, 'professionalClassId', e.professionalClassId ? e.professionalClassId : '') |
||||||
|
this.$set(e, 'professionalClassName', e.professionalClassName ? e.professionalClassName : '') |
||||||
|
this.$set(e, 'professionalId', e.professionalId ? e.professionalId : '') |
||||||
|
this.$set(e, 'professionalName', e.professionalName ? e.professionalName : '') |
||||||
|
this.$set(e, 'schoolId', e.schoolId ? e.schoolId : '') |
||||||
|
this.$set(e, 'schoolName', e.schoolName ? e.schoolName : '') |
||||||
|
|
||||||
|
if (e.disciplineId) { |
||||||
|
const { list } = await courseProfessionalClass({ disciplineId: e.disciplineId }) |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.professionalClassId |
||||||
|
e.text = e.professionalClassName |
||||||
|
}) |
||||||
|
this.$set(e, 'ProfessionalClassList', list) |
||||||
|
} |
||||||
|
if (e.professionalClassId) { |
||||||
|
const { list } = await courseProfessional({ professionalClassId: e.professionalClassId }) |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.professionalId |
||||||
|
e.text = e.professionalName |
||||||
|
}) |
||||||
|
this.$set(e, 'ProfessionalList', list) |
||||||
|
} |
||||||
|
}) |
||||||
|
this.archivesList = p |
||||||
|
} else { |
||||||
|
this.concatArch() |
||||||
} |
} |
||||||
this.initList() |
|
||||||
this.getClassification() |
|
||||||
}, |
}, |
||||||
getList() { |
|
||||||
const data = { |
// 获取省份 |
||||||
keyWord: this.keyword, |
async getProvince() { |
||||||
pageNum: this.page, |
const { list } = await queryProvince() |
||||||
pageSize: this.pageSize, |
list.forEach(e => { |
||||||
querySource: 4, |
e.value = e.provinceId |
||||||
typeId: 2, |
e.text = e.provinceName |
||||||
articleNameSort: this.articleNameSort, |
|
||||||
classificationId: this.active |
|
||||||
} |
|
||||||
uni.showLoading({ |
|
||||||
title: '加载中' |
|
||||||
}) |
}) |
||||||
partnerOperatingList(data).then(({ page, total }) => { |
this.provinces = list |
||||||
uni.hideLoading() |
}, |
||||||
// 未加载完所有数据，并且不是筛选，则拼接list，否则直接赋值 |
// 获取城市 |
||||||
const list = page |
async getCity(val) { |
||||||
|
if (this.hrUserInfo.provinceId) { |
||||||
|
const { list } = await queryCity({ |
||||||
|
provinceId: this.hrUserInfo.provinceId |
||||||
|
}) |
||||||
list.forEach(e => { |
list.forEach(e => { |
||||||
if (e.labelName) e.labelName = e.labelName.split(',').slice(0, 2) // 只展示前两个标签 |
e.value = e.cityId |
||||||
e.mainBody = (e.summary || e.mainBody).replace(/(<[^>]+>)|(( )+)/g , '') |
e.text = e.cityName |
||||||
}) |
}) |
||||||
this.list = this.reachBottom > 0 ? [...this.list, ...list] : list |
this.cities = list |
||||||
this.page++ // 每次获取了数据后page+1 |
} else { |
||||||
const noMore = this.list.length === total // 是否加载完所有数据 |
this.cities = [] |
||||||
this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore |
} |
||||||
this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1 |
if (val) this.hrUserInfo.cityId = '' |
||||||
}).catch(e => { |
}, |
||||||
uni.hideLoading() |
// 获取学校 |
||||||
|
async getSchool(){ |
||||||
|
const { list } = await querySchool() |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.schoolId |
||||||
|
e.text = e.schoolName |
||||||
|
}) |
||||||
|
this.schoolList = list |
||||||
|
}, |
||||||
|
// 上传头像回调 |
||||||
|
onChooseAvatar(e) { |
||||||
|
OSS(e.detail.avatarUrl, ({ url }) => { |
||||||
|
updateAvatars(url).then(res => { |
||||||
|
this.getInfo() |
||||||
|
}).catch(e => {}) |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
initList() { |
|
||||||
this.page = 1 |
|
||||||
this.reachBottom = 0 |
foldArch() { |
||||||
this.getList() |
this.showArch = !this.showArch |
||||||
|
}, |
||||||
|
// 获取学科类别 |
||||||
|
async getSubject(){ |
||||||
|
const { list } = await courseDiscipline() |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.disciplineId |
||||||
|
e.text = e.disciplineName |
||||||
|
}) |
||||||
|
this.subjectList = list |
||||||
}, |
}, |
||||||
// 获取所属分类 |
// 清除学科类别 |
||||||
getClassification() { |
clearClass(){ |
||||||
queryClassificationByType(2).then(({ data }) => { |
this.archivesForm.professionalClassId = '', |
||||||
this.classifications = [ |
this.archivesForm.professionalId = '' |
||||||
{ |
}, |
||||||
id: '', |
clearItemClass(index){ |
||||||
classificationName: '不限' |
this.archivesList[index].professionalClassId = '' |
||||||
|
this.archivesList[index].professionalClassName = '' |
||||||
|
this.archivesList[index].professionalId = '' |
||||||
|
this.archivesList[index].professionalName = '' |
||||||
|
}, |
||||||
|
async getItemProfessionalClass(e, index){ |
||||||
|
this.clearItemClass(index) |
||||||
|
if(e.detail.value.length){ |
||||||
|
const id = e.detail.value[0].value |
||||||
|
let obj = {} |
||||||
|
obj = this.subjectList.find(r =>{ |
||||||
|
return r.disciplineId === id |
||||||
|
}); |
||||||
|
const { list } = await courseProfessionalClass({ disciplineId: id }) |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.professionalClassId |
||||||
|
e.text = e.professionalClassName |
||||||
|
}) |
||||||
|
this.archivesList.map(e =>{ |
||||||
|
if(e.disciplineId == id){ |
||||||
|
e.ProfessionalClassList = list |
||||||
|
e.disciplineName = obj.disciplineName |
||||||
} |
} |
||||||
] |
}) |
||||||
this.classifications.push(...data) |
} |
||||||
}).catch(e => {}) |
|
||||||
}, |
}, |
||||||
// 所属分类点击回调 |
// 清除专业类 |
||||||
classificationClick(item, query) { |
clearProfess(){ |
||||||
this.active = item.id |
this.archivesForm.professionalId = '' |
||||||
query && this.initList() |
|
||||||
}, |
}, |
||||||
// 关闭所属分类弹框 |
clearItemProfess(index){ |
||||||
closeType() { |
this.archivesList[index].professionalId = '' |
||||||
this.typeVisible = false |
this.archivesList[index].professionalName = '' |
||||||
this.initList() |
|
||||||
}, |
}, |
||||||
// 展开 |
async getItemProfessional(e, index){ |
||||||
toggle(item) { |
this.clearItemProfess(index) |
||||||
item.toggle = !item.toggle |
if(e.detail.value.length){ |
||||||
|
const id = e.detail.value[0].value |
||||||
|
const { list } = await courseProfessional({ professionalClassId: id }) |
||||||
|
list.forEach(e => { |
||||||
|
e.value = e.professionalId |
||||||
|
e.text = e.professionalName |
||||||
|
}) |
||||||
|
this.archivesList.map(e =>{ |
||||||
|
if(e.professionalClassId == id){ |
||||||
|
let obj = {} |
||||||
|
obj = e.ProfessionalClassList.find(r =>{ |
||||||
|
return r.professionalClassId === id |
||||||
|
}) |
||||||
|
e.ProfessionalList = list |
||||||
|
e.professionalClassName = obj.professionalClassName |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
}, |
}, |
||||||
// 排序 |
getItemStuGrade(item){ |
||||||
switchSort() { |
if(item){ |
||||||
this.articleNameSort = this.articleNameSort === 'desc' ? 'asc' : 'desc' |
this.archivesList.map(e =>{ |
||||||
this.initList() |
if(e.professionalId == item){ |
||||||
|
let obj = {} |
||||||
|
obj = e.ProfessionalList.find(r =>{ |
||||||
|
return r.professionalId === item; |
||||||
|
}) |
||||||
|
e.professionalName = obj.professionalName |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
}, |
||||||
|
concatArch() { |
||||||
|
this.archivesList = this.archivesList.concat({ |
||||||
|
countries: '中国', |
||||||
|
personalCareerId: '', |
||||||
|
schoolId: '', |
||||||
|
schoolName: '', |
||||||
|
subjectList: this.subjectList, |
||||||
|
disciplineId: '', |
||||||
|
disciplineName: '', |
||||||
|
ProfessionalClassList: [], |
||||||
|
professionalClassId: '', |
||||||
|
professionalClassName: '', |
||||||
|
ProfessionalList: [], |
||||||
|
professionalId: '', |
||||||
|
professionalName: '', |
||||||
|
personalFileId: '' |
||||||
|
}) |
||||||
}, |
}, |
||||||
// 跳转详情 |
addArch() { |
||||||
toDetail(item) { |
let isEmpty = false |
||||||
this.$util.to(`/team/article/article?info=1&id=` + item.id) |
this.archivesList.forEach((n,k) => { |
||||||
|
if(!n.personalCareerId) isEmpty = true |
||||||
|
}) |
||||||
|
if(isEmpty) return this.$util.errMsg('请选择职业') |
||||||
|
this.showArch = true |
||||||
|
this.concatArch() |
||||||
|
}, |
||||||
|
delArchive(i) { |
||||||
|
const that = this |
||||||
|
uni.showModal({ |
||||||
|
title: '提示', |
||||||
|
content: '确定要删除吗？', |
||||||
|
success(res) { |
||||||
|
if (res.confirm) { |
||||||
|
const id = that.archivesList[i].personalFileId |
||||||
|
that.archivesList.splice(i, 1) |
||||||
|
id && deleteProfile(id) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
// 保存 |
||||||
|
async submit() { |
||||||
|
const { hrUserInfo: u, userAccount: a } = this |
||||||
|
if (u.idNumber && !/(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)/.test(u.idNumber)) return this.$util.errMsg('请输入正确的身份证号码！') |
||||||
|
let personalFileList = [] |
||||||
|
this.archivesList.forEach((n,k) => { |
||||||
|
n.personalCareerId && personalFileList.push({ |
||||||
|
disciplineId: n.disciplineId, |
||||||
|
disciplineName: n.disciplineName, |
||||||
|
personalCareerId: n.personalCareerId, |
||||||
|
personalFileId: n.personalFileId, |
||||||
|
professionalClassId: n.professionalClassId, |
||||||
|
professionalClassName: n.professionalClassName, |
||||||
|
professionalId: n.professionalId, |
||||||
|
professionalName: n.professionalName, |
||||||
|
provinceId: n.provinceId, |
||||||
|
provinceName: n.provinceName, |
||||||
|
schoolId: n.schoolId, |
||||||
|
schoolName: n.schoolName, |
||||||
|
userId: u.userId |
||||||
|
}) |
||||||
|
}) |
||||||
|
const data = { |
||||||
|
userId: u.userId, |
||||||
|
userAccountList: [{ |
||||||
|
id: a.accountId, |
||||||
|
account: a.account, |
||||||
|
userId: a.userId, |
||||||
|
}], |
||||||
|
hrUserInfo: { |
||||||
|
provinceId: u.provinceId, |
||||||
|
cityId: u.cityId, |
||||||
|
countries: '中国', |
||||||
|
dateBirth: u.dateBirth, |
||||||
|
educationDegree: u.educationDegree, |
||||||
|
idNumber: u.idNumber, |
||||||
|
schoolId: u.schoolId, |
||||||
|
sex: u.sex, |
||||||
|
userId: u.userId, |
||||||
|
userName: u.userName, |
||||||
|
wechatId: u.wechatId |
||||||
|
}, |
||||||
|
personalFileList, |
||||||
|
} |
||||||
|
updatePersonCenter(data) |
||||||
|
this.$util.sucMsg('保存成功') |
||||||
}, |
}, |
||||||
} |
} |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style scoped lang="scss"> |
<style scoped lang="scss"> |
||||||
.search-wrap { |
.page { |
||||||
position: relative; |
padding-bottom: 130rpx; |
||||||
height: 300rpx; |
} |
||||||
padding: 120rpx 10px 0; |
.avatar-btn { |
||||||
.bg { |
display: inline-block; |
||||||
position: absolute; |
padding: 0; |
||||||
top: 0; |
margin: 0 28rpx 0 0; |
||||||
left: 0; |
line-height: 0; |
||||||
width: 100%; |
border: 0 !important; |
||||||
height: 100%; |
background-color: transparent; |
||||||
} |
outline: none; |
||||||
.info { |
border-radius: 50%; |
||||||
position: relative; |
.avatar { |
||||||
margin-top: 160rpx; |
width: 50rpx; |
||||||
} |
height: 50rpx; |
||||||
.text { |
border: 0; |
||||||
margin: 0 10px 10rpx; |
|
||||||
font-size: 50rpx; |
|
||||||
color: #fff; |
|
||||||
} |
} |
||||||
} |
} |
||||||
.type { |
.arch-title { |
||||||
position: relative; |
|
||||||
display: flex; |
display: flex; |
||||||
padding: 30rpx; |
justify-content: space-between; |
||||||
background-color: #fff; |
align-items: center; |
||||||
.item { |
|
||||||
padding: 0 15rpx; |
|
||||||
line-height: 1.6; |
|
||||||
font-size: 28rpx; |
|
||||||
color: #333; |
|
||||||
white-space: nowrap; |
|
||||||
&.active { |
|
||||||
color: #007FFF; |
|
||||||
font-weight: 600; |
|
||||||
} |
|
||||||
} |
|
||||||
.icon { |
|
||||||
position: absolute; |
|
||||||
right: 40rpx; |
|
||||||
width: 40rpx; |
|
||||||
} |
|
||||||
} |
} |
||||||
.list { |
|
||||||
background-color: #fff; |
.archive { |
||||||
.item { |
position: relative; |
||||||
margin-bottom: 10rpx; |
padding: 30rpx; |
||||||
padding: 20rpx 40rpx; |
margin-bottom: 30rpx; |
||||||
border-bottom: 1px solid #f1f1f1; |
border: 1px dashed #d2d2d2; |
||||||
} |
border-radius: 20rpx; |
||||||
.texts { |
|
||||||
display: flex; |
.del { |
||||||
justify-content: space-between; |
position: absolute; |
||||||
align-items: center; |
top: 10rpx; |
||||||
} |
right: 10rpx; |
||||||
.pic { |
} |
||||||
width: 260rpx; |
} |
||||||
height: 180rpx; |
.fold { |
||||||
border-radius: 8px; |
padding-bottom: 20rpx; |
||||||
} |
text-align: center; |
||||||
.left { |
font-size: 24rpx; |
||||||
width: calc(100% - 280rpx); |
color: #006EFF; |
||||||
} |
|
||||||
.title { |
span { |
||||||
margin-bottom: 20rpx; |
cursor: pointer; |
||||||
font-size: 32rpx; |
i { |
||||||
font-weight: 600; |
transition: .5s; |
||||||
color: #333; |
} |
||||||
} |
&.active i { |
||||||
.des { |
transform: rotate(180deg); |
||||||
display: -webkit-box; |
} |
||||||
-webkit-box-orient: vertical; |
} |
||||||
-webkit-line-clamp: 2; |
|
||||||
text-overflow: ellipsis; |
|
||||||
overflow: hidden; |
|
||||||
} |
|
||||||
.metas { |
|
||||||
margin-top: 10rpx; |
|
||||||
display: flex; |
|
||||||
justify-content: space-between; |
|
||||||
align-items: center; |
|
||||||
} |
|
||||||
.date { |
|
||||||
font-size: 24rpx; |
|
||||||
color: #ccc; |
|
||||||
white-space: nowrap; |
|
||||||
} |
|
||||||
.labels { |
|
||||||
display: inline-flex; |
|
||||||
flex-wrap: wrap; |
|
||||||
align-items: center; |
|
||||||
margin-top: 15rpx; |
|
||||||
} |
|
||||||
.label { |
|
||||||
width: 90rpx; |
|
||||||
padding: 2px 6px; |
|
||||||
margin: 0 10rpx 15rpx 0; |
|
||||||
font-size: 24rpx; |
|
||||||
color: #fff; |
|
||||||
text-overflow: ellipsis; |
|
||||||
white-space: nowrap; |
|
||||||
overflow: hidden; |
|
||||||
background-color: #ccc; |
|
||||||
border-radius: 4px; |
|
||||||
} |
|
||||||
} |
} |
||||||
</style> |
</style> |
||||||
|
|||||||
Loading…
Reference in new issue