|
@@ -5,9 +5,10 @@
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
import Card from '@/components/card.vue'
|
|
import Card from '@/components/card.vue'
|
|
import SectionHeading from '@/components/section-heading.vue'
|
|
import SectionHeading from '@/components/section-heading.vue'
|
|
-import { abc, calculator, treaty } from '@/core/libs/pngs'
|
|
|
|
-import { getMaterialDealers } from '@/core/libs/requests'
|
|
|
|
-import { materialDealers, close, phone } from '@/core/libs/svgs'
|
|
|
|
|
|
+import { abc, calculator } from '../../core/libs/pngs'
|
|
|
|
+import { getMaterialDealers } from '../../core/libs/requests'
|
|
|
|
+import { materialDealers, close, phone } from '../../core/libs/svgs'
|
|
|
|
+import CardMenu from '@/components/card-menu.vue'
|
|
|
|
|
|
const { data, run } = useRequest(getMaterialDealers)
|
|
const { data, run } = useRequest(getMaterialDealers)
|
|
const dealerPanelState = ref(false)
|
|
const dealerPanelState = ref(false)
|
|
@@ -16,23 +17,21 @@ const pieces = ref([
|
|
title: '材料小课堂',
|
|
title: '材料小课堂',
|
|
desc: '全方位了解',
|
|
desc: '全方位了解',
|
|
icon: abc,
|
|
icon: abc,
|
|
- class: 'col-start-1 row-start-1',
|
|
|
|
- // iconSize: 102,
|
|
|
|
|
|
+ gridItemClass: 'col-start-1 row-start-1',
|
|
|
|
+ path: '/pages/material/mini-class/index',
|
|
},
|
|
},
|
|
{
|
|
{
|
|
title: '积分计算机',
|
|
title: '积分计算机',
|
|
desc: '积分小帮手',
|
|
desc: '积分小帮手',
|
|
icon: calculator,
|
|
icon: calculator,
|
|
- class: 'col-start-2 row-start-1',
|
|
|
|
|
|
+ gridItemClass: 'col-start-2 row-start-1',
|
|
path: '/pages/material/calculator/index',
|
|
path: '/pages/material/calculator/index',
|
|
- // iconSize: 68,
|
|
|
|
},
|
|
},
|
|
{
|
|
{
|
|
title: '推荐材料商',
|
|
title: '推荐材料商',
|
|
desc: '我们将优先洽谈大家推荐的材料商',
|
|
desc: '我们将优先洽谈大家推荐的材料商',
|
|
icon: materialDealers,
|
|
icon: materialDealers,
|
|
- class: 'col-start-1 row-start-2 col-end-3',
|
|
|
|
- // iconSize: 44,
|
|
|
|
|
|
+ gridItemClass: 'col-start-1 col-end-3 row-start-2',
|
|
isMore: true,
|
|
isMore: true,
|
|
path: '/pages/material/recommend/index',
|
|
path: '/pages/material/recommend/index',
|
|
},
|
|
},
|
|
@@ -63,38 +62,36 @@ onMounted(() => {
|
|
</view>
|
|
</view>
|
|
</div> -->
|
|
</div> -->
|
|
</view>
|
|
</view>
|
|
-
|
|
|
|
<view class="bg-[#f6f6f6] relative bottom-4 rounded-t-2xl py-1">
|
|
<view class="bg-[#f6f6f6] relative bottom-4 rounded-t-2xl py-1">
|
|
- <div class="my-6 grid grid-gap-2.5 mx-3.5">
|
|
|
|
|
|
+ <div class="my-6 grid grid-cols-2 grid-gap-2.5 mx-3.5">
|
|
<template v-for="it of pieces" :key="it.title">
|
|
<template v-for="it of pieces" :key="it.title">
|
|
- <card
|
|
|
|
- :custom-class="[it.class, 'flex justify-between items-center'].join(' ')"
|
|
|
|
- @click="handleMenuItemClick(it)"
|
|
|
|
- >
|
|
|
|
- <view class="flex items-end justify-end">
|
|
|
|
- <wd-img :src="it.icon" :width="42" :height="42"></wd-img>
|
|
|
|
- </view>
|
|
|
|
- <div class="flex-1 flex flex-col justify-around h-full">
|
|
|
|
- <div
|
|
|
|
- class="text-black/80 text-base font-normal font-['PingFang SC'] leading-[10.18px]"
|
|
|
|
- >
|
|
|
|
- {{ it.title }}
|
|
|
|
|
|
+ <div :class="it.gridItemClass" @click="handleMenuItemClick(it)">
|
|
|
|
+ <card custom-class="flex justify-between items-center">
|
|
|
|
+ <view class="flex items-end justify-end">
|
|
|
|
+ <wd-img :src="it.icon" :width="42" :height="42"></wd-img>
|
|
|
|
+ </view>
|
|
|
|
+ <div class="flex-1 flex flex-col justify-around h-full">
|
|
|
|
+ <div
|
|
|
|
+ class="text-black/80 text-base font-normal font-['PingFang SC'] leading-[10.18px]"
|
|
|
|
+ >
|
|
|
|
+ {{ it.title }}
|
|
|
|
+ </div>
|
|
|
|
+ <div
|
|
|
|
+ class="mt-1 text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal"
|
|
|
|
+ >
|
|
|
|
+ {{ it.desc }}
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
- <div
|
|
|
|
- class="mt-1 text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal"
|
|
|
|
- >
|
|
|
|
- {{ it.desc }}
|
|
|
|
|
|
+ <div v-if="it.isMore" class="mr--4">
|
|
|
|
+ <wd-button
|
|
|
|
+ custom-class="text-black/40!"
|
|
|
|
+ type="icon"
|
|
|
|
+ icon="arrow-right"
|
|
|
|
+ icon-color=""
|
|
|
|
+ ></wd-button>
|
|
</div>
|
|
</div>
|
|
- </div>
|
|
|
|
- <div v-if="it.isMore" class="mr--4">
|
|
|
|
- <wd-button
|
|
|
|
- custom-class="text-black/40!"
|
|
|
|
- type="icon"
|
|
|
|
- icon="arrow-right"
|
|
|
|
- icon-color=""
|
|
|
|
- ></wd-button>
|
|
|
|
- </div>
|
|
|
|
- </card>
|
|
|
|
|
|
+ </card>
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
<SectionHeading title="自营品牌" custom-class="mx-3.5"></SectionHeading>
|
|
<SectionHeading title="自营品牌" custom-class="mx-3.5"></SectionHeading>
|