朱园亮 / erp-mobile · Commits

Commit 0e085b6479398a44e927a63de4946338509eff4f

Authored by 史婷婷
1 parent 3fa58743

feat: 资信管理-新增优化+详情暂存

Inline Side-by-side
Showing 4 changed files with 410 additions and 99 deletions
... ... @@ -96,6 +96,13 @@
96 96 "navigationBarBackgroundColor": "#ffffff",
97 97 "navigationBarTextStyle": "black"
98 98 }
  99 + }, {
  100 + "path": "pages/credit_manage/detail",
  101 + "style": {
  102 + "navigationBarTitleText": "查看客户资信",
  103 + "navigationBarBackgroundColor": "#ffffff",
  104 + "navigationBarTextStyle": "black"
  105 + }
99 106 },
100 107 {
101 108 "path": "pages/flow/myflow",
... ...
... ... @@ -103,8 +103,7 @@
103 103 </uni-list-item>
104 104
105 105 <!-- 核心人员 -->
106   - <CorePersonnel mode="add" :dateBase="form.corePersonnelList" @change="onCorePersonnelChange"
107   - :options="genderOptions" />
  106 + <CorePersonnel mode="add" @change="onCorePersonnelChange" :options="genderOptions" />
108 107
109 108 <view class="title-header">
110 109 <image class="title-header_icon" src="/static/images/title.png" />
... ...
... ... @@ -92,22 +92,15 @@
92 92
93 93 <view v-else class="view-list" v-show="!collapsedView">
94 94 <view v-for="(item, idx) in items" :key="'v-' + idx" class="card">
95   - <view class="row"><text class="label">产品名称</text><text class="value">{{ item.productName }}</text>
96   - </view>
97   - <view class="row"><text class="label">行业</text><text class="value">{{ item.industry }}</text></view>
98   - <view class="row"><text class="label">牌号</text><text class="value">{{ item.brand }}</text></view>
99   - <view class="row"><text class="label">品质</text><text class="value">{{ item.quality }}</text></view>
100   - <view class="row"><text class="label">状态</text><text class="value">{{ item.status }}</text></view>
101   - <view class="row"><text class="label">数量</text><text class="value">{{ item.quantity }}</text></view>
102   - <view class="row"><text class="label">单价</text><text class="value">{{ formatCurrency(item.unitPrice)
103   - }}</text>
104   - </view>
105   - <view class="row"><text class="label">不含税金额</text><text class="value">{{
106   - formatCurrency(item.amountExcludingTax)
107   - }}</text></view>
108   - <view class="row"><text class="label">总金额</text><text class="value">{{ formatCurrency(item.totalAmount)
109   - }}</text></view>
110   - <view class="row"><text class="label">发货日期</text><text class="value">{{ item.orderDate }}</text></view>
  95 + <view class="row"><text class="label">姓名</text><text class="value">{{ item.name }}</text></view>
  96 + <view class="row"><text class="label">性别</text><text class="value">{{ getSexName(item) }}</text></view>
  97 + <view class="row"><text class="label">籍贯</text><text class="value">{{ item.nativePlace }}</text></view>
  98 + <view class="row"><text class="label">年龄</text><text class="value">{{ item.age }}</text></view>
  99 + <view class="row"><text class="label">职务</text><text class="value">{{ item.position }}</text></view>
  100 + <view class="row"><text class="label">手机</text><text class="value">{{ item.mobile }}</text></view>
  101 + <view class="row"><text class="label">固定电话</text><text class="value">{{ item.phone }}</text></view>
  102 + <view class="row"><text class="label">邮箱地址</text><text class="value">{{ item.email }}</text></view>
  103 + <view class="row"><text class="label">现住址</text><text class="value">{{ item.address }}</text></view>
111 104 </view>
112 105 </view>
113 106 <SingleSelectSheet :visible.sync="sheet.visible" :title="sheet.title" :options="sheet.options"
... ... @@ -122,7 +115,6 @@ export default {
122 115 mode: { type: String, default: 'add' },
123 116 list: { type: Array, default: () => [] },
124 117 max: { type: Number, default: 8 },
125   - dateBase: { type: String, default: '' },
126 118 options: { type: Array, default: () => [] }
127 119 },
128 120 components: { SingleSelectSheet },
... ... @@ -130,7 +122,7 @@ export default {
130 122 return {
131 123 items: [],
132 124 collapsedView: false,
133   - sheet: { visible: false, title: '请选择产品', options: [], value: '', idx: -1 }
  125 + sheet: { visible: false, title: '请选择性别', options: [], value: '', idx: -1 }
134 126 }
135 127 },
136 128 computed: {
... ... @@ -149,12 +141,19 @@ export default {
149 141 },
150 142 list: {
151 143 handler(v) {
152   - // const arr = Array.isArray(v) ? v : []
153   - // this.items = arr.map(x => ({ ...this.defaultItem(), ...x, collapsed: true }))
154   - this.items = v.map(x => ({ ...this.defaultItem(), ...x, collapsed: true }))
155   - console.log('v', v)
  144 + const arr = Array.isArray(v) ? v : []
  145 + const opts = this.selectOptions
  146 + this.items = arr.map(x => {
  147 + const it = { ...this.defaultItem(), ...x, collapsed: true }
  148 + const m = opts.find(o => String(o.value) === String(it.sex))
  149 + it.sexName = m ? (m.label || '') : it.sexName
  150 + return it
  151 + })
156 152 },
157 153 deep: true
  154 + },
  155 + options: {
  156 + handler() { this.refreshSexNames() }
158 157 }
159 158 },
160 159 created() {
... ... @@ -165,48 +164,18 @@ export default {
165 164 defaultItem() {
166 165 return { name: '', sex: '', sexName: '', nativePlace: '', age: '', position: '', mobile: '', phone: '', email: '', address: '', collapsed: false }
167 166 },
168   - onImmediateChange(idx) {
169   - this.$nextTick(() => this.recalculate(idx))
170   - },
171   - toNumber(val) {
172   - if (typeof val === 'number') return isNaN(val) ? 0 : val
173   - const n = parseFloat(String(val).replace(/[^0-9.\-]/g, ''))
174   - return isNaN(n) ? 0 : n
175   - },
176   - round(val, digits = 2) {
177   - const n = Number(val)
178   - if (isNaN(n)) return 0
179   - const m = Math.pow(10, digits)
180   - return Math.round(n * m) / m
181   - },
182   - onNumberBlur(idx, field, digits) {
183   - const it = this.items[idx]
184   - if (!it) return
185   - const raw = it[field]
186   - // 如果为空则保持为空，不自动置为0，仅重新计算依赖字段
187   - if (raw === '' || raw === null || raw === undefined) {
188   - this.$set(this.items, idx, it)
189   - this.recalculate(idx)
190   - return
191   - }
192   - const num = this.toNumber(raw)
193   - const rounded = this.round(num, digits)
194   - it[field] = rounded
195   - this.$set(this.items, idx, it)
196   - this.recalculate(idx)
197   - },
198   - formatCurrency(val) {
199   - if (val == null || val === '') return ''
200   - const num = Number(val)
201   - const pre = isNaN(num) ? '' : '¥'
202   - const fixed = isNaN(num) ? String(val) : num.toFixed(2)
203   - return `${pre}${fixed}`
  167 + getSexName(item) {
  168 + const opts = this.selectOptions
  169 + const v = item && item.sex
  170 + const m = opts.find(o => String(o.value) === String(v))
  171 + return m ? (m.label || '') : ((item && item.sexName) || '')
204 172 },
205   - specOf(item) {
206   - const t = [item.thickness, item.thicknessTolPos, item.thicknessTolNeg].filter(Boolean).join('/')
207   - const w = [item.width, item.widthTolPos, item.widthTolNeg].filter(Boolean).join('/')
208   - const l = [item.length, item.lengthTolPos, item.lengthTolNeg].filter(Boolean).join('/')
209   - return [t, w, l].filter(Boolean).join(' × ')
  173 + refreshSexNames() {
  174 + const opts = this.selectOptions
  175 + this.items = (this.items || []).map(it => {
  176 + const m = opts.find(o => String(o.value) === String(it.sex))
  177 + return { ...it, sexName: m ? (m.label || '') : it.sexName }
  178 + })
210 179 },
211 180 openProductSheet(idx) {
212 181 const opts = this.selectOptions
... ... @@ -224,20 +193,6 @@ export default {
224 193 this.sheet.visible = false
225 194 this.emitChange()
226 195 },
227   - recalculate(idx) {
228   - const TAX_RATE = 0.13
229   - const it = this.items[idx]
230   - if (!it) return
231   - const qty = this.toNumber(it.quantity)
232   - const price = this.toNumber(it.unitPrice)
233   - const total = this.round(qty * price, 2)
234   - const excl = this.round(total / (1 + TAX_RATE), 2)
235   - const next = { ...it, totalAmount: total, amountExcludingTax: excl }
236   - this.$set(this.items, idx, next)
237   - },
238   - recalculateAll() {
239   - for (let i = 0; i < this.items.length; i++) this.recalculate(i)
240   - },
241 196 onAdd() {
242 197 if (this.items.length >= this.max) return uni.showToast({ title: `最多添加${this.max}个`, icon: 'none' })
243 198 const obj = this.defaultItem()
... ... @@ -261,21 +216,6 @@ export default {
261 216 this.$emit('update:value', out)
262 217 this.$emit('change', out)
263 218 },
264   - onDateChange(idx, e) {
265   - const it = this.items[idx]
266   - if (!it) return
267   - const val = typeof e === 'string' ? e : (e && e.detail && e.detail.value) ? e.detail.value : it.orderDate
268   - const dateStr = String(val).slice(0, 10)
269   - const base = this.dateBase ? new Date(this.dateBase) : null
270   - const d = new Date(dateStr)
271   - if (base && !isNaN(d.getTime()) && d.getTime() < base.getTime()) {
272   - uni.showToast({ title: '发货日期不得早于订货日期', icon: 'none' })
273   - it.orderDate = this.dateBase
274   - } else {
275   - it.orderDate = dateStr
276   - }
277   - this.$set(this.items, idx, it)
278   - },
279 219 toggleViewCollapse() {
280 220 this.collapsedView = !this.collapsedView
281 221 }
... ... @@ -424,20 +364,25 @@ export default {
424 364 }
425 365
426 366 .view-list {
427   - padding: 24rpx 32rpx;
  367 + padding: 26rpx 32rpx;
428 368 background: #ffffff;
429 369 }
430 370
431 371 .card {
432 372 background: #f3f3f3;
433 373 border-radius: 16rpx;
434   - padding: 24rpx;
  374 + padding: 32rpx 44rpx;
435 375 margin-bottom: 20rpx;
  376 +
  377 + &:last-child {
  378 + margin-bottom: 0;
  379 + }
436 380 }
437 381
438 382 .row {
439 383 display: flex;
440   - margin-bottom: 20rpx;
  384 + margin-bottom: 24rpx;
  385 + line-height: 32rpx;
441 386 }
442 387
443 388 .row:last-child {
... ... @@ -445,15 +390,17 @@ export default {
445 390 }
446 391
447 392 .label {
448   - width: 120rpx;
  393 + width: 180rpx;
  394 + margin-right: 14rpx;
449 395 color: rgba(0, 0, 0, 0.6);
450 396 font-size: 28rpx;
451 397 }
452 398
453 399 .value {
454 400 flex: 1;
455   - text-align: right;
456 401 color: rgba(0, 0, 0, 0.9);
457 402 font-size: 28rpx;
  403 + white-space: pre-wrap;
  404 + word-break: break-all;
458 405 }
459 406 </style>
... ...
  1 +<template>
  2 + <view class="page">
  3 + <scroll-view class="scroll" scroll-y>
  4 + <view class="detail-page">
  5 + <view class="section">
  6 + <text class="row company">{{ form.companyName }}</text>
  7 + <view :class="['status', `status_${form.status}`]" />
  8 + <view class="row"><text class="label">编号</text><text class="value">{{ form.serialNumber }}</text></view>
  9 + <view class="row"><text class="label">区域</text><text class="value">{{ form.region }}</text></view>
  10 + <view class="row"><text class="label">企业类型</text><text class="value">{{ getDicName('ENTERPRISE_TYPE',
  11 + form.enterpriseType, enterpriseTypeOptions) }}</text></view>
  12 + <view class="row"><text class="label">登记日期</text><text class="value">{{ form.registerDate }}</text></view>
  13 + </view>
  14 +
  15 + <view class="title-header">
  16 + <image class="title-header_icon" src="/static/images/title.png" />
  17 + <span>基础资料</span>
  18 + </view>
  19 + <view class="section">
  20 + <view class="row"><text class="label">企业性质</text><text class="value">{{ form.companyNature }}</text></view>
  21 + <view class="row"><text class="label">单位地址</text><text class="value">{{ form.companyAddress }}</text></view>
  22 + <view class="row"><text class="label">注册资本</text><text class="value">{{ form.registeredCapital }} 万元</text>
  23 + </view>
  24 + <view class="row"><text class="label">账号</text><text class="value">{{ form.bankAccount }}</text></view>
  25 + <view class="row"><text class="label">账开户行</text><text class="value">{{ form.bankName }}</text></view>
  26 + <view class="row"><text class="label">税号</text><text class="value">{{ form.taxNumber }}</text></view>
  27 + <view class="row"><text class="label">注册时间</text><text class="value">{{ form.registrationTime }}</text></view>
  28 + <view class="row"><text class="label">经营年限</text><text class="value">{{ form.businessYears }}</text></view>
  29 + <view class="row"><text class="label">经营范围</text><text class="value">{{ form.businessScope }}</text></view>
  30 + </view>
  31 +
  32 + <!-- 核心人员 -->
  33 + <view class="mgb10">
  34 + <CorePersonnel mode="view" :options="genderOptions" :list="form.corePersonnelList" />
  35 + </view>
  36 +
  37 + <view class="title-header">
  38 + <image class="title-header_icon" src="/static/images/title.png" />
  39 + <span>资产经营情况</span>
  40 + </view>
  41 + <view class="section">
  42 + <view class="row"><text class="label">经营场地属性</text><text class="value">{{ form.businessProperty }}</text>
  43 + </view>
  44 + <view class="row"><text class="label">占地面积</text><text class="value">{{ form.landArea }} 平方米</text></view>
  45 + <view class="row"><text class="label">仓储条件</text><text class="value">{{ form.storageConditions }}</text>
  46 + </view>
  47 + <view class="row"><text class="label">员工人数</text><text class="value">{{ form.employeeCount }}</text></view>
  48 + <view class="row"><text class="label">设备属性</text><text class="value">{{ form.equipmentAttributes }}</text>
  49 + </view>
  50 + <view class="row"><text class="label">资产评估</text><text class="value">{{ form.assetEvaluation }}</text></view>
  51 + <view class="row"><text class="label">上年度销售额</text><text class="value">{{ form.lastYearSales }}</text></view>
  52 + <view class="row"><text class="label">月均销量</text><text class="value">{{ form.monthlyAvgSales }}</text></view>
  53 + </view>
  54 +
  55 + <view class="title-header">
  56 + <image class="title-header_icon" src="/static/images/title.png" />
  57 + <span>与我司合作</span>
  58 + </view>
  59 + <view class="section">
  60 + <view class="row"><text class="label">与我司合作时间</text><text class="value">{{ form.cooperationStartDate }}</text>
  61 + </view>
  62 + <view class="row"><text class="label">月均操作量</text><text class="value">{{ form.monthlyAvgVolume }}</text>
  63 + </view>
  64 + <view class="row"><text class="label">是否口头协议操作</text><text class="value">{{ form.isVerbalAgreement }}</text>
  65 + </view>
  66 + <view class="row"><text class="label">是否签订其他协议</text><text class="value">{{ form.otherAgreements }}</text>
  67 + </view>
  68 + <view class="row"><text class="label">是否签订长年合同</text><text class="value">{{ form.hasLongTermContract }}</text>
  69 + </view>
  70 + <view class="row"><text class="label">合同类型</text><text class="value">{{ form.contractType }}</text></view>
  71 + <view class="row"><text class="label">是否有过中断及原因</text><text class="value">{{ form.hasInterruption }}</text>
  72 + </view>
  73 + </view>
  74 +
  75 + <view class="title-header">
  76 + <image class="title-header_icon" src="/static/images/title.png" />
  77 + <span>办事处意见</span>
  78 + </view>
  79 + <view class="section">
  80 + <view class="row"><text class="label">建议客户分类</text>
  81 + <text class="value">
  82 + <text
  83 + :class="[form.suggestedCategory ? 'category' : '', getCategoryClass(getDicName('CUSTOMER_CATEGORY', form.suggestedCategory, categoryOptions))]">{{
  84 + getDicName('CUSTOMER_CATEGORY', form.suggestedCategory, categoryOptions) }}</text>
  85 + </text>
  86 + </view>
  87 + <view class="row"><text class="label">授信额度</text><text class="value">{{ form.creditLimit }} 万元</text></view>
  88 + <view class="row"><text class="label">结算期限</text><text class="value">{{ form.settlementPeriod }}</text></view>
  89 + <view class="row"><text class="label">加工操作方案</text><text class="value">{{ form.materialSupplyPlan }}</text>
  90 + </view>
  91 + <view class="row"><text class="label">调查人</text><text class="value">{{ form.investigatorName }}</text></view>
  92 + <view class="row"><text class="label">审核主管</text><text class="value">{{ form.supervisorReviewName }}</text>
  93 + </view>
  94 + </view>
  95 +
  96 + <view class="title-header">
  97 + <image class="title-header_icon" src="/static/images/title.png" />
  98 + <span>职能核对</span>
  99 + </view>
  100 + <view class="section">
  101 + <view class="row"><text class="label">年度总销量</text><text class="value">{{ form.annualTotalSales }}</text>
  102 + </view>
  103 + <view class="row"><text class="label">主要行业</text><text class="value">{{ form.mainIndustry }}</text></view>
  104 + <view class="row"><text class="label">年度款料概况</text><text class="value">{{ form.annualMaterialOverview
  105 + }}</text></view>
  106 + </view>
  107 +
  108 + <view class="title-header">
  109 + <image class="title-header_icon" src="/static/images/title.png" />
  110 + <span>公司评审</span>
  111 + </view>
  112 + <view class="section">
  113 + <view class="row"><text class="label">客户分类</text>
  114 + <text class="value">
  115 + <text
  116 + :class="[form.companySuggestedCategory ? 'category' : '', getCategoryClass(getDicName('CUSTOMER_CATEGORY', form.companySuggestedCategory, categoryOptions))]">{{
  117 + getDicName('CUSTOMER_CATEGORY', form.companySuggestedCategory, categoryOptions) }}</text>
  118 + </text>
  119 + </view>
  120 +
  121 + <view class="row"><text class="label">授信额度</text><text class="value">{{ form.companyCreditLimit }} 万元</text>
  122 + </view>
  123 + <view class="row"><text class="label">结算期限</text><text class="value">{{ form.companySettlementPeriod }}</text>
  124 + </view>
  125 + <view class="row"><text class="label">加工操作方案</text><text class="value">{{ form.companyMaterialSupplyPlan
  126 + }}</text></view>
  127 + <view class="row"><text class="label">复核人</text><text class="value">{{ form.reviewerName }}</text></view>
  128 + <view class="row"><text class="label">审批人</text><text class="value">{{ form.approverName }}</text></view>
  129 + </view>
  130 +
  131 +
  132 + </view>
  133 + </scroll-view>
  134 + </view>
  135 +</template>
  136 +
  137 +<script>
  138 +import { getDetailApi } from '@/api/credit_manage.js'
  139 +import { getDicName } from '@/utils/dic.js'
  140 +import { getDicByCodeApi } from '@/api/base.js'
  141 +import CorePersonnel from './corePersonnel.vue'
  142 +
  143 +export default {
  144 + name: 'CreditManageDetail',
  145 + components: { CorePersonnel },
  146 + data() {
  147 + return {
  148 + form: {},
  149 + enterpriseTypeOptions: [],
  150 + genderOptions: [],
  151 + categoryOptions: [],
  152 + }
  153 + },
  154 + computed: {
  155 + },
  156 + created() {
  157 + this.loadEnterpriseTypeOptions()
  158 + this.loadGenderOptions()
  159 + this.loadCategoryOptions()
  160 + },
  161 + onLoad(query) {
  162 + const id = (query && (query.id || query.code)) || ''
  163 + if (id) this.loadDetail(id)
  164 + },
  165 + methods: {
  166 + async loadDetail(id) {
  167 + try {
  168 + const res = await getDetailApi(id)
  169 + const data = res.data || {}
  170 + this.form = { ...data }
  171 + } catch (e) {
  172 + this.form = {}
  173 + }
  174 + },
  175 + async loadEnterpriseTypeOptions() {
  176 + try {
  177 + const res = await getDicByCodeApi('ENTERPRISE_TYPE')
  178 + const list = res.data || []
  179 + this.enterpriseTypeOptions = Array.isArray(list) ? list : []
  180 + } catch (e) {
  181 + this.enterpriseTypeOptions = []
  182 + }
  183 + },
  184 + async loadGenderOptions() {
  185 + try {
  186 + const res = await getDicByCodeApi('GENDER_TYPE')
  187 + const list = res.data || []
  188 + this.genderOptions = Array.isArray(list) ? list : []
  189 + } catch (e) {
  190 + this.genderOptions = []
  191 + }
  192 + },
  193 + async loadCategoryOptions() {
  194 + try {
  195 + const res = await getDicByCodeApi('CUSTOMER_CATEGORY')
  196 + const list = res.data || []
  197 + this.categoryOptions = Array.isArray(list) ? list : []
  198 + } catch (e) {
  199 + this.categoryOptions = []
  200 + }
  201 + },
  202 + getDicName,
  203 + getCategoryClass(categoryName) {
  204 + if (!categoryName) return ''
  205 + if (categoryName.includes('A') || categoryName.includes('a')) {
  206 + return 'category_A'
  207 + } else if (categoryName.includes('B') || categoryName.includes('b')) {
  208 + return 'category_B'
  209 + } else if (categoryName.includes('C') || categoryName.includes('c')) {
  210 + return 'category_C'
  211 + } else if (categoryName.includes('D') || categoryName.includes('d')) {
  212 + return 'category_D'
  213 + }
  214 + },
  215 + }
  216 +}
  217 +</script>
  218 +
  219 +<style lang="scss" scoped>
  220 +.page {
  221 + display: flex;
  222 + flex-direction: column;
  223 + height: 100%;
  224 +}
  225 +
  226 +.scroll {
  227 + flex: 1;
  228 + padding: 8rpx 0 144rpx 0;
  229 +}
  230 +
  231 +.detail-page {
  232 + background: #f3f3f3;
  233 +}
  234 +
  235 +.section {
  236 + padding: 0 32rpx 32rpx;
  237 + background: #fff;
  238 + margin-bottom: 20rpx;
  239 + position: relative;
  240 +
  241 + .status {
  242 + position: absolute;
  243 + top: 16rpx;
  244 + right: 52rpx;
  245 + width: 180rpx;
  246 + height: 146rpx;
  247 + background-repeat: no-repeat;
  248 + background-size: 100% 100%;
  249 + background-position: center;
  250 +
  251 + &_AUDIT {
  252 + background-image: url('~@/static/images/dev_manage/status_1.png');
  253 + }
  254 +
  255 + &_PASS {
  256 + background-image: url('~@/static/images/dev_manage/status_2.png');
  257 + }
  258 +
  259 + &_REFUSE {
  260 + background-image: url('~@/static/images/dev_manage/status_3.png');
  261 + }
  262 +
  263 + &_CANCEL {
  264 + background-image: url('~@/static/images/dev_manage/status_4.png');
  265 + }
  266 + }
  267 +}
  268 +
  269 +.mgb10 {
  270 + margin-bottom: 20rpx;
  271 +}
  272 +
  273 +.row {
  274 + display: flex;
  275 + margin-bottom: 28rpx;
  276 +
  277 + &:last-child {
  278 + margin-bottom: 0;
  279 + }
  280 +
  281 + &.company {
  282 + font-size: 36rpx;
  283 + font-weight: 600;
  284 + color: rgba(0, 0, 0, 0.9);
  285 + padding-top: 32rpx;
  286 + line-height: 50rpx;
  287 + }
  288 +
  289 + .label {
  290 + width: 180rpx;
  291 + line-height: 32rpx;
  292 + font-size: 28rpx;
  293 + color: rgba(0, 0, 0, 0.6);
  294 + }
  295 +
  296 + .value {
  297 + flex: 1;
  298 + line-height: 32rpx;
  299 + font-size: 28rpx;
  300 + color: rgba(0, 0, 0, 0.9);
  301 + text-align: right;
  302 +
  303 + .category {
  304 + display: inline-block;
  305 + padding: 4rpx 12rpx;
  306 + border-radius: 6rpx;
  307 + font-size: 24rpx;
  308 + width: auto;
  309 +
  310 + &.category_A {
  311 + background: #FFF0ED;
  312 + color: #D54941;
  313 + }
  314 +
  315 + &.category_B {
  316 + background: #FFF1E9;
  317 + color: #E37318;
  318 + }
  319 +
  320 + &.category_C {
  321 + background: #F2F3FF;
  322 + color: $theme-primary;
  323 + }
  324 +
  325 + &.category_D {
  326 + background: #E3F9E9;
  327 + color: #2BA471;
  328 + }
  329 + }
  330 + }
  331 +}
  332 +
  333 +.card {
  334 + padding: 16rpx 0 8rpx;
  335 + border-top: 1rpx solid #f0f0f0;
  336 +}
  337 +
  338 +.title-header {
  339 + background-color: #fff;
  340 + display: flex;
  341 + align-items: center;
  342 + padding: 32rpx 32rpx 22rpx;
  343 +
  344 + &_icon {
  345 + width: 32rpx;
  346 + height: 28rpx;
  347 + margin-right: 16rpx;
  348 + margin-top: 8rpx;
  349 + }
  350 +
  351 + span {
  352 + color: rgba(0, 0, 0, 0.9);
  353 + font-size: 32rpx;
  354 + line-height: 44rpx;
  355 + font-weight: 600;
  356 + }
  357 +}
  358 +</style>
\ No newline at end of file
... ...