599 lines
14 KiB
Vue
599 lines
14 KiB
Vue
|
<!--
|
|||
|
|
* @Date: 2025-10-16 15:15:47
|
|||
|
|
* @LastEditors: shirlwang
|
|||
|
|
* @LastEditTime: 2025-10-31 14:56:32
|
|||
|
|
-->
|
|||
|
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<!-- @scroll="handleScroll" @scrolltolower="scrollBottom" -->
|
|||
|
|
<scroll-view :scroll-y="true" class="container" style="background-image: url('../../../packageRc/static/pageBg.png');">
|
|||
|
|
<view style="padding: 40rpx 28rpx;">
|
|||
|
|
<view class="kinggang">
|
|||
|
|
<view>
|
|||
|
|
<view class="num-title" style="color: #1A62CE">重点毕业生数</view>
|
|||
|
|
<view>1120</view>
|
|||
|
|
</view>
|
|||
|
|
<text style="color: #B5C1D1;">｜</text>
|
|||
|
|
<view>
|
|||
|
|
<view class="num-title" style="color: #16ACB7">累计需求数</view>
|
|||
|
|
<view>1120</view>
|
|||
|
|
</view>
|
|||
|
|
<text style="color: #B5C1D1;">｜</text>
|
|||
|
|
<view>
|
|||
|
|
<view class="num-title" style="color: #6A57D1">累计服务数</view>
|
|||
|
|
<view>1120</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="trace-line">
|
|||
|
|
<view class="trace">
|
|||
|
|
<view class="title">
|
|||
|
|
<image src="../../../packageRc/static/trace.png"/>
|
|||
|
|
毕业生追踪
|
|||
|
|
</view>
|
|||
|
|
<view style="display: flex;justify-content: space-between;" @click="goPersonalList">
|
|||
|
|
<view>点击查看</view>
|
|||
|
|
<uni-icons color="#639AEB" type="arrow-right" size="16"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="sendManager">
|
|||
|
|
<view class="title">
|
|||
|
|
<image src="../../../packageRc/static/sendManager.png"/>
|
|||
|
|
任务下发管理员
|
|||
|
|
</view>
|
|||
|
|
<view style="display: flex;justify-content: space-between;">
|
|||
|
|
<view>点击查看</view>
|
|||
|
|
<uni-icons color="#DBAA4E" type="arrow-right" size="16"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="titles">
|
|||
|
|
<view class="title-item active"><view>待办需求预警列表</view></view>
|
|||
|
|
<view>共 {{jobList1count}}条信息</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-for="(item, index) in jobList1" :key="index" class="job-list">
|
|||
|
|
<view class="title">销售顾问</view>
|
|||
|
|
<view class="info">
|
|||
|
|
待办内容文字示例待办内容文字示例待办内容文字示例待办内容文字示例
|
|||
|
|
</view>
|
|||
|
|
<view class="bottom-line">
|
|||
|
|
<view>发起时间：2025-09-24 15:02</view>
|
|||
|
|
<view style="color: #EF7325;">青岛xx公司</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="titles">
|
|||
|
|
<view class="title-item active"><view>待服务毕业生列表</view></view>
|
|||
|
|
<view>共 {{jobListcount}} 条信息</view>
|
|||
|
|
</view>
|
|||
|
|
<view v-for="(item, index) in jobList" :key="index" class="person-list">
|
|||
|
|
<view class="top-info">
|
|||
|
|
<image v-if="index%2==0" src="../../../packageRc/static/personIcon.png"/>
|
|||
|
|
<image v-else src="../../../packageRc/static/personIconFe.png"/>
|
|||
|
|
<view class="top-right">
|
|||
|
|
<view class="name-line">
|
|||
|
|
<view class="name">姓名<view class="tag">{{item.name}}</view></view>
|
|||
|
|
<view class="service-status">·未服务</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-line" style="display: flex;">
|
|||
|
|
<view style="margin-right: 24rpx;"><text>年龄：</text>27岁</view>
|
|||
|
|
<view><text>服务次数：</text>1次</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-line">
|
|||
|
|
<view><text>联系电话：</text>152****5488</view>
|
|||
|
|
<view><text>详细地址：</text>{{item.xxdz}}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="services">
|
|||
|
|
<view @click="showReturnReasonPopup(item.id)">退回</view>
|
|||
|
|
<view @click="tiao(item.id,item.name)">服务</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
|
|||
|
|
<!-- 退回原因弹窗 -->
|
|||
|
|
<uni-popup ref="returnReasonPopup" position="center" round>
|
|||
|
|
<view class="popup-content" style="background:rgb(248, 248, 248);">
|
|||
|
|
|
|||
|
|
<textarea
|
|||
|
|
v-model="returnReason"
|
|||
|
|
class="reason-textarea"
|
|||
|
|
placeholder="请输入退回原因"
|
|||
|
|
placeholder-class="placeholder-style"
|
|||
|
|
rows="5"
|
|||
|
|
maxlength="200"
|
|||
|
|
></textarea>
|
|||
|
|
<view class="popup-footer">
|
|||
|
|
<button class="cancel-btn" @click="cancelReturn">取消</button>
|
|||
|
|
<button class="confirm-btn" @click="confirmReturn">确认退回</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</uni-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup>
|
|||
|
|
import { personInfoList,personAlertList } from '../../api/personinfo/index'
|
|||
|
|
import { returnPerson} from '@/packageRc/api/personinfo/index'
|
|||
|
|
import { reactive, inject, watch, ref, onMounted, watchEffect, nextTick } from 'vue';
|
|||
|
|
let activeTab = ref(1)
|
|||
|
|
let activeTitle = ref(1)
|
|||
|
|
let jobList = ref([{},{},{},{},{}])
|
|||
|
|
let jobListcount = ref()
|
|||
|
|
let returnItemData = ref()
|
|||
|
|
let jobList1 = ref([{},{}])
|
|||
|
|
let jobList1count = ref()
|
|||
|
|
// 退回原因弹窗相关
|
|||
|
|
let returnReasonPopup = ref(null)
|
|||
|
|
let returnReason = ref('')
|
|||
|
|
let currentItemIndex = ref(-1)
|
|||
|
|
function goPersonalList() {
|
|||
|
|
console.log('goPersonalList')
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/packageRc/pages/personalList/personalList'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
function back() {
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
onMounted(() => {
|
|||
|
|
getlist();
|
|||
|
|
getlistyujing();
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
async function getlist(){
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
const res = await personInfoList();
|
|||
|
|
console.log("res", res);
|
|||
|
|
jobList.value = res.rows || [];
|
|||
|
|
jobListcount.value=res.total || 0
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error("获取数据失败:", error);
|
|||
|
|
jobList.value = [];
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
async function getlistyujing(){
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
const res = await personAlertList();
|
|||
|
|
console.log("res", res);
|
|||
|
|
jobList1.value = res.rows || [];
|
|||
|
|
jobList1count.value=res.total || 0
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error("获取数据失败:", error);
|
|||
|
|
jobList1.value = [];
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 显示退回原因弹窗
|
|||
|
|
function showReturnReasonPopup(dd) {
|
|||
|
|
this.returnItemData.id=dd
|
|||
|
|
console.log("退回")
|
|||
|
|
returnReason.value = ''
|
|||
|
|
// 使用 ref 控制弹窗显示
|
|||
|
|
if (returnReasonPopup.value) {
|
|||
|
|
returnReasonPopup.value.open()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function tiao(id,name){
|
|||
|
|
console.log('尝试导航到待办详情页面，ID:', id);
|
|||
|
|
// 尝试直接使用uni.navigateTo，使用正确的格式并传递id参数
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: `/packageRc/pages/daiban/daibandetail?id=${id}&name=${name}`,
|
|||
|
|
success: function() {
|
|||
|
|
console.log('导航成功');
|
|||
|
|
},
|
|||
|
|
fail: function(err) {
|
|||
|
|
console.error('导航失败:', err);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 确认退回
|
|||
|
|
function confirmReturn() {
|
|||
|
|
if (!returnReason.value.trim()) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '请填写退回原因',
|
|||
|
|
icon: 'none'
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
const params = {
|
|||
|
|
id: this.returnItemData.id,
|
|||
|
|
opinion: this.returnReason
|
|||
|
|
}
|
|||
|
|
const { code, msg } = returnPerson(params);
|
|||
|
|
if (code == 200) {
|
|||
|
|
this.returnDialog = false;
|
|||
|
|
this.$u.toast(msg);
|
|||
|
|
this.getList(true);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 这里可以添加提交退回原因的API调用
|
|||
|
|
console.log('退回原因:', returnReason.value, '项目索引:', currentItemIndex.value)
|
|||
|
|
|
|||
|
|
// 模拟提交成功
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '退回成功'
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 使用 ref 控制弹窗关闭
|
|||
|
|
if (returnReasonPopup.value) {
|
|||
|
|
returnReasonPopup.value.close()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 取消退回
|
|||
|
|
function cancelReturn() {
|
|||
|
|
// 使用 ref 控制弹窗关闭
|
|||
|
|
if (returnReasonPopup.value) {
|
|||
|
|
returnReasonPopup.value.close()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
function viewMore() {
|
|||
|
|
// uni.navigateTo({
|
|||
|
|
// url: '/pages/jobList/jobList'
|
|||
|
|
// })
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
view{box-sizing: border-box;display: block;}
|
|||
|
|
.container{
|
|||
|
|
background-color: #F4F4F4;background-position: top center;background-size: 100% auto;
|
|||
|
|
height: 100vh;
|
|||
|
|
min-width: 100vw;
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.kinggang{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 36rpx 32rpx 33rpx 32rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
border: 3rpx solid #FFFFFF;
|
|||
|
|
margin-bottom: 24rpx;background: linear-gradient(180deg, #EDF4FF 0%, #FFFFFF 52%);
|
|||
|
|
>view{
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
font-weight: bold;
|
|||
|
|
>view{font-size: 50rpx;}
|
|||
|
|
.num-title{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
margin-top: 16rpx;
|
|||
|
|
font-weight: normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// text{
|
|||
|
|
// font-size: 28rpx;
|
|||
|
|
// }
|
|||
|
|
}
|
|||
|
|
image{
|
|||
|
|
width: 78rpx;
|
|||
|
|
// margin-bottom: 15rpx;
|
|||
|
|
height: 78rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 退回原因弹窗样式 */
|
|||
|
|
.popup-content {
|
|||
|
|
background: #FFFF;
|
|||
|
|
border-radius: 24rpx;
|
|||
|
|
padding: 48rpx;
|
|||
|
|
width: 88%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.15);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.popup-title {
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #282828;
|
|||
|
|
margin-bottom: 36rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.reason-textarea {
|
|||
|
|
width: 100%;
|
|||
|
|
border: 2rpx solid #D8D8D8;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
padding: 24rpx;
|
|||
|
|
min-height: 220rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background: #FAFAFA;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.placeholder-style {
|
|||
|
|
color: #999999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.popup-footer {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-top: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cancel-btn,
|
|||
|
|
.confirm-btn {
|
|||
|
|
flex: 1;
|
|||
|
|
height: 90rpx;
|
|||
|
|
line-height: 90rpx;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
margin: 0 15rpx;
|
|||
|
|
font-weight: 500;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cancel-btn {
|
|||
|
|
background: #F8F8F8;
|
|||
|
|
color: #666666;
|
|||
|
|
border: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.confirm-btn {
|
|||
|
|
background: #1A62CE;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
border: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 弹窗背景遮罩层样式 */
|
|||
|
|
::v-deep(.uni-popup__wrapper) {
|
|||
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.trace-line{
|
|||
|
|
width: 100%;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
>view{
|
|||
|
|
padding: 37.5rpx 32rpx;
|
|||
|
|
width: calc(50% - 12rpx);
|
|||
|
|
.title{
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #1D6AD7;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
display: flex;
|
|||
|
|
image{
|
|||
|
|
width: 46rpx;
|
|||
|
|
height: 46rpx;
|
|||
|
|
margin-right: 11rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.more{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.trace{
|
|||
|
|
color: #2E77DF;
|
|||
|
|
border: 2rpx solid #78ADFF;
|
|||
|
|
background: linear-gradient(0deg, #FFFFFF 1%, #D0E1FF 100%);
|
|||
|
|
box-shadow: inset 0px 4rpx 10rpx 0px rgba(255, 255, 255, 0.302);
|
|||
|
|
.title{
|
|||
|
|
color: #1D6AD7;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.sendManager{
|
|||
|
|
border: 2rpx solid #FFC34B;
|
|||
|
|
color: #C68412;
|
|||
|
|
box-shadow: inset 0px 4px 10px 0px rgba(255, 255, 255, 0.302);
|
|||
|
|
background: linear-gradient(0deg, #FFFFFF 0%, #FBF4D1 100%);
|
|||
|
|
.title{color: #CE9523;}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.tabs{
|
|||
|
|
margin-bottom: 29rpx;
|
|||
|
|
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
display: flex;
|
|||
|
|
background: #fff;
|
|||
|
|
color: #878787;
|
|||
|
|
text-align: center;
|
|||
|
|
width: 100%;
|
|||
|
|
.tab{
|
|||
|
|
width: 50%;
|
|||
|
|
border: 4rpx solid transparent;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
line-height: 64rpx;
|
|||
|
|
position: relative;
|
|||
|
|
&.active{
|
|||
|
|
border: 4rpx solid #fff;
|
|||
|
|
color: #fff;
|
|||
|
|
background: linear-gradient(180deg, #79AFFF 1%, #A2B3FE 100%);
|
|||
|
|
box-shadow: 0px 4rpx 10rpx 0px rgba(40, 102, 194, 0.4);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.titles{
|
|||
|
|
display: flex;
|
|||
|
|
margin-bottom: 44rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
.title-item{
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #282828;
|
|||
|
|
margin-right: 32rpx;
|
|||
|
|
position: relative;
|
|||
|
|
>view{
|
|||
|
|
position: relative;
|
|||
|
|
z-index: 2;
|
|||
|
|
padding: 0 16rpx;
|
|||
|
|
}
|
|||
|
|
&.active::after{
|
|||
|
|
content: '';
|
|||
|
|
position: absolute;
|
|||
|
|
z-index: 1;
|
|||
|
|
bottom: -12rpx;
|
|||
|
|
left: 0;
|
|||
|
|
width: 120%;
|
|||
|
|
height: 24rpx;
|
|||
|
|
border-radius: 50px 0px 0px 50px;
|
|||
|
|
background: linear-gradient(90deg, #78AEFF 0%, rgba(120, 174, 255, 0.31) 52%, rgba(24, 116, 255, 0) 100%);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.job-list{
|
|||
|
|
width: 100%;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
color: #333333;
|
|||
|
|
border-radius: 24rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
position: relative;
|
|||
|
|
.sign{
|
|||
|
|
position: absolute;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
right: 0;
|
|||
|
|
top: 0;
|
|||
|
|
padding: 4rpx 14rpx;
|
|||
|
|
border: 1rpx solid #EC4827;
|
|||
|
|
background: rgba(227, 79, 49, 0.09);
|
|||
|
|
border-top-right-radius: 24rpx;
|
|||
|
|
border-bottom-left-radius: 24rpx;
|
|||
|
|
color: #EC4827;
|
|||
|
|
}
|
|||
|
|
.top-line{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #A2A2A2;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
.salary{
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #4C6EFB;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.title{
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #282828;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
display: flex;
|
|||
|
|
image{
|
|||
|
|
width: 46rpx;
|
|||
|
|
height: 46rpx;
|
|||
|
|
margin-right: 11rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.info{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.bottom-line{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #A2A2A2;
|
|||
|
|
margin-top: 12rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.view-more-btn{
|
|||
|
|
padding: 10rpx 56rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
color: #4C6EFB;
|
|||
|
|
border: 1rpx solid #4C6EFB;
|
|||
|
|
text-align: center;
|
|||
|
|
border-radius: 40rpx;
|
|||
|
|
width: fit-content;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
}
|
|||
|
|
.person-list{
|
|||
|
|
padding-top: 32rpx;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
.top-info{
|
|||
|
|
padding: 0 32rpx;
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
display: flex;
|
|||
|
|
image{
|
|||
|
|
width: 86rpx;
|
|||
|
|
height: 86rpx;
|
|||
|
|
margin-right: 19rpx;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
.top-right{
|
|||
|
|
flex-grow: 1;
|
|||
|
|
flex-shrink: 1;
|
|||
|
|
.name-line{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
.name{
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
display: flex;
|
|||
|
|
margin-right: 15rpx;
|
|||
|
|
margin-bottom: 3rpx;
|
|||
|
|
align-items: center;
|
|||
|
|
.tag{
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
line-height: 32rpx;
|
|||
|
|
padding: 0 12rpx;
|
|||
|
|
margin-left: 15rpx;
|
|||
|
|
border-radius: 4rpx;
|
|||
|
|
background: #4D89E3;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.service-status{
|
|||
|
|
color: #E0A61F;
|
|||
|
|
font-weight: bold;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.info-line{
|
|||
|
|
padding: 0;
|
|||
|
|
border: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.info-line{
|
|||
|
|
padding: 0 32rpx 32rpx;
|
|||
|
|
color: #3D3D3D;
|
|||
|
|
border-bottom: 1px solid #E8E8E8;
|
|||
|
|
>view{
|
|||
|
|
text{
|
|||
|
|
color: #8E8E8E;
|
|||
|
|
}
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.services{
|
|||
|
|
line-height: 40rpx;
|
|||
|
|
padding: 28rpx 32rpx;
|
|||
|
|
display: flex;
|
|||
|
|
>view{
|
|||
|
|
flex-grow: 1;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #1A62CE;
|
|||
|
|
text-align: center;
|
|||
|
|
&:first-child{
|
|||
|
|
color: #E04020;
|
|||
|
|
border-right: 1px solid #D8D8D8;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|