You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
75 lines
2.7 KiB
75 lines
2.7 KiB
<template>
|
|
<div
|
|
class="flex flex-wrap pt-6 pl-6 pr-[6px] gap-x-8 relative w-[436px] h-[440px] rounded-xl bg-white shadow-[0px_4px_10px_0px_rgba(0,0,0,0.06)]"
|
|
>
|
|
<div class="flex-1 shrink-0 justify-between">
|
|
<div class="flex items-center text-justify text-[#808080] text-16 font-normal leading-[18px] mb-2">
|
|
<div class="flex-center mr-3 w-6 h-6 bg-[#B60081] rounded-xl">
|
|
<img src="../../assets/images/q.svg" class="w-3 h-5" alt="" />
|
|
</div>
|
|
{{ formatDate(customer.addTime) }}
|
|
</div>
|
|
<ScrollView class="relative h-[355px]" scrollbar :list="customer.suggestionContent">
|
|
<div class="text-black/50 text-20 font-normal leading-normal pr-[14px] pb-10 break-all">
|
|
<div v-html="customer.suggestionContent"></div>
|
|
</div>
|
|
</ScrollView>
|
|
</div>
|
|
<div class="flex-1 shrink-0">
|
|
<div class="flex items-center text-justify text-[#333] text-16 font-normal leading-[18px] mb-2">
|
|
<div class="flex-center mr-3 w-6 h-6 rounded-xl bg-[#F5F5F5] border border-solid border-[#808080]">
|
|
<img src="../../assets/images/a.svg" class="w-3 h-5" alt="" />
|
|
</div>
|
|
{{ formatDate(customer.updateTime) }}
|
|
</div>
|
|
<ScrollView class="relative h-[356px]" scrollbar observe-image :list="customer.replyContent">
|
|
<div class="text-[##333333] text-20 font-normal leading-normal break-all pr-2">
|
|
<div class="mb-2" v-html="customer.replyContent"></div>
|
|
<div v-if="customer.sign" class="text-[#333] text-16">店铺店长: {{ customer.sign }}</div>
|
|
<div class="flex items-center text-[#333] text-16 pt-2">
|
|
总经理: 能岛拓也
|
|
<img src="../../assets/images/manager.svg" class="w-10 h-10 ml-2.5 shrink-0" />
|
|
</div>
|
|
</div>
|
|
</ScrollView>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import ScrollView from '@/base/ScrollView/ScrollView.vue'
|
|
|
|
type Props = {
|
|
customer: Customer
|
|
}
|
|
|
|
withDefaults(defineProps<Props>(), {
|
|
customer: () => ({} as Customer)
|
|
})
|
|
|
|
function formatDate(date: string) {
|
|
if (!date) {
|
|
return
|
|
}
|
|
const newDate = new Date(date)
|
|
const year = newDate.getFullYear()
|
|
const month = String(newDate.getMonth() + 1).padStart(2, '0')
|
|
const week = String(newDate.getDate()).padStart(2, '0')
|
|
return `${year}-${month}-${week} ${newDate.getHours().toString().padStart(2, '0')}:${newDate.getMinutes().toString().padStart(2, '0')}`
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.bscroll-vertical-scrollbar {
|
|
width: 4px !important;
|
|
height: 120px !important;
|
|
background-color: rgb(0 0 0 / 3%) !important;
|
|
opacity: 1 !important;
|
|
}
|
|
.bscroll-indicator {
|
|
width: 4px !important;
|
|
height: 60px !important;
|
|
background-color: rgb(0 0 0 / 6%) !important;
|
|
border: none !important;
|
|
}
|
|
</style>
|
|
|