Add layout shells, desktop views, module-level page caches, and UI fixes for auth, home, wallet, transactions, address, and related pages. Co-authored-by: Cursor <cursoragent@cursor.com>
75 lines
2.5 KiB
Vue
75 lines
2.5 KiB
Vue
<template>
|
|
<div>
|
|
<div
|
|
class="bg-white wrap-fix py-3 px-3 text-primary font-bold drop-shadow flex h-12 z-20 justify-between"
|
|
>
|
|
<div class="flex">
|
|
<div class="cursor-pointer" @click="goBack()">
|
|
<BasicIcon icon="vuesax-linear:arrow-right-1" />
|
|
</div>
|
|
<div class="mr-2">{{ edit_id ? `ویرایش گنج ${name}` : 'صندوق جدید' }}</div>
|
|
</div>
|
|
</div>
|
|
<a-spin :spinning="loading">
|
|
<div class="pt-20 flex flex-col justify-center items-center">
|
|
<div class="bg-sky-100 w-[120px] aspect-square flex justify-center rounded-xl">
|
|
<img :src="itemImg" alt="" />
|
|
</div>
|
|
<div class="flex mt-3 w-full relative px-5" :class="[prefixCls]">
|
|
<van-field
|
|
v-model="name"
|
|
label=""
|
|
class="font-bold"
|
|
placeholder="عنوان را وارد کنید"
|
|
input-align="center"
|
|
:show-word-limit="true"
|
|
maxlength="25"
|
|
rows="1"
|
|
size="small"
|
|
/>
|
|
</div>
|
|
<div class="flex overflow-x-scroll gap-2 whitespace-nowrap max-w-[320px] mt-2 px-3">
|
|
<div
|
|
v-for="item in types"
|
|
:key="item.name"
|
|
class="border-1 px-3 py-2 flex-nowrap rounded text-xs color-transition background-color-transition"
|
|
:class="item.name === name ? 'bg-primary text-white' : 'bg-gray-200 text-gray-600'"
|
|
@click="name = item.name"
|
|
>
|
|
{{ item.name }}
|
|
</div>
|
|
</div>
|
|
<div class="wrap-fix flex justify-center bottom-23 px-5 z-200" @click="ok()">
|
|
<BasicButton class="rounded w-full px-5 py-2 text-center" type="primary" :disabled="loading">
|
|
<a-spin v-if="loading" size="small" />
|
|
<div v-else>{{ edit_id ? 'ویرایش گنج' : 'ساخت گنج' }}</div>
|
|
</BasicButton>
|
|
</div>
|
|
</div>
|
|
</a-spin>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import BasicIcon from '@/components/BasicPacks/BasicIcon.vue'
|
|
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
|
|
import { loading } from '@/utils'
|
|
import { useFundNewPageContext } from '../composables/useFundNewPage'
|
|
|
|
const { types, edit_id, name, prefixCls, itemImg, ok, goBack } = useFundNewPageContext()
|
|
</script>
|
|
|
|
<style lang="less">
|
|
@prefix: ~'@{prefixCls}-input_name';
|
|
|
|
.@{prefix} {
|
|
.van-field__value {
|
|
@apply flex;
|
|
}
|
|
|
|
.van-field__body {
|
|
@apply w-full mr-5;
|
|
}
|
|
}
|
|
</style>
|