美化了样式
This commit is contained in:
@ -1,132 +1,128 @@
|
||||
<!-- pages/dashboardModule/supervisorPerformance/supervisorPerformance.wxml -->
|
||||
<view class="flex-col page">
|
||||
<view class="page">
|
||||
<!-- 标题 -->
|
||||
<text class="self-center text">员工业绩报表</text>
|
||||
<view class="page-title">
|
||||
<text class="title">员工业绩报表</text>
|
||||
</view>
|
||||
|
||||
<!-- 搜索表单 -->
|
||||
<view class="flex-col self-stretch mt-19">
|
||||
<view class="flex-col section">
|
||||
<!-- 主管名称 -->
|
||||
<view class="flex-col items-start">
|
||||
<text class="font text_2">员工名称</text>
|
||||
<view class="flex-col justify-start items-start text-wrapper mt-7">
|
||||
<scroll-view scroll-y class="content no-scrollbar">
|
||||
<!-- 搜索表单 -->
|
||||
<view class="card form-card">
|
||||
<!-- 员工名称 -->
|
||||
<view class="field">
|
||||
<text class="field-label">员工名称</text>
|
||||
<view class="input-box">
|
||||
<input
|
||||
class="text_3 font text_4"
|
||||
class="input"
|
||||
placeholder="请输入员工名称"
|
||||
placeholder-class="ph"
|
||||
bindinput="onNameInput"
|
||||
value="{{nickName}}"
|
||||
value="{{ nickName }}"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 手机号 -->
|
||||
<view class="flex-col items-start mt-24">
|
||||
<text class="font text_1">手机号</text>
|
||||
<view class="flex-col justify-start items-start text-wrapper_1 mt-8">
|
||||
<view class="field">
|
||||
<text class="field-label">手机号</text>
|
||||
<view class="input-box">
|
||||
<input
|
||||
class="text_3 font text_5"
|
||||
class="input"
|
||||
placeholder="请输入手机号"
|
||||
placeholder-class="ph"
|
||||
bindinput="onPhoneInput"
|
||||
value="{{phoneNumber}}"
|
||||
value="{{ phoneNumber }}"
|
||||
type="number"
|
||||
maxLength="11"
|
||||
maxlength="11"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 搜索按钮 -->
|
||||
<view
|
||||
class="flex-col justify-start items-center text-wrapper_2 mt-24"
|
||||
bindtap="onSearch"
|
||||
>
|
||||
<text class="font text_6">搜索</text>
|
||||
</view>
|
||||
<!-- 搜索 -->
|
||||
<view class="btn btn-primary" bindtap="onSearch">搜索</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 业绩列表，未搜索前不显示 -->
|
||||
<block wx:if="{{showList}}">
|
||||
<view class="flex-col justify-start mt-28">
|
||||
<view class="flex-col">
|
||||
<view
|
||||
class="flex-col list-item mt-25"
|
||||
wx:for="{{performanceList}}"
|
||||
wx:for-item="item"
|
||||
wx:for-index="index"
|
||||
wx:key="item.id"
|
||||
>
|
||||
<!-- 基本信息 -->
|
||||
<view class="flex-row justify-between self-stretch group">
|
||||
<view class="flex-col items-start self-center">
|
||||
<text class="font_2">编号：{{index + 1}}</text>
|
||||
<text class="font text_8 mt-13">员工：{{item.nickName}}</text>
|
||||
</view>
|
||||
<view class="flex-col justify-start self-start text-wrapper_4" bind:tap="gotoUser" data-id="{{ item.userId }}">
|
||||
<text class="font_3 text_7">客户订单明细>></text>
|
||||
</view>
|
||||
<!-- 业绩列表 -->
|
||||
<block wx:if="{{ showList }}">
|
||||
<!-- 空状态（可选） -->
|
||||
<view wx:if="{{ !performanceList || performanceList.length === 0 }}" class="empty">
|
||||
<image class="empty-img" src="/assets/empty-list.png" mode="aspectFit" />
|
||||
<text class="empty-text">暂无数据</text>
|
||||
</view>
|
||||
|
||||
<!-- 列表卡片 -->
|
||||
<view wx:for="{{ performanceList }}"
|
||||
wx:key="item.id"
|
||||
wx:for-item="item"
|
||||
wx:for-index="index"
|
||||
class="card perf-card">
|
||||
|
||||
<!-- 顶部：编号 + 员工 + 跳转 -->
|
||||
<view class="topline">
|
||||
<view class="id-and-name">
|
||||
<text class="no">编号：{{ index + 1 }}</text>
|
||||
<text class="name">员工：{{ item.nickName }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 手机号 & 复制 -->
|
||||
<view class="flex-row self-start section_3">
|
||||
<text class="font_4">手机号：{{item.phoneNumber}}</text>
|
||||
<text
|
||||
class="font_3 text_9"
|
||||
bindtap="onCopyPhone"
|
||||
data-phone="{{item.phoneNumber}}"
|
||||
>复制</text>
|
||||
<view class="link-btn" bind:tap="gotoUser" data-id="{{ item.userId }}">
|
||||
<text class="link-text">客户订单明细 >></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 员工数 & 抽成比例 -->
|
||||
<view class="flex-row self-stretch group_2">
|
||||
<view class="flex-col justify-start text-wrapper_5">
|
||||
<text class="font_4 text_10">客户数：{{item.empCount}}</text>
|
||||
</view>
|
||||
<view class="flex-col justify-start text-wrapper_6 ml-10">
|
||||
<text class="font_4 text_11">比例：{{item.ratePercent}}%</text>
|
||||
</view>
|
||||
<!-- 手机号 + 复制 -->
|
||||
<view class="row">
|
||||
<text class="row-key">手机号</text>
|
||||
<view class="row-val">
|
||||
<text class="mono">{{ item.phoneNumber }}</text>
|
||||
<text class="copy" bindtap="onCopyPhone" data-phone="{{ item.phoneNumber }}">复制</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 业绩网格 -->
|
||||
<view class="self-stretch group_3">
|
||||
<view class="flex-col items-start grid-item">
|
||||
<text class="font_5 text_12">下单量</text>
|
||||
<text class="font_6 mt-18">{{item.orderCount}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_2">
|
||||
<text class="font_5 text_13">总订单</text>
|
||||
<text class="font_6 text_15 mt-18">￥{{item.totalAmount}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_3">
|
||||
<text class="font_5 text_14">净成交</text>
|
||||
<text class="font_6 text_16 mt-17">￥{{item.netAmount}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_4">
|
||||
<text class="font_5 text_17">待释放</text>
|
||||
<text class="font_6 text_18 mt-18">￥{{item.toRelease}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_5">
|
||||
<text class="font_5">可结算</text>
|
||||
<text class="font_6 mt-18">{{item.toSettle}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_6">
|
||||
<text class="font_5">已结算</text>
|
||||
<text class="font_6 text_19 mt-18">￥{{item.settled}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_7">
|
||||
<text class="font_5 text_20">推广数</text>
|
||||
<text class="font_6 mt-17">{{item.promoCount}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_8">
|
||||
<text class="font_5 text_21">退款</text>
|
||||
<text class="font_6 text_23 mt-18">￥{{item.refunded}}</text>
|
||||
</view>
|
||||
<view class="flex-col items-start grid-item_9">
|
||||
<text class="font_5 text_22">已回退</text>
|
||||
<text class="font_6 text_24 mt-18">￥0</text>
|
||||
</view>
|
||||
<!-- 客户数 + 抽成比例（徽章） -->
|
||||
<view class="chips">
|
||||
<view class="chip">客户数：{{ item.empCount }}</view>
|
||||
<view class="chip">比例：{{ item.ratePercent }}%</view>
|
||||
</view>
|
||||
|
||||
<!-- 业绩九宫格 -->
|
||||
<view class="grid">
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">下单量</text>
|
||||
<text class="gi-value">{{ item.orderCount }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">总订单</text>
|
||||
<text class="gi-value money">￥{{ item.totalAmount }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">净成交</text>
|
||||
<text class="gi-value money">￥{{ item.netAmount }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">待释放</text>
|
||||
<text class="gi-value money">￥{{ item.toRelease }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">可结算</text>
|
||||
<text class="gi-value">{{ item.toSettle }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">已结算</text>
|
||||
<text class="gi-value money">￥{{ item.settled }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">推广数</text>
|
||||
<text class="gi-value">{{ item.promoCount }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">退款</text>
|
||||
<text class="gi-value money">￥{{ item.refunded }}</text>
|
||||
</view>
|
||||
<view class="grid-item">
|
||||
<text class="gi-label">已回退</text>
|
||||
<text class="gi-value money">￥0</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user