8312273696
Standardize Tailwind CSS usage across the codebase: replace legacy shorthand utilities with modern syntax, update color classes to use bracket notation, fix margin/padding units, delete unused CreateServiceOrder SCSS stylesheet and image asset, and resolve minor style inconsistencies.
53 lines
1.4 KiB
Vue
53 lines
1.4 KiB
Vue
<template>
|
|
<div class="faq-help-card bg-white rounded-[24px] w-full">
|
|
<div class="faq-help-card__header flex items-center">
|
|
<div class="faq-help-card__icon flex items-center justify-center rounded-full text-[16px] font-bold">
|
|
{{ data.icon }}
|
|
</div>
|
|
<div class="faq-help-card__title text-[#1e293b] font-size-20 font-bold">
|
|
{{ data.title }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="faq-help-card__divider"></div>
|
|
|
|
<div class="faq-help-card__list">
|
|
<div v-for="item in questions" :key="item.id || item.text" class="faq-help-card__item flex items-center"
|
|
:class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
|
|
<div class="faq-help-card__question color-475569 text-[18px] font-bold truncate flex-1">
|
|
{{ item.text }}
|
|
</div>
|
|
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed } from "vue";
|
|
|
|
const props = defineProps({
|
|
data: {
|
|
type: Object,
|
|
default: () => ({}),
|
|
},
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(["select"]);
|
|
|
|
const questions = computed(() => props.data.questions || []);
|
|
|
|
const handleSelect = (item) => {
|
|
if (props.disabled) return;
|
|
emit("select", item);
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "./styles/index.scss";
|
|
</style>
|