|
@@ -0,0 +1,177 @@
|
|
|
+<route lang="json">
|
|
|
+{ "style": { "navigationBarTitleText": "关联视频号", "navigationBarBackgroundColor": "#fff" } }
|
|
|
+</route>
|
|
|
+<script setup lang="ts">
|
|
|
+import Card from '@/components/card.vue'
|
|
|
+import SectionHeading from '@/components/section-heading.vue'
|
|
|
+import { getDesignerInfo, updateDesignerInfo } from '../../../../core/libs/requests'
|
|
|
+import { useUserStore } from '../../../../store'
|
|
|
+import { storeToRefs } from 'pinia'
|
|
|
+import { pick } from 'radash'
|
|
|
+import { requestToast } from '../../../../core/utils/common'
|
|
|
+import UploadEvo from '@/components/upload-evo.vue'
|
|
|
+import BottomAppBar from '@/components/bottom-app-bar.vue'
|
|
|
+
|
|
|
+const userStore = useUserStore()
|
|
|
+const { userInfo } = storeToRefs(userStore)
|
|
|
+const form = ref<{
|
|
|
+ userId?: number
|
|
|
+ // serviceYears?: number | string
|
|
|
+ // homePageUrl?: string
|
|
|
+ // sharePageUrl?: string
|
|
|
+ // designDesc?: string
|
|
|
+ // designFee?: string
|
|
|
+ // personalIdentity?: string
|
|
|
+ // serviceCustomerCount?: number
|
|
|
+ videoNumber?: string
|
|
|
+}>()
|
|
|
+const { data, run: setData } = useRequest(() => getDesignerInfo(userInfo.value.userId))
|
|
|
+const { loading, run: submiting } = useRequest(() => updateDesignerInfo(form.value))
|
|
|
+const handleSubmit = async () => {
|
|
|
+ await requestToast(submiting, {
|
|
|
+ success: true,
|
|
|
+ successTitle: '关联成功',
|
|
|
+ }).then(() => setData())
|
|
|
+}
|
|
|
+onMounted(async () => {
|
|
|
+ await setData()
|
|
|
+ form.value = pick(data.value, [
|
|
|
+ 'id',
|
|
|
+ 'userId',
|
|
|
+ // 'homePageUrl',
|
|
|
+ // 'serviceYears',
|
|
|
+ // 'sharePageUrl',
|
|
|
+ // 'designDesc',
|
|
|
+ // 'designFee',
|
|
|
+ // 'personalIdentity',
|
|
|
+ // 'serviceCustomerCount',
|
|
|
+ 'videoNumber',
|
|
|
+ ])
|
|
|
+})
|
|
|
+</script>
|
|
|
+<template>
|
|
|
+ <div class="flex-grow flex flex-col gap-5 px-3.5 py-6 bg-white">
|
|
|
+ <SectionHeading title="如何关联视频号?" size="sm"></SectionHeading>
|
|
|
+ <img class="w-[347px] h-[186px] rounded-2xl" src="https://via.placeholder.com/347x186" />
|
|
|
+ <SectionHeading title="视频号ID" size="sm"></SectionHeading>
|
|
|
+ <div class="bg-[#f6f6f6] rounded-lg px-3.5 py-2.5">
|
|
|
+ <wd-input
|
|
|
+ v-model="form.videoNumber"
|
|
|
+ placeholder="请输入视频号ID"
|
|
|
+ no-border
|
|
|
+ custom-class="bg-[#f6f6f6]!"
|
|
|
+ ></wd-input>
|
|
|
+ </div>
|
|
|
+ <BottomAppBar fixed :border="false">
|
|
|
+ <div>
|
|
|
+ <div class="text-center mb-5.5">
|
|
|
+ <span class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-tight">
|
|
|
+ 点击确认关联即表示同意
|
|
|
+ </span>
|
|
|
+ <span class="text-[#0cbe7c] text-xs font-normal font-['PingFang SC'] leading-tight">
|
|
|
+ 《个人微信视频号授权使用协议》
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <wd-button :round="false" block :loading="loading" @click="handleSubmit">
|
|
|
+ 确定关联
|
|
|
+ </wd-button>
|
|
|
+ </div>
|
|
|
+ </BottomAppBar>
|
|
|
+ <!-- <template v-if="form">
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="主页封面图"></SectionHeading>
|
|
|
+ <div
|
|
|
+ class="mt-4.5 mb-2.5 text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug"
|
|
|
+ >
|
|
|
+ 用于主页形象封面图,请上传体现个人艺术设计风格的图片,建议竖图尺寸750x1920,也可上传自己的视频介绍
|
|
|
+ </div>
|
|
|
+ <UploadEvo v-model="form.homePageUrl"></UploadEvo>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="分享封面图"></SectionHeading>
|
|
|
+ <div
|
|
|
+ class="mt-4.5 mb-2.5 text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug"
|
|
|
+ >
|
|
|
+ 用于分享到微信好友的卡片封面图,尺寸1920x1080;
|
|
|
+ </div>
|
|
|
+ <UploadEvo v-model="form.sharePageUrl"></UploadEvo>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <SectionHeading title="个人信息"></SectionHeading>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="设计理念" subtitle="请输入设计理念"></SectionHeading>
|
|
|
+ <div
|
|
|
+ class="mt-4.5 mx--3.5 text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug"
|
|
|
+ >
|
|
|
+ <wd-textarea
|
|
|
+ placeholder="例:设计没有风格,设计是对生活的一种诠释,不是所谓的造型与装饰!"
|
|
|
+ v-model="form.designDesc"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="text-end text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug">
|
|
|
+ 0/100
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="个人信息" subtitle="请输入关于自己身份体现"></SectionHeading>
|
|
|
+ <div
|
|
|
+ class="mt-4.5 mx--3.5 text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug"
|
|
|
+ >
|
|
|
+ <wd-textarea
|
|
|
+ placeholder="例:中国室内装饰协会会员、 xxx 空间设计事务所创始人、筑巢奖金奖设计师等等"
|
|
|
+ v-model="form.personalIdentity"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="text-end text-black/40 text-xs font-normal font-['PingFang_SC'] leading-snug">
|
|
|
+ 0/100
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="设计费">
|
|
|
+ <template #append>
|
|
|
+ <div class="flex">
|
|
|
+ <wd-input no-border v-model="form.designFee"></wd-input>
|
|
|
+ <div
|
|
|
+ class="text-black/40 text-base font-normal font-['PingFang_SC'] leading-relaxed"
|
|
|
+ >
|
|
|
+ 元/㎡
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </SectionHeading>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="服务客户数">
|
|
|
+ <template #append>
|
|
|
+ <wd-input
|
|
|
+ placeholder="请输入真实客户数"
|
|
|
+ no-border
|
|
|
+ v-model="form.serviceCustomerCount"
|
|
|
+ ></wd-input>
|
|
|
+ </template>
|
|
|
+ </SectionHeading>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div>
|
|
|
+ <SectionHeading title="从业年限">
|
|
|
+ <template #append>
|
|
|
+ <wd-input placeholder="请输入年限" no-border v-model="form.serviceYears"></wd-input>
|
|
|
+ </template>
|
|
|
+ </SectionHeading>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <div class=""><wd-button block :round="false" @click="handleSubmit">保存</wd-button></div>
|
|
|
+ </template> -->
|
|
|
+ </div>
|
|
|
+</template>
|