Browse Source

refactor(market): 优化线索页面布局和代码结构

-调整了卡片组件的样式和布局
- 优化了代码格式,提高了代码可读性- 统一了样式单位,使用 rpx 替代 px- 移除了冗余的空行和不必要的换行符
master
liutong 1 year ago
parent
commit
083f8dc7a2
  1. 62
      pages/market/clue/index.vue

62
pages/market/clue/index.vue

@ -1,17 +1,26 @@
<template> <template>
<view class="assemble"> <view class="assemble">
<fui-segmented-control :values="values" type="text" activeColor="#29d3b4" color="#fff" @click="segmented"></fui-segmented-control> <fui-segmented-control :values="values" type="text" activeColor="#29d3b4" color="#fff"
@click="segmented"></fui-segmented-control>
<view class="search"> <view class="search">
<view :class="{'selected': select_type === 1, 'not-selected': select_type !== 1}" @click="getSelect(1)">全部(320)</view> <view :class="{'selected': select_type === 1, 'not-selected': select_type !== 1}" @click="getSelect(1)">全部(320)
<view :class="{'selected': select_type === 2, 'not-selected': select_type !== 2}" @click="getSelect(2)">待跟进(8)</view> </view>
<view :class="{'selected': select_type === 3, 'not-selected': select_type !== 3}" @click="getSelect(3)">7天未跟进(15)</view> <view :class="{'selected': select_type === 2, 'not-selected': select_type !== 2}" @click="getSelect(2)">待跟进(8)
<view :class="{'selected': select_type === 4, 'not-selected': select_type !== 4}" @click="getSelect(4)">30天未成交(12)</view> </view>
<view :class="{'selected': select_type === 3, 'not-selected': select_type !== 3}" @click="getSelect(3)">
7天未跟进(15)
</view>
<view :class="{'selected': select_type === 4, 'not-selected': select_type !== 4}" @click="getSelect(4)">
30天未成交(12)
</view>
</view> </view>
<view v-if="segmented_type == 1"> <view v-if="segmented_type == 1">
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -40,7 +49,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -69,7 +80,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -98,7 +111,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -127,7 +142,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -161,7 +178,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -189,7 +208,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -217,7 +238,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -245,7 +268,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -273,7 +298,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -301,7 +328,9 @@
<view class="card"> <view class="card">
<view style="width: 70%;" @click="clue_info"> <view style="width: 70%;" @click="clue_info">
<view style="display: flex;align-items: center;padding: 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx;">
<view><image src="@/static/images/index/myk.png" class="card-image"></image></view> <view>
<image src="@/static/images/index/myk.png" class="card-image"></image>
</view>
<view class="card-text">包子皮</view> <view class="card-text">包子皮</view>
<view class="card-label">试听</view> <view class="card-label">试听</view>
</view> </view>
@ -334,6 +363,7 @@
<script> <script>
import AQTabber from "@/components/AQ/AQTabber.vue" import AQTabber from "@/components/AQ/AQTabber.vue"
export default { export default {
components: { components: {
AQTabber, AQTabber,

Loading…
Cancel
Save