更新
This commit is contained in:
xuyuncong
parent
f0cde52cf0
commit
ff935b560e
@ -4,148 +4,114 @@
|
||||
<u-icon name="arrow-left" color="#fff" size="18"></u-icon>
|
||||
</headersVue>
|
||||
<view class="ail">
|
||||
<view class="ahhh">
|
||||
<view class="time-selector">
|
||||
<common-time-select v-model="range" @subsection-change="maskClick"></common-time-select>
|
||||
</view>
|
||||
|
||||
<!-- ↓ 新增 -->
|
||||
<!-- 空状态 -->
|
||||
<view class="empty-state" v-if="datas.length == 0 && id !== 6">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode="aspectFit"></image>
|
||||
<text class="empty-text">暂无数据</text>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- <view class="ping-bottom">
|
||||
<view class="dinga">客户来源统计</view>
|
||||
<view class="dinga">更多<uni-icons type="right" size="12"></uni-icons></view>
|
||||
</view> -->
|
||||
<view v-if="id == 1">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
<view class="top-box" v-for="(item,index) in datas" :key="index">
|
||||
<view class="t-top">
|
||||
<view class="sys">
|
||||
<view class="t-title">客户来源</view>
|
||||
<view class="t-num">{{ item.customerSource || '' }}</view>
|
||||
</view>
|
||||
<view class="sys">
|
||||
<view class="t-title">车型</view>
|
||||
<view class="t-num">{{ item.goodsTitle || '' }}</view>
|
||||
</view>
|
||||
<view class="sys">
|
||||
<view class="t-title">数量</view>
|
||||
<view class="t-num">{{ item.theNum || '' }}</view>
|
||||
</view>
|
||||
<view class="sys">
|
||||
<view class="t-title">公示金额</view>
|
||||
<view class="t-num">{{ item.theAmount || '' }}</view>
|
||||
</view>
|
||||
<!-- 客户来源统计 -->
|
||||
<view v-if="id == 1" class="statistics-container">
|
||||
<view class="statistics-grid" v-for="(item,index) in datas" :key="index">
|
||||
<view class="statistic-item">
|
||||
<view class="statistic-label">客户来源</view>
|
||||
<view class="statistic-value">{{ item.customerSource || '' }}</view>
|
||||
</view>
|
||||
<view class="statistic-item">
|
||||
<view class="statistic-label">车型</view>
|
||||
<view class="statistic-value">{{ item.goodsTitle || '' }}</view>
|
||||
</view>
|
||||
<view class="statistic-item">
|
||||
<view class="statistic-label">数量</view>
|
||||
<view class="statistic-value">{{ item.theNum || '' }}</view>
|
||||
</view>
|
||||
<view class="statistic-item">
|
||||
<view class="statistic-label">公示金额</view>
|
||||
<view class="statistic-value">{{ item.theAmount || '' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="id == 2">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
<view class="waigg">
|
||||
<view class="top-boxx" v-for="(item,index) in datas" :key="index">
|
||||
<view class="t-top">
|
||||
<view class="t-title">{{ item.goodsTitle || '' }}</view>
|
||||
<view class="t-num">{{ item.theNum || '' }}</view>
|
||||
</view>
|
||||
<!-- 检测车型统计 -->
|
||||
<view v-if="id == 2" class="statistics-container">
|
||||
<view class="statistics-grid compact">
|
||||
<view class="statistic-card" v-for="(item,index) in datas" :key="index">
|
||||
<view class="statistic-label">{{ item.goodsTitle || '' }}</view>
|
||||
<view class="statistic-value">{{ item.theNum || '' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view v-if="id == 3">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
<!-- 代收款 -->
|
||||
<view v-if="id == 3" class="statistics-container">
|
||||
<view class="statistics-grid compact">
|
||||
<view class="statistic-card" v-for="(item,index) in datas" :key="index">
|
||||
<view class="statistic-label">{{ item.theName || '' }}</view>
|
||||
<view class="statistic-value">{{ item.theAmount || '' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="waigg">
|
||||
<view class="top-boxx" v-for="(item,index) in datas" :key="index">
|
||||
<view class="t-top">
|
||||
</view>
|
||||
|
||||
<view class="t-title" style="display: flex; align-items: center; ">{{ item.theName || '' }}:
|
||||
<!-- 检测类型统计 -->
|
||||
<view v-if="id == 4" class="statistics-container">
|
||||
<view class="statistics-grid compact">
|
||||
<view class="statistic-card" v-for="(item,index) in datas" :key="index">
|
||||
<view class="statistic-label">{{ item.skuName || '' }}</view>
|
||||
<view class="statistic-value">{{ item.orderCount || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 客户来源统计(可点击) -->
|
||||
<view v-if="id == 5" class="statistics-container">
|
||||
<view class="statistics-grid compact">
|
||||
<view class="statistic-card clickable" v-for="(item,index) in datas" :key="index"
|
||||
@click="goProjectList(item)">
|
||||
<view class="statistic-label">{{ item.name || '' }}</view>
|
||||
<view class="statistic-value">{{ item.theNum || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 资料统计 -->
|
||||
<view v-if="id == 6" class="statistics-container">
|
||||
<view class="empty-state" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode="aspectFit"></image>
|
||||
<text class="empty-text">暂无数据</text>
|
||||
</view>
|
||||
<view class="file-list" v-else>
|
||||
<view class="file-item" v-for="(item,index) in datas" :key="index">
|
||||
<view class="file-info">
|
||||
<view class="file-name">资料名称：{{ item.fileName || '' }}</view>
|
||||
<view class="file-time">{{ type=='add' ? '新增时间' : '修改时间' }} {{formatDate(item.createTime)}}
|
||||
</view>
|
||||
<view class="t-num">{{ item.theAmount || '' }}</view>
|
||||
<view class="file-type">类型：{{ item.type == 2 ?'文件' :'文件夹' }}</view>
|
||||
</view>
|
||||
<view v-if="item.type=='2'" class="file-action" @click="viewFile(item.filePath)">查看文件</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="id == 4">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
<view class="waigg">
|
||||
<view class="top-boxx" v-for="(item,index) in datas" :key="index">
|
||||
<view class="t-top">
|
||||
|
||||
<view class="t-title" style="display: flex; align-items: center; ">{{ item.skuName || '' }}:
|
||||
</view>
|
||||
<view class="t-num">{{ item.orderCount || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="id == 5">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
<view class="waigg">
|
||||
<view class="top-boxx" v-for="(item,index) in datas" :key="index" @click="goProjectList(item)">
|
||||
<view class="t-top">
|
||||
|
||||
<view class="t-title" style="display: flex; align-items: center; ">{{ item.name || '' }}:
|
||||
</view>
|
||||
<view class="t-num">{{ item.theNum || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="id == 6">
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
<view class="">
|
||||
<view class="top-boxx2" v-for="(item,index) in datas" :key="index"
|
||||
style="display: flex;padding: 15rpx;justify-content: space-between;">
|
||||
<view class="" style="">
|
||||
<view class="" style=" ">
|
||||
资料名称：{{ item.fileName || '' }}
|
||||
</view>
|
||||
<view style="margin-top: 20rpx;">{{ type=='add' ? '新增时间' : '修改时间' }}
|
||||
{{formatDate(item.createTime)}}
|
||||
</view>
|
||||
<view class="" style="margin-top: 20rpx;">类型： {{ item.type == 2 ?'文件' :'文件夹' }}</view>
|
||||
</view>
|
||||
<view v-if="item.type=='2'" style="color: #3D89FC;" @click="viewFile(item.filePath)">查看文件</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="jsy" v-if="datas.length == 0">
|
||||
<image src="http://www.nuoyunr.com/lananRsc/detection/qs.png" mode=""></image>
|
||||
</view>
|
||||
|
||||
<view v-if="id == 7">
|
||||
<view class="waigg">
|
||||
<view class="top-boxx" v-for="(item,index) in datas" :key="index"
|
||||
<!-- 来源-待收款 -->
|
||||
<view v-if="id == 7" class="statistics-container">
|
||||
<view class="statistics-grid compact">
|
||||
<view class="statistic-card clickable" v-for="(item,index) in datas" :key="index"
|
||||
@click="goProjectListByType(item)">
|
||||
<view class="t-top">
|
||||
|
||||
<view class="t-title" style="display: flex; align-items: center; ">
|
||||
{{ item.sourceName || '' }}:
|
||||
</view>
|
||||
<view class="t-num">{{ item.pendingAmountYuan || 0 }}</view>
|
||||
<view class="statistic-row">
|
||||
<view class="statistic-label">来源</view>
|
||||
<view class="statistic-value">{{ item.sourceName || '' }}</view>
|
||||
</view>
|
||||
<view class="t-top">
|
||||
|
||||
<view class="t-title" style="display: flex; align-items: center; ">
|
||||
台次
|
||||
</view>
|
||||
<view class="t-num">{{ item.pendingCount || 0 }}</view>
|
||||
<view class="statistic-row">
|
||||
<view class="statistic-label">金额</view>
|
||||
<view class="statistic-value">{{ item.pendingAmountYuan || 0 }}</view>
|
||||
</view>
|
||||
<view class="statistic-row">
|
||||
<view class="statistic-label">台次</view>
|
||||
<view class="statistic-value">{{ item.pendingCount || 0 }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -455,364 +421,180 @@
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.jsy {
|
||||
width: 90%;
|
||||
margin: 40px auto;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
height: calc(100vh);
|
||||
background-color: #F7F8FC;
|
||||
box-sizing: border-box;
|
||||
// padding-top: 45px;
|
||||
}
|
||||
|
||||
.ping-bottom {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 0px 15px;
|
||||
}
|
||||
|
||||
.c-top {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
padding-top: 55px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.c-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
.ail {
|
||||
width: 100%;
|
||||
background-color: #F6F6F6;
|
||||
background-color: #F7F8FC;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20px;
|
||||
min-height: calc(100vh - 100px);
|
||||
}
|
||||
|
||||
.top-box {
|
||||
width: 95%;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
// padding: 18px;
|
||||
background-color: white;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.top-boxx {
|
||||
width: 47%;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
// padding: 18px;
|
||||
background-color: white;
|
||||
margin-top: 10px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.top-boxx2 {
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
// padding: 18px;
|
||||
background-color: white;
|
||||
margin-top: 10px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.cont-box {
|
||||
width: 100%;
|
||||
border-radius: 5px;
|
||||
box-sizing: border-box;
|
||||
padding: 18px;
|
||||
background-color: white;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.charts-box {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.t-bottom {
|
||||
width: 100%;
|
||||
height: 130px;
|
||||
border-top: 1px solid #EEEEEE;
|
||||
box-sizing: border-box;
|
||||
// padding: 20px;
|
||||
}
|
||||
|
||||
.t-top {
|
||||
width: 100%;
|
||||
// height: 130px;
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.sis {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.dinga {
|
||||
// margin-left: 25px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sys {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.t-title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.t-num {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
color: #0D2E8D;
|
||||
line-height: 26px;
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.cont-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.charts-box {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.wrap-box {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.w-box {
|
||||
width: 33%;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.imgicon {
|
||||
width: 33px;
|
||||
height: 28px;
|
||||
margin: 0 auto;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.t-zhong {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
margin: 3px auto;
|
||||
}
|
||||
|
||||
.lanbnum {
|
||||
font-size: 26px;
|
||||
font-weight: bold;
|
||||
color: #0D2E8D;
|
||||
}
|
||||
|
||||
.b-title {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.b-zuo {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.b-zhong {
|
||||
text-align: left;
|
||||
width: 60%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.b-you {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.touxiang {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
background-color: salmon;
|
||||
overflow: hidden;
|
||||
margin-right: 10px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.one {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
background: #FEB947;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
.dis-t {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.lank {
|
||||
width: 102px;
|
||||
height: 27px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid #0D2E8D;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
color: #0D2E8D;
|
||||
}
|
||||
|
||||
.lan-you {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.yi {
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
line-height: 15px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.er {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background: #0D2E8D;
|
||||
border-radius: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
// ----------------------
|
||||
.popup-box {
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.sousuo {
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
margin-left: 0px;
|
||||
height: 30px;
|
||||
background: #F0F0F0;
|
||||
border-radius: 50px;
|
||||
color: #999999;
|
||||
box-sizing: border-box;
|
||||
padding: 0 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
input {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.list-box {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
|
||||
.list_scroll {
|
||||
height: 100%; // 需设置高度
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
}
|
||||
|
||||
.list-qiu {
|
||||
width: 95%;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
box-sizing: border-box;
|
||||
padding: 10px 5px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.tel {
|
||||
margin-left: 5px;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.ahhh {
|
||||
.time-selector {
|
||||
width: 90%;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.waigg {
|
||||
/* 空状态样式 */
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60rpx 0;
|
||||
|
||||
image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
/* 统计容器 */
|
||||
.statistics-container {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
/* 统计网格布局 */
|
||||
.statistics-grid {
|
||||
width: 100%;
|
||||
|
||||
&.compact {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
gap: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 统计项样式 */
|
||||
.statistic-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* 统计卡片样式 */
|
||||
.statistic-card {
|
||||
width: calc(50% - 10rpx);
|
||||
background-color: white;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
|
||||
box-sizing: border-box;
|
||||
|
||||
&.clickable {
|
||||
transition: all 0.2s;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.statistic-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
align-items: center;
|
||||
margin-bottom: 15rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.statistic-label {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.statistic-value {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #0D2E8D;
|
||||
line-height: 1.2;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
/* 文件列表样式 */
|
||||
.file-list {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.file-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
background-color: white;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.file-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.file-time,
|
||||
.file-type {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.file-action {
|
||||
color: #3D89FC;
|
||||
font-size: 26rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: rgba(61, 137, 252, 0.1);
|
||||
white-space: nowrap;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
/* 响应式调整 */
|
||||
@media (max-width: 750px) {
|
||||
.statistic-card {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.file-item {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.file-action {
|
||||
margin-left: 0;
|
||||
margin-top: 20rpx;
|
||||
align-self: flex-end;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user