designer-hub/packages/merchant/src/pages/agent/designer/archives/activity/others/index.vue

<route lang="json">
{ "style": { "navigationBarTitleText": "其他活动信息", "navigationBarBackgroundColor": "#fff" } }
</route>
<script setup lang="ts">
import {
  deleteOtherSales,
  deleteDesignerEvent,
  getDesignerEvents,
  createDesignerEvent,
  updateDesignerEvent,
} from '@/core/libs/agent-requests'
import Card from '@/components/card.vue'
import PageHelperEvo from '@/components/page-helper-evo.vue'
import BottomAppBar from '@/components/bottom-app-bar.vue'
import DataForm from '@/components/data-form.vue'
import { DataFormSchema } from '@/components/data-form'
import { DesignerEvent, DesignerOrderSaleOther } from '@designer-hub/app/src/core/libs/models'
import { ComponentExposed } from 'vue-component-type-helpers'
import { requestToast } from '@designer-hub/app/src/core/utils/common'
import { messages } from '@/core/libs/messages'
import dayjs from 'dayjs'

const id = ref()
const actionSheetStatus = ref(false)
const formData = ref({})
const schema = ref<DataFormSchema<Omit<DesignerEvent, 'id' | 'createTime'  | 'userId'>>>({
  applyTime: {
    type: 'TimePick',
    label: messages.objects.designerEvent.applyTime,
    required: true,
    props: {
      defaultValue: new Date(),
      type: 'date',
    },
  },
  name: {
    type: 'TextField',
    label: messages.objects.designerEvent.name,
    required: true,
  },
})
const rules = ref({
  applyTime: [
    {
      required: true,
      message: '请选择活动时间',
    },
  ],
  name: [{ required: true, message: '请输入活动名称' }],
})
const formRef = ref<ComponentExposed<typeof DataForm>>()
const pageHelperRef = ref<ComponentExposed<typeof PageHelperEvo>>()
const query = computed(() => ({ userId: id.value, type: 3 }))
const handleSubmit = async () => {
  const { valid } = await formRef.value!.validate()
  if (!valid) return
  if (Object.keys(formData.value).includes('id')) {
    await requestToast(() => updateDesignerEvent(formData.value), {
      success: true,
      successTitle: '保存成功',
    })
  } else {
    await requestToast(
      () =>
        createDesignerEvent({
          ...formData.value,
          userId: Number(id.value),
        }),
      { success: true, successTitle: '保存成功' },
    )
  }
  actionSheetStatus.value = false
  formData.value = {}
  await pageHelperRef.value?.reload()
}
const handleEdit = (item: DesignerEvent) => {
  formData.value = item
  console.log(formData.value,"formData.value")
  actionSheetStatus.value = true
}
const handleDelete = async (item: DesignerEvent) => {
  await requestToast(() => deleteDesignerEvent(item.id), {
    success: true,
    successTitle: '删除成功',
  })
  await pageHelperRef.value?.reload()
}
onLoad((query?: Record<string | 'id', string>) => {
  id.value = query?.id
})
</script>

<template>
  <div class="flex-grow flex flex-col">
    <div class="mt-4 bg-white flex-grow">
      <PageHelperEvo
        ref="pageHelperRef"
        :request="getDesignerEvents"
        :query="query"
        class="flex-grow"
      >
        <template #default="{ source }">
          <div class="flex flex-col gap-4 p-8.75">
            <template v-for="(it, index) in source?.list" :key="index">
              <div>
                <div
                  class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed"
                >
                  {{ it.name }}
                </div>
                <div class="flex items-center justify-between">
                  <div
                    class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-relaxed"
                  >
                    参加日期：
                    {{ dayjs(it.applyTime).format('YYYY/MM/DD') }}
                  </div>
                  <div class="flex gap-6">
                    <wd-button type="text" :round="false" size="small" @click="handleEdit(it)">
                      编辑
                    </wd-button>
                    <wd-button type="text" :round="false" size="small" @click="handleDelete(it)">
                      删除
                    </wd-button>
                  </div>
                </div>
              </div>
              <!--              <div class="grid grid-cols-[90px_1fr] gap-2.5">-->
              <!--                <template-->
              <!--                  v-for="(item, i) in [-->
              <!--                    { label: '材料商', value: it.supplierName },-->
              <!--                    { label: '品牌', value: it.brandName },-->
              <!--                    { label: '项目名称', value: it.projectName },-->
              <!--                    { label: '客户姓名', value: it.customerName },-->
              <!--                    { label: '客户电话', value: it.customerPhone },-->
              <!--                    { label: '订单金额', value: it.orderAmount + '元' },-->
              <!--                  ]"-->
              <!--                  :key="i"-->
              <!--                >-->
              <!--                  <div class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-none">-->
              <!--                    {{ item.label }}-->
              <!--                  </div>-->
              <!--                  <div class="text-black/60 text-sm font-normal font-['PingFang_SC'] leading-none">-->
              <!--                    {{ item.value }}-->
              <!--                  </div>-->
              <!--                </template>-->
              <!--              </div>-->
              <!--              <div class="bg-[#f4f4f4] h-.25 my-4"></div>-->
              <!--              <div class="flex justify-between">-->
              <!--                <div class="text-black/60 text-sm font-normal font-['PingFang_SC'] leading-normal">-->
              <!--                  {{ dayjs(it.createTime).format('YYYY-MM-DD HH:mm') }}-->
              <!--                </div>-->
              <!--              </div>-->
            </template>
          </div>
        </template>
      </PageHelperEvo>
    </div>
    <div class="py-2 bg-[#f0f4ff]">
      <div
        class="text-center text-[#2357e9] text-xs font-normal font-['PingFang_SC'] leading-normal"
      >
        其他活动不参与线上活动统计
      </div>
    </div>
    <BottomAppBar fixed placeholder>
      <div class="w-full">
        <wd-button block :round="false" @click="((actionSheetStatus = true), (formData = {}))">
          添加
        </wd-button>
      </div>
    </BottomAppBar>
    <wd-action-sheet v-model="actionSheetStatus">
      <div class="p-4">
        <DataForm
          ref="formRef"
          :rules="rules"
          :schema="schema"
          :direction="'horizontal'"
          v-model="formData"
        ></DataForm>
        <wd-button :round="false" block @click="handleSubmit">保存</wd-button>
      </div>
    </wd-action-sheet>
  </div>
</template>

<style scoped lang="scss"></style>