CY
/
mcwl-pc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

planet
shenhan000 2025-03-31 14:32:52 +08:00
parent 8044855bbd
commit 5db887bff3
20 changed files with 1607 additions and 1054 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
app/components/Authentication.vue
View File

@ -1,11 +1,11 @@
<script setup lang="ts">
import type { FormItemRule } from "naive-ui";
import { ref } from "vue";
import type { FormItemRule } from 'naive-ui'
import { ref } from 'vue'
const message = useMessage();
const userStore = useUserStore();
const userInfo = userStore.userInfo;
const isVisible = ref(false);
const message = useMessage()
const userStore = useUserStore()
const userInfo = userStore.userInfo
const isVisible = ref(false)
const rules = ref({
name: [
@ -13,13 +13,14 @@ const rules = ref({
required: true,
validator(rule: FormItemRule, value: string) {
if (!value) {
return new Error("请填写姓名");
} else if (!/^[\u4E00-\u9FA5·]{2,16}$/.test(value)) {
return new Error("输入正确的姓名");
return new Error('请填写姓名')
}
return true;
else if (!/^[\u4E00-\u9FA5·]{2,16}$/.test(value)) {
return new Error('输入正确的姓名')
}
return true
},
trigger: "blur",
trigger: 'blur',
},
],
idCard: [
@ -27,29 +28,30 @@ const rules = ref({
required: true,
validator(rule: FormItemRule, value: string) {
if (!value) {
return new Error("请填身份证号");
} else if (
return new Error('请填身份证号')
}
else if (
!/(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}([\dX])$)/i.test(
value
value,
)
) {
return new Error("输入正确的身份证号");
return new Error('输入正确的身份证号')
}
return true;
return true
},
trigger: "blur",
trigger: 'blur',
},
],
});
})
const ruleForm = ref({
name: "",
idCard: "",
name: '',
idCard: '',
userId: userInfo.userId,
});
const formRef = ref(null);
})
const formRef = ref(null)
async function saveInfo(e: MouseEvent) {
e.preventDefault();
e.preventDefault()
formRef.value?.validate(async (errors) => {
if (!errors) {
// try{
@ -65,32 +67,34 @@ async function saveInfo(e: MouseEvent) {
// console.log('err',err)
// }
try {
const res = await request.post("/system/user/updateIdCard", ruleForm.value);
const res = await request.post('/system/user/updateIdCard', ruleForm.value)
if (res.code === 200) {
await userStore.getUserInfo();
isVisible.value = false;
} else {
message.warning(res.msg);
await userStore.getUserInfo()
isVisible.value = false
}
} catch (err) {
console.log(err);
else {
message.warning(res.msg)
}
}
catch (err) {
console.log(err)
}
}
});
})
}
function onCloseModel() {
isVisible.value = false;
ruleForm.value.name = "";
ruleForm.value.idCard = "";
isVisible.value = false
ruleForm.value.name = ''
ruleForm.value.idCard = ''
}
defineExpose({
isVisible,
});
})
// 生命周期钩子
onMounted(() => {
// initFormData()
});
})
</script>
<template>

2
app/components/PictureList.vue
View File

@ -30,7 +30,7 @@
class="mr-2"
size="20"
:color="item.isLike === 0 ? '#ccc' : '#ff0000'"
@click="onLike(item)"
@click.stop="onLike(item)"
>
<Heart />
</n-icon>

4
app/components/WechatLoginQr.vue
View File

@ -33,10 +33,10 @@ async function onGetUUid() {
if (res.code === 200) {
const appid = 'wx0a72f196ec9c3a70'
const { uuid } = res
const redirect_uri = `http://www.mc158c.com/api/wx/uuid/bind/openid?uuid=${uuid}`
const redirect_uri = `http://www.mc158c.com/login-success?uuid=${uuid}`
const codeUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${encodeURIComponent(
redirect_uri,
)}&response_type=code&scope=snsapi_userinfo&state=123456#wechat_redirect`
)}&response_type=code&scope=snsapi_userinfo&state=12345e23436#wechat_redirect`
qrUrl.value = codeUrl
let counter = 1
pollingTimer && clearTimeout(pollingTimer)

272
app/components/publishModel/CreateModels.vue
View File

@ -1,122 +1,117 @@
<script setup lang="ts">
import { commonApi } from '@/api/common';
import type { FormInst } from 'naive-ui';
import { computed, watch } from 'vue';
import { commonApi } from "@/api/common";
import type { FormInst } from "naive-ui";
import { computed, watch } from "vue";
const props = defineProps({
modelValue: {
type: Object,
required: true,
},
})
const emit = defineEmits(['update:modelValue', 'createModelsNext'])
});
const emit = defineEmits(["update:modelValue", "createModelsNext"]);
const localForm = computed({
get() {
return props.modelValue
return props.modelValue;
},
set(value) {
emit('update:modelValue', value)
emit("update:modelValue", value);
},
})
});
const options: any[] = [
]
const options: any[] = [];
watch(
() => localForm.value,
(newVal) => {
emit('update:modelValue', newVal)
emit("update:modelValue", newVal);
},
{ immediate: true, deep: true },
)
{ immediate: true, deep: true }
);
const formRef = ref<FormInst | null>(null)
const formRef = ref<FormInst | null>(null);
const rules = {
'modelProduct.modelName': {
"modelProduct.modelName": {
required: true,
message: '',
trigger: 'blur',
message: "",
trigger: "blur",
},
'modelProduct.modelType': {
"modelProduct.modelType": {
required: true,
message: '',
trigger: 'blur',
message: "",
trigger: "blur",
},
}
};
const modelChildCategory = ref([]) // 垂类二级
const model_category = ref([]) // 模型类型
const categoryList = ref([])
const work_flow_functions = ref([])
const modelChildCategory = ref([]); // 垂类二级
const model_category = ref([]); // 模型类型
const categoryList = ref([]);
const work_flow_functions = ref([]);
async function getDictType() {
try {
const [res1, res2, res3, res4] = await Promise.all([
commonApi.dictType({ type: 'model_part_category' }),
commonApi.dictType({ type: 'model_child_category' }),
commonApi.dictType({ type: 'model_type' }),
commonApi.dictType({ type: 'work_flow_functions' }),
])
commonApi.dictType({ type: "model_part_category" }),
commonApi.dictType({ type: "model_child_category" }),
commonApi.dictType({ type: "model_type" }),
commonApi.dictType({ type: "work_flow_functions" }),
]);
// modelPartCategory.value = res1.data
modelChildCategory.value = res2.data
model_category.value = res3.data
work_flow_functions.value = res4.data
categoryList.value = res1.data
modelChildCategory.value = res2.data;
model_category.value = res3.data;
work_flow_functions.value = res4.data;
categoryList.value = res1.data;
// 遍历第一个数据数组，检查是否有子项
categoryList.value.forEach((item: any) => {
item.dictValue += 99999
item.dictValue += 99999;
// 给每个对象添加一个children属性，初始化为空数组
item.children = []
item.children = [];
// 遍历第二个数据数组
modelChildCategory.value.forEach((child) => {
// 检查parentId是否与dictValue相等
if (child.partId === item.dictCode) {
// 将符合条件的子项放入children数组中
item.children.push(child)
item.children.push(child);
}
})
})
}
catch (error) {
console.log(error)
});
});
} catch (error) {
console.log(error);
}
}
getDictType()
getDictType();
const activityList = ref([])
const activityList = ref([]);
async function getActivityList() {
try {
const res = await request.post('/ToActivity/list', {})
activityList.value = res.rows
}
catch (error) {
console.log(error)
const res = await request.post("/ToActivity/list", {});
activityList.value = res.rows;
} catch (error) {
console.log(error);
}
}
getActivityList()
getActivityList();
const originalBtnList = ref([
{
label: '原创',
label: "原创",
value: 1,
},
{
label: '转载',
label: "转载",
value: 0,
},
])
]);
function nextStep() {
formRef.value?.validate((errors) => {
if (!errors) {
emit('createModelsNext')
emit("createModelsNext");
} else {
console.log("error", errors);
}
else {
console.log('error', errors)
}
})
});
}
function handleIsOriginal(value: number) {
localForm.value.modelProduct.isOriginal = value
localForm.value.modelProduct.isOriginal = value;
// if (value === 0) {
// localForm.value.modelProduct.originalAuthorName = ''
// }
@ -138,6 +133,23 @@ const isPublicList = [
value: 0,
},
];
const isFreeList = ref([
{
label: "免费",
value: 1,
},
{
label: "付费",
value: 0,
},
]);
function handleIsFree(value: number) {
// localForm.value.modelVersionList[index].isFree = value;
localForm.value.modelProduct.isFree = value;
}
// function changeModelType(item){
// }
</script>
@ -153,7 +165,10 @@ const isPublicList = [
size="large"
>
<n-form-item label="模型名称" path="modelProduct.modelName">
<n-input v-model:value="localForm.modelProduct.modelName" placeholder="输入模型名" />
<n-input
v-model:value="localForm.modelProduct.modelName"
placeholder="输入模型名"
/>
</n-form-item>
<n-form-item label="模型类型" path="modelProduct.modelType">
<!-- @update:value="changeModelType" -->
@ -165,9 +180,7 @@ const isPublicList = [
:options="model_category"
/>
</n-form-item>
<div>
内容类别
</div>
<div>内容类别</div>
<div class="-mb-5 text-gray-400 text-[12px]">
填写类别可让模型获得更精准的流量, 平台也有权基于标准修改你的类别标签
</div>
@ -182,7 +195,11 @@ const isPublicList = [
@update:value="handleCategoryUpdateValue"
/>
</n-form-item>
<n-form-item path="functions" class="-mt-12" v-if="localForm.modelProduct.modelType !== '0'">
<n-form-item
path="functions"
class="-mt-12"
v-if="localForm.modelProduct.modelType !== '0'"
>
<n-select
v-model:value="localForm.modelProduct.functions"
label-field="dictLabel"
@ -192,9 +209,7 @@ const isPublicList = [
/>
</n-form-item>
<div>
标签
</div>
<div>标签</div>
<div class="-mb-5 text-gray-400 text-[12px]">
添加标签将自动推荐给可能感兴趣的人
</div>
@ -219,12 +234,8 @@ const isPublicList = [
:show="false"
/>
</n-form-item>
<div>
参与活动
</div>
<div class="-mb-5 text-gray-400 text-[12px]">
参与特定活动或比赛,下拉选择
</div>
<div>参与活动</div>
<div class="-mb-5 text-gray-400 text-[12px]">参与特定活动或比赛,下拉选择</div>
<n-form-item path="activityId">
<n-select
v-model:value="localForm.modelProduct.activityId"
@ -235,10 +246,72 @@ const isPublicList = [
/>
</n-form-item>
</n-form>
<div class="">权限设置</div>
<div class="mt-1 mb-2 text-gray-400 text-[12px]">可见范围</div>
<div>
原创内容
<n-radio-group
v-model:value="localForm.modelProduct.jurisdiction"
name="radiogroup"
>
<n-space>
<n-radio
v-for="(isPublicItem, isPublicIndex) in isPublicList"
:key="isPublicIndex"
:value="isPublicItem.value"
>
{{ isPublicItem.label }}
</n-radio>
</n-space>
</n-radio-group>
</div>
<div class="flex justify-center items-center mt-5 bg-white h-12 rounded-lg border border-gray-100">
<div v-if="localForm.modelProduct.jurisdiction === 1">
<div class="mt-4 mb-1 text-gray-400 text-[12px]">付费设置</div>
<div class="flex justify-center items-center bg-white h-10 rounded-lg">
<div
v-for="(item, index) in isFreeList"
:key="index"
:style="{
backgroundColor:
localForm.modelProduct.isFree === item.value ? 'rgba(49, 98, 255, 0.1)' : '#fff',
color: localForm.modelProduct.isFree === item.value ? '#3162ff' : '#000',
}"
class="flex-1 rounded-lg h-full flex items-center justify-center cursor-pointer"
@click="handleIsFree(item.value)"
>
{{ item.label }}
</div>
</div>
<!-- <div class="mt-1 mb-2 text-gray-500 text-[12px]">
选择会员专属或会员下载视为您已经阅读
<span class="text-[#3162ff] cursor-pointer underline"
>《会员模型许可协议》</span
>
并同意其中条款
</div> -->
<div v-if="localForm.modelProduct.isFree === 0" class="text-[12px]">
<n-form-item size="large">
<n-input
v-model:value="localForm.modelProduct.productPrice"
placeholder="请输入付费金额"
type="number"
/>
</n-form-item>
<!-- <div>会员下载模型</div>
<div class="text-gray-500">
下载模型需购买会员，在线生图对所有人开放，无生图次数限制；会员下载的模型版本生成图片默认可商用。
</div> -->
</div>
<div v-else class="mb-4">
</div>
</div>
<div>原创内容</div>
<div
class="flex justify-center items-center mt-5 bg-white h-12 rounded-lg border border-gray-100"
>
<div
v-for="(item, index) in originalBtnList"
:key="index"
@ -248,33 +321,17 @@ const isPublicList = [
? 'rgba(49, 98, 255, 0.1)'
: '#fff',
color: localForm.modelProduct.isOriginal === item.value ? '#3162ff' : '#000',
}" class="flex-1 rounded-lg h-full flex items-center justify-center cursor-pointer" @click="handleIsOriginal(item.value)"
}"
class="flex-1 rounded-lg h-full flex items-center justify-center cursor-pointer"
@click="handleIsOriginal(item.value)"
>
{{ item.label }}
</div>
</div>
<div class="">权限设置</div>
<div class="mt-1 mb-2 text-gray-400 text-[12px]">可见范围</div>
<div>
<n-radio-group v-model:value="localForm.modelProduct.jurisdiction" name="radiogroup">
<n-space>
<n-radio
v-for="(isPublicItem, isPublicIndex) in isPublicList"
:key="isPublicIndex"
:value="isPublicItem.value"
>
{{ isPublicItem.label }}
</n-radio>
</n-space>
</n-radio-group>
</div>
<div v-if="localForm.modelProduct.isOriginal === 1" class="text-[12px]">
<div class="my-3">
魔创未来原创模型加密保护计划
</div>
<div class="my-3">魔创未来原创模型加密保护计划</div>
<div class="text-gray-400">
原创模型加密保护计划是魔创未来推出的,为维护创作者权益、保障平台健康发展,通过技术手段遏制爬取、盗版、侵权等不法行为,保证创作者的劳动成果得到合理回报,进而激励更多优秀原创模型的诞生。
</div>
@ -285,29 +342,32 @@ const isPublicList = [
加入后有何好处？ 1.模型加密能力 2.流量扶持 3.创作激励
</div>
<div class="text-gray-400">
详情查看 <a href="" class="text-[#3162ff] underline">魔创未来原创模型加密保护计划</a>
</div>
<div class="my-3 ">
原创声明
详情查看
<a href="" class="text-[#3162ff] underline">魔创未来原创模型加密保护计划</a>
</div>
<div class="my-3">原创声明</div>
<div class="text-gray-400">
本人声明并承诺模型是由本人原创,相关的权利和义务由本人承担。
</div>
</div>
<div v-else>
<n-form-item path="modelProduct.originalAuthorName" size="large">
<n-input v-model:value="localForm.modelProduct.originalAuthorName" placeholder="输入原创作者" />
<n-input
v-model:value="localForm.modelProduct.originalAuthorName"
placeholder="输入原创作者"
/>
</n-form-item>
</div>
</div>
<div class="flex w-full justify-center">
<div class="flex justify-center items-center mt-5 text-white w-[200px] h-10 rounded-lg bg-[#3162ff] cursor-pointer" @click="nextStep">
<div
class="flex justify-center items-center mt-5 text-white w-[200px] h-10 rounded-lg bg-[#3162ff] cursor-pointer"
@click="nextStep"
>
下一步
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
</style>
<style lang="scss" scoped></style>

36
app/components/publishModel/EditVersion.vue
View File

@ -110,9 +110,7 @@ const originalBtnList = ref([
value: 0,
},
]);
function handleIsFree(index: number, value: number) {
localForm.value.modelVersionList[index].isFree = value;
}
async function nextStep() {
for (let i = 0; i < localForm.value.modelVersionList.length; i++) {
if (
@ -329,37 +327,7 @@ function handledeleteFile(item:any){
</div>
</div> -->
</n-form>
<div v-if="item.isPublic === 1">
<div class="mt-4 mb-1 text-gray-400 text-[12px]">付费设置</div>
<div class="flex justify-center items-center bg-white h-10 rounded-lg">
<div
v-for="(subItem, subIndex) in originalBtnList"
:key="subIndex"
:style="{
backgroundColor:
item.isFree === subItem.value ? 'rgba(49, 98, 255, 0.1)' : '#fff',
color: item.isFree === subItem.value ? '#3162ff' : '#000',
}"
class="flex-1 rounded-lg h-full flex items-center justify-center cursor-pointer"
@click="handleIsFree(index, subItem.value)"
>
{{ subItem.label }}
</div>
</div>
<div class="mt-1 mb-2 text-gray-500 text-[12px]">
选择会员专属或会员下载视为您已经阅读
<span class="text-[#3162ff] cursor-pointer underline"
>《会员模型许可协议》</span
>
并同意其中条款
</div>
<div v-if="item.isFree === 1" class="text-[12px]">
<div>会员下载模型</div>
<div class="text-gray-500">
下载模型需购买会员，在线生图对所有人开放，无生图次数限制；会员下载的模型版本生成图片默认可商用。
</div>
</div>
</div>
<div class="text-gray-400 text-[12px] my-4">许可范围</div>
<div class="flex flex-wrap">
<div class="w-[50%] mb-2">

4
app/components/publishModel/UploadImg.vue
View File

@ -57,6 +57,10 @@ async function handlePublish() {
}
}
if(param.modelProduct.isFree === 1){
param.modelProduct.productPrice = 0
}
if (type === 'add') {
try {
const res = await request.post('/model/insert', param)

152
app/pages/gold-detail/index.vue
View File

@ -1,10 +1,10 @@
<script setup lang="ts">
import { onMounted, ref } from "vue";
import { onMounted, ref } from 'vue'
definePageMeta({
layout: "header",
});
const activeTab = ref("oasis");
layout: 'header',
})
const activeTab = ref('oasis')
// const route = useRoute();
// const { id } = route.params as { id: string };
@ -12,123 +12,155 @@ const activeTab = ref("oasis");
// 获取充值记录
const recordFinished = ref(false)
const recordParams = ref({
"pageNum": 1,
"pageSize": 10
pageNum: 1,
pageSize: 10,
})
const pointsResult = ref([]);
const pointsResult = ref([])
async function getPoints() {
try {
if(recordFinished.value) return
const res = await request.post("/personalCenter/getRecord",{...recordParams.value});
if (recordFinished.value)
return
const res = await request.post('/personalCenter/getRecord', { ...recordParams.value })
if (res.code === 200) {
if (recordParams.value.pageNum === 1) {
pointsResult.value = res.rows;
} else {
pointsResult.value = [...pointsResult.value, ...res.rows];
pointsResult.value = res.rows
}
else {
pointsResult.value = [...pointsResult.value, ...res.rows]
}
// 判断是否加载完所有数据
if (pointsResult.value.length >= res.total) {
recordFinished.value = true;
recordFinished.value = true
}
recordParams.value.pageNum++;
recordParams.value.pageNum++
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getPoints();
getPoints()
// 已获消费的积分
const walletRecordFinished = ref(false)
const walletRecordParams = ref({
"pageNum": 1,
"pageSize": 15
pageNum: 1,
pageSize: 15,
})
const walletRecordList = ref([]);
const walletRecordList = ref([])
async function getWalletRecord() {
try {
if(walletRecordFinished.value) return
const res = await request.post("/personalCenter/getWalletRecord", {...walletRecordParams.value});
if (walletRecordFinished.value)
return
const res = await request.post('/personalCenter/getWalletRecord', { ...walletRecordParams.value })
if (res.code === 200) {
if (walletRecordParams.value.pageNum === 1) {
walletRecordList.value = res.rows;
} else {
walletRecordList.value = [...walletRecordList.value, ...res.rows];
walletRecordList.value = res.rows
}
else {
walletRecordList.value = [...walletRecordList.value, ...res.rows]
}
// 判断是否加载完所有数据
if (walletRecordList.value.length >= res.total) {
walletRecordFinished.value = true;
walletRecordFinished.value = true
}
walletRecordParams.value.pageNum++;
walletRecordParams.value.pageNum++
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getWalletRecord();
getWalletRecord()
onMounted(() => {
// nextTick(() => {
// activeTab.value = 'beatles'
// })
});
})
</script>
<template>
<div class="flex justify-center bg-[#f2f5f8] items-center h-[calc(100vh-48px)]">
<div class="w-[1200px] bg-white rounded-lg shadow-lg p-10 h-[calc(100%-40px)]">
<h1 class="text-2xl font-bold mb-4">金币明细</h1>
<h1 class="text-2xl font-bold mb-4">
金币明细
</h1>
<n-tabs v-model:value="activeTab" type="line" animated>
<n-tab-pane name="oasis" tab="充值记录">
<div class="border border-solid border-gray-200 rounded-lg relative">
<div class="mc-table flex w-full bg-gray-200 sticky top-0">
<div class="w-[250px]">获取时间</div>
<div class="w-[250px]">获取来源</div>
<div class="flex-1">详情</div>
<div class="w-[200px]">金币值</div>
<div class="w-[250px]">
获取时间
</div>
<div class="w-[250px]">
获取来源
</div>
<div class="flex-1">
详情
</div>
<div class="w-[200px]">
充值金币值
</div>
</div>
<n-infinite-scroll
style="height: calc(100vh - 300px);"
:distance="10"
@load="getPoints"
>
<div v-for="item in pointsResult" :key="item" class="mc-table flex w-full">
<div class="w-[250px]">
{{ item.orderTime }}
<div v-for="item in pointsResult" :key="item" class="mc-table flex w-full">
<div class="w-[250px]">
{{ item.orderTime }}
</div>
<div class="w-[250px]">
{{ item.productName }}
</div>
<div class="flex-1">
-
</div>
<div class="w-[200px]">
{{ item.paymentAmount }}
</div>
</div>
<div class="w-[250px]">{{ item.productName }}</div>
<div class="flex-1">-</div>
<div class="w-[200px]">
{{ item.paymentAmount }}
</div>
</div>
</n-infinite-scroll>
</n-infinite-scroll>
</div>
</n-tab-pane>
<n-tab-pane name="beatles" tab="消费记录">
<div class="border border-solid border-gray-200 rounded-lg relative">
<div class="mc-table flex w-full bg-gray-200 sticky top-0">
<div class="w-[250px]">消耗时间</div>
<div class="w-[250px]">消耗类型</div>
<div class="flex-1">详情</div>
<div class="w-[200px]">充值金币值</div>
<div class="w-[250px]">
消耗时间
</div>
<div class="w-[250px]">
消耗类型
</div>
<div class="flex-1">
详情
</div>
<div class="w-[200px]">
消费金币值
</div>
</div>
<n-infinite-scroll
style="height: calc(100vh - 300px);"
:distance="10"
@load="getWalletRecord"
>
<div v-for="item in walletRecordList" :key="item" class="mc-table flex w-full">
<div class="w-[250px]">
{{ item.consumeDate }}
<div v-for="item in walletRecordList" :key="item" class="mc-table flex w-full">
<div class="w-[250px]">
{{ item.consumeDate }}
</div>
<div class="w-[250px]">
{{ item.productName }}
</div>
<div class="flex-1">
-
</div>
<div class="w-[200px]">
{{ item.amount }}
</div>
</div>
<div class="w-[250px]">{{ item.productName }}</div>
<div class="flex-1">-</div>
<div class="w-[200px]">
{{ item.amount }}
</div>
</div>
</n-infinite-scroll>
</n-infinite-scroll>
</div>
</n-tab-pane>
</n-tabs>

197
app/pages/login-success.vue 100644
View File

@ -0,0 +1,197 @@
<template>
<div class="min-h-screen bg-white flex items-center justify-center px-4">
<!-- <n-button @click="handleAuthorization" type="info">
授权
</n-button> -->
<div v-if="isSuccess">
<div class="text-center">
<div
class="w-16 h-16 bg-green-500 rounded-full mx-auto mb-6 flex items-center justify-center animate-scale-in"
>
<svg
class="w-8 h-8 text-white"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M5 13l4 4L19 7"
/>
</svg>
</div>
<h2 class="text-xl font-medium text-gray-900 mb-2 animate-fade-in">登录成功</h2>
<!-- <p class="text-sm text-gray-500 animate-fade-in-delay">
{{ countdownText }}
</p> -->
</div>
</div>
<div v-else>
<div class="wave-loading mb-8">
<div class="wave-circle">
<div class="wave"></div>
<div class="wave"></div>
<div class="wave"></div>
<div class="logo-container">
<!-- <svg class="logo-icon" viewBox="0 0 24 24" fill="none">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" fill="currentColor"/>
</svg> -->
<!-- <svg class="logo-icon" viewBox="0 0 24 24">
<defs>
<linearGradient id="logoGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color: #60a5fa" />
<stop offset="100%" style="stop-color: #3b82f6" />
</linearGradient>
</defs>
<path
d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"
fill="url(#logoGradient)"
/>
</svg> -->
</div>
</div>
</div>
<!-- 加载文字动画 -->
<div class="loading-text">
<span class="dot-container">
<span class="text-xl font-medium text-gray-700">登录中</span>
<span class="dots">
<span class="dot">.</span>
<span class="dot">.</span>
<span class="dot">.</span>
</span>
</span>
</div>
<!-- 提示信息 -->
<div class="mt-4 space-y-2 animate-fade-in">
<p class="text-gray-500 text-sm">正在验证您的身份</p>
<div class="flex items-center justify-center space-x-2">
<svg class="w-4 h-4 text-blue-500 animate-spin" fill="none" viewBox="0 0 24 24">
<circle
class="opacity-25"
cx="12"
cy="12"
r="10"
stroke="currentColor"
stroke-width="4"
></circle>
<path
class="opacity-75"
fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
></path>
</svg>
<span class="text-sm text-gray-400">请稍候片刻</span>
</div>
</div>
<!-- 安全提示 -->
<div class="mt-8 flex items-center justify-center text-gray-400 text-sm">
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8V7a4 4 0 00-8 0v4h8z"
/>
</svg>
安全登录中
</div>
</div>
</div>
</template>
<script setup>
import { useRoute } from "#app";
import { onMounted, onUnmounted, ref } from "vue";
const route = useRoute();
definePageMeta({
layout: "home",
});
const countdown = ref(3);
const countdownText = ref("页面即将关闭...");
let timer = null;
let urlParams = null;
// const urlParams = new URLSearchParams(window.location.search);
const isSuccess = ref(false);
const handleAuthorization = async () => {
const uuid = route.query.uuid;
const code = route.query.code;
// const uuid = urlParams.get('uuid');
// const code = urlParams.get('code');
const url = `/wx/uuid/bind/openid?uuid=${uuid}&code=${code}`;
try {
const res = await request.get(url);
isSuccess.value = true;
} catch (err) {}
};
onMounted(() => {
handleAuthorization()
// urlParams = new URLSearchParams(window.location.search);
// const uuid = urlParams.get('uuid');
// console.log(uuid);
// timer = setInterval(() => {
// countdown.value--;
// countdownText.value = `${countdown.value}秒后自动关闭...`;
// if (countdown.value <= 0) {
// clearInterval(timer);
// // 关闭页面或跳转
// window.close();
// // 如果window.close()不生效，可以跳转到指定页面
// // window.location.href = '您的目标页面URL'
// }
// }, 1000);
});
onUnmounted(() => {
if (timer) {
clearInterval(timer);
}
});
</script>
<style>
@keyframes scale-in {
0% {
transform: scale(0);
}
70% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
@keyframes fade-in {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-scale-in {
animation: scale-in 0.3s ease-out forwards;
}
.animate-fade-in {
animation: fade-in 0.3s ease-out forwards;
}
.animate-fade-in-delay {
animation: fade-in 0.3s ease-out 0.2s forwards;
opacity: 0;
}
</style>

321
app/pages/member-center/index.vue
View File

@ -1,55 +1,58 @@
<script setup>
import { CheckmarkCircleSharp, Close } from "@vicons/ionicons5";
import { NConfigProvider, NMessageProvider } from "naive-ui";
const message = useMessage();
import { CheckmarkCircleSharp, Close } from '@vicons/ionicons5'
import { NConfigProvider, NMessageProvider } from 'naive-ui'
const message = useMessage()
definePageMeta({
layout: "header",
});
layout: 'header',
})
// 订单
const needPayment = ref([
{
amount: "",
productId: "",
promotionId: "",
type: "member",
amount: '',
productId: '',
promotionId: '',
type: 'member',
},
]);
const userStore = useUserStore();
const userInfo = userStore.userInfo;
])
const userStore = useUserStore()
const userInfo = userStore.userInfo
// 显示支付弹框
// interface Payment {
// isVisible: boolean;
// }
// 是否是会员
const isMember = ref(false);
const isMember = ref(false)
async function getIsMember() {
try {
const res = await request.get("/member/isMember");
const res = await request.get('/member/isMember')
if (res.code === 200) {
isMember.value = res.data;
isMember.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getIsMember();
getIsMember()
// 获取会员等级及权益列表
const MemberBenefitList = ref([]);
const MemberBenefitList = ref([])
async function getMemberBenefitList() {
try {
const res = await request.get("/memberLevel/getMemberBenefitList");
const res = await request.get('/memberLevel/getMemberBenefitList')
if (res.code === 200) {
MemberBenefitList.value = res.data;
MemberBenefitList.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getMemberBenefitList();
getMemberBenefitList()
// 获取会员等级列表
// interface memberLevel {
@ -58,152 +61,160 @@ getMemberBenefitList();
// originalPrice: number;
// subscriptionPeriod: number;
// }
const memberLevelList = ref([]);
const memberLevelList = ref([])
async function getMemberLevelList() {
try {
const res = await request.get("/memberLevel/list");
const res = await request.get('/memberLevel/list')
if (res.code === 200) {
memberLevelList.value = res.data;
memberLevelList.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getMemberLevelList();
getMemberLevelList()
// 显示会员支付的弹框
const isShowPayment = ref(false);
const PaymentRef = ref(null);
const isShowPayment = ref(false)
const PaymentRef = ref(null)
function showPayment(info) {
if (info === 1) {
needPayment.value = memberLevelList.value;
} else {
needPayment.value = [info];
needPayment.value = memberLevelList.value
}
isShowPayment.value = true;
else {
needPayment.value = [info]
}
isShowPayment.value = true
if (PaymentRef.value) {
PaymentRef.value.isVisible = true;
PaymentRef.value.isVisible = true
}
}
// 关闭开通会员弹框
function closePayment() {
isShowPayment.value = false;
isShowPayment.value = false
if (PaymentRef.value) {
PaymentRef.value.isVisible = false;
PaymentRef.value.isVisible = false
}
}
// 显示积分的弹框
const isShowIntPayment = ref(false);
const isShowIntPayment = ref(false)
const IntPaymentRef = ref(null);
const IntPaymentRef = ref(null)
function showIntPayment() {
isShowIntPayment.value = true;
isShowIntPayment.value = true
if (IntPaymentRef.value) {
IntPaymentRef.value.isVisible = true;
IntPaymentRef.value.isVisible = true
}
}
// 关闭充值积分弹框
function closeIntPayment() {
isShowIntPayment.value = false;
isShowIntPayment.value = false
if (IntPaymentRef.value) {
IntPaymentRef.value.isVisible = false;
IntPaymentRef.value.isVisible = false
}
}
// 关闭充值金币弹框
const isShowGoldPayment = ref(false);
const goldPaymentRef = ref(null);
const isShowGoldPayment = ref(false)
const goldPaymentRef = ref(null)
function closeGoldPayment() {
isShowGoldPayment.value = false;
isShowGoldPayment.value = false
if (goldPaymentRef.value) {
goldPaymentRef.value.isVisible = false;
goldPaymentRef.value.isVisible = false
}
}
// 支付成功后刷新会员信息
function paymentSuccess() {
getIsMember();
integralGold();
// getIsMember();
if (import.meta.client) {
window.location.reload()
}
}
// 跳转到积分详情页
function toIntDetail() {
const baseUrl = window.location.origin;
window.open(`${baseUrl}/int-detail`, "_blank", "noopener,noreferrer");
const baseUrl = window.location.origin
window.open(`${baseUrl}/int-detail`, '_blank', 'noopener,noreferrer')
}
// 订单管理
function toOrderManage() {
const baseUrl = window.location.origin;
window.open(`${baseUrl}/order-management`, "_blank", "noopener,noreferrer");
const baseUrl = window.location.origin
window.open(`${baseUrl}/order-management`, '_blank', 'noopener,noreferrer')
}
// 跳转到金币详情
function toGoldDetail() {
const baseUrl = window.location.origin;
window.open(`${baseUrl}/gold-detail`, "_blank", "noopener,noreferrer");
const baseUrl = window.location.origin
window.open(`${baseUrl}/gold-detail`, '_blank', 'noopener,noreferrer')
}
// 显示充值金币的框
function showGoldPayment() {
isShowGoldPayment.value = true;
isShowGoldPayment.value = true
if (goldPaymentRef.value) {
goldPaymentRef.value.isVisible = true;
goldPaymentRef.value.isVisible = true
}
}
// 获取积分和金币余额
const integralGold = ref({});
const integralGold = ref({})
async function getIntegralGold() {
try {
const res = await request.post("/personalCenter/getPointAndWallet");
const res = await request.post('/personalCenter/getPointAndWallet')
if (res.code === 200) {
integralGold.value = res.data;
integralGold.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getIntegralGold();
const isShowActivity = ref(true);
getIntegralGold()
const isShowActivity = ref(true)
// 关闭活动的图标
function closeActivityIcon() {
isShowActivity.value = false;
isShowActivity.value = false
}
// 活动列表
const activityList = ref([])
const isShowactivityList = ref(false);
const isShowactivityList = ref(false)
async function showActivityList() {
try {
const res = await request.post("/promotion/promotionList", {
const res = await request.post('/promotion/promotionList', {
pageNum: 1,
pageSize: 50,
});
})
if (res.code === 200) {
activityList.value = res.rows
isShowactivityList.value = true;
isShowactivityList.value = true
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
// 参与活动
async function getActivity(item) {
if(item.isJoin === 1) return
if (item.isJoin === 1)
return
try {
const res = await request.get(`/promotion/joinPromotion?promotionId=${item.id}`);
const res = await request.get(`/promotion/joinPromotion?promotionId=${item.id}`)
if (res.code === 200) {
message.success('领取成功')
item.isJoin = 1
}
} catch (err) {
if(err.code === 601){
}
catch (err) {
if (err.code === 601) {
message.warning(err.msg)
}
}
@ -217,14 +228,14 @@ async function getActivity(item) {
<!-- 左侧用户信息 -->
<div class="w-60 bg-[#2b2421] rounded-lg p-6 my-3">
<!-- 右上角订阅管理 -->
<!-- <div class="text-right">
<div class="text-right">
<button
class="text-[#8b8685] text-sm bg-inherit border-none cursor-pointer"
@click="toOrderManage"
>
订阅管理 >
</button>
</div> -->
</div>
<!-- 用户头像和信息 -->
<div class="flex flex-col items-center mt-2">
@ -233,7 +244,7 @@ async function getActivity(item) {
:src="userInfo.avatar"
alt="头像"
class="w-20 h-20 rounded-full mb-3"
/>
>
<span class="text-white text-sm mb-2">{{ userInfo.nickName }}</span>
</client-only>
<div class="flex items-center text-[#8b8685] text-xs">
@ -260,7 +271,7 @@ async function getActivity(item) {
class="w-full bg-[#f2d5bc] text-[#6b4f3f] rounded-full py-2.5 mt-8 font-medium cursor-pointer"
@click="showPayment(1)"
>
{{ isMember.result === "1" ? '立即续费' : '开通会员'}}
{{ isMember.result === "1" ? '立即续费' : '开通会员' }}
</button>
<!-- 兑换会员链接 -->
@ -278,7 +289,9 @@ async function getActivity(item) {
<div class="grid grid-cols-3 gap-8">
<!-- 算力余额 -->
<div>
<h3 class="text-[#c3986b] mb-4">积分余额</h3>
<h3 class="text-[#c3986b] mb-4">
积分余额
</h3>
<div class="flex items-center mb-2">
<span class="text-[#c3986b] mr-2">{{ integralGold.point || 0 }}点</span>
<button
@ -298,11 +311,11 @@ async function getActivity(item) {
<!-- 生图加速余额 -->
<div>
<h3 class="text-[#c3986b] mb-4">金币余额</h3>
<h3 class="text-[#c3986b] mb-4">
金币余额
</h3>
<div class="flex items-center mb-2">
<span class="text-[#c3986b] mr-2"
>{{ integralGold.wallet || 0 }} 点</span
>
<span class="text-[#c3986b] mr-2">{{ integralGold.wallet || 0 }} 点</span>
<button
class="text-[#c3986b] bg-inherit border-none cursor-pointer"
@click="showGoldPayment"
@ -314,13 +327,15 @@ async function getActivity(item) {
class="text-white bg-inherit border-none cursor-pointer p-0"
@click="toGoldDetail"
>
加速明细 >
金币明细 >
</button>
</div>
<!-- 训练加速余额 -->
<div>
<h3 class="text-[#c3986b] mb-4">训练加速余额</h3>
<h3 class="text-[#c3986b] mb-4">
训练加速余额
</h3>
<div class="flex items-center mb-2">
<span class="text-[#c3986b]">0次</span>
</div>
@ -343,7 +358,9 @@ async function getActivity(item) {
<!-- 进度条 -->
<div class="relative">
<div class="h-1 bg-[#3a322e] rounded-full">
<div class="absolute right-0 -top-6 text-[#8b8685] text-sm">0G/3G</div>
<div class="absolute right-0 -top-6 text-[#8b8685] text-sm">
0G/3G
</div>
</div>
</div>
@ -378,9 +395,7 @@ async function getActivity(item) {
<div class="card-item">
<span class="text-[#814600] text-[20px] mr-2">¥</span>
<span class="text-[#814600] text-[40px] mr-2">{{ item.unitPrice }}</span>
<span class="text-gray-400 text-[20px] line-through"
>¥{{ item.originalPrice }}</span
>
<span class="text-gray-400 text-[20px] line-through">¥{{ item.originalPrice }}</span>
</div>
<div class="card-item text-[#e08909] w-7/10 text-center text-[12px]">
{{ item.subscriptionPeriod }}
@ -397,7 +412,9 @@ async function getActivity(item) {
</div>
<div class="py-8">
<div class="flex justify-center mb-4">
<div class="text-xl font-bold">会员权益</div>
<div class="text-xl font-bold">
会员权益
</div>
</div>
<!-- <div class="flex items-center">
<div v-for="(item, index) in MemberBenefitList" :key="index" class="w-1/4 w-full">
@ -413,35 +430,67 @@ async function getActivity(item) {
</div> -->
<div class="text-[#525252]">
<div class="flex gap-2">
<div class="member-item bg-[#f7f0ea]">会员权益</div>
<div class="member-item bg-[#f5f5f5]">用户免费</div>
<div class="member-item bg-[#fdf6ea]">基础版VIP</div>
<div class="member-item bg-[#fce6bf]">专业版VIP</div>
<div class="member-item bg-[#f7f0ea]">
会员权益
</div>
<div class="member-item bg-[#f5f5f5]">
用户免费
</div>
<div class="member-item bg-[#fdf6ea]">
基础版VIP
</div>
<div class="member-item bg-[#fce6bf]">
专业版VIP
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fff]">算力</div>
<div class="member-item bg-[#fff]">每天300点</div>
<div class="member-item bg-[#fff]">每月15000点</div>
<div class="member-item bg-[#fff]member-item">每月35000点</div>
<div class="member-item bg-[#fff]">
算力
</div>
<div class="member-item bg-[#fff]">
每天300点
</div>
<div class="member-item bg-[#fff]">
每月15000点
</div>
<div class="member-item bg-[#fff]member-item">
每月35000点
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fafafa]">云端存储空间</div>
<div class="member-item bg-[#fafafa]">3GB</div>
<div class="member-item bg-[#fdf6ea]">20GB</div>
<div class="member-item bg-[#fce6bf]">50GB</div>
<div class="member-item bg-[#fafafa]">
云端存储空间
</div>
<div class="member-item bg-[#fafafa]">
3GB
</div>
<div class="member-item bg-[#fdf6ea]">
20GB
</div>
<div class="member-item bg-[#fce6bf]">
50GB
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fff]">生图加速特权</div>
<div class="member-item bg-[#fff]">
生图加速特权
</div>
<div class="member-item bg-[#fff]member-item">
<n-icon size="20" color="#ed7470">
<Close />
</n-icon>
</div>
<div class="member-item bg-[#fff]">每月800次</div>
<div class="member-item bg-[#fff]">每月5000次</div>
<div class="member-item bg-[#fff]">
每月800次
</div>
<div class="member-item bg-[#fff]">
每月5000次
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fafafa]">会员专属模型</div>
<div class="member-item bg-[#fafafa]">
会员专属模型
</div>
<div class="member-item bg-[#fafafa]">
<n-icon size="20" color="#ed7470">
<Close />
@ -459,7 +508,9 @@ async function getActivity(item) {
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fff]">生图高级功能</div>
<div class="member-item bg-[#fff]">
生图高级功能
</div>
<div class="member-item bg-[#fff]">
<n-icon size="20" color="#ed7470">
<Close />
@ -477,7 +528,9 @@ async function getActivity(item) {
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fafafa]">训练XL模型</div>
<div class="member-item bg-[#fafafa]">
训练XL模型
</div>
<div class="member-item bg-[#fafafa]">
<n-icon size="20" color="#ed7470">
<Close />
@ -495,7 +548,9 @@ async function getActivity(item) {
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fff]">图片去水印下载</div>
<div class="member-item bg-[#fff]">
图片去水印下载
</div>
<div class="member-item bg-[#fff]">
<n-icon size="20" color="#ed7470">
<Close />
@ -513,14 +568,20 @@ async function getActivity(item) {
</div>
</div>
<div class="flex gap-2">
<div class="member-item bg-[#fafafa]">多任务并行生图</div>
<div class="member-item bg-[#fafafa]">
多任务并行生图
</div>
<div class="member-item bg-[#fafafa]">
<n-icon size="20" color="#58c08f">
<CheckmarkCircleSharp />
</n-icon>
</div>
<div class="member-item bg-[#fdf6ea]">2个</div>
<div class="member-item bg-[#fce6bf]">3个</div>
<div class="member-item bg-[#fdf6ea]">
2个
</div>
<div class="member-item bg-[#fce6bf]">
3个
</div>
</div>
</div>
</div>
@ -532,7 +593,9 @@ async function getActivity(item) {
<div class="mt-1">
发票或团队/企业定制需求, 请点击立即咨询联系我们, 企业合作需求也可直接联系xxxx
</div>
<div class="mt-1">更多问题可见帮助中心</div>
<div class="mt-1">
更多问题可见帮助中心
</div>
</div>
</div>
</div>
@ -561,7 +624,7 @@ async function getActivity(item) {
/>
</NMessageProvider>
</NConfigProvider>
<div class="activity-box" v-if="isShowActivity">
<div v-if="isShowActivity" class="activity-box">
<div class="absolute -top-6 -right-0 cursor-pointer">
<n-icon size="20" color="#bbb" @click="closeActivityIcon">
<Close />
@ -569,10 +632,10 @@ async function getActivity(item) {
</div>
<img
class="cursor-pointer"
@click="showActivityList"
src="@/assets/img/activityIcon.png"
alt=""
/>
@click="showActivityList"
>
</div>
<n-modal v-model:show="isShowactivityList" transform-origin="center">
@ -588,31 +651,35 @@ async function getActivity(item) {
<div class="flex justify-end mb-4">
<n-icon
class="cursor-pointer"
@click="isShowactivityList = false"
size="20"
color="#bbb"
@click="isShowactivityList = false"
>
<Close />
</n-icon>
</div>
<div class="flex flex-col gap-3">
<div
class="px-2 py-4 bg-white h-20 w-full flex rounded-lg"
v-for="(item, index) in activityList"
:key="index"
class="px-2 py-4 bg-white h-20 w-full flex rounded-lg"
>
<div class="w-[70%] flex flex-col justify-around">
<div>{{ item.activityName }}</div>
<div class="text-xs text-gray-500">有效期: {{item.startTime}}</div>
<div class="text-xs text-gray-500">失效期: {{item.endTime}}</div>
<div class="text-xs text-gray-500">
有效期: {{ item.startTime }}
</div>
<div class="text-xs text-gray-500">
失效期: {{ item.endTime }}
</div>
</div>
<div class="w-[30%] flex items-center justify-center">
<div
@click="getActivity(item)"
class="w-14 h-6 flex items-center justify-center cursor-pointer text-white text-xs bg-[#e9613f] rounded-full"
:style="{backgroundColor: item.isJoin === 0 ? '#e9613f' : '#ccc'}"
:style="{ backgroundColor: item.isJoin === 0 ? '#e9613f' : '#ccc' }"
@click="getActivity(item)"
>
{{ item.isJoin === 0 ? '领取' : '已领取' }}
{{ item.isJoin === 0 ? '领取' : '已领取' }}
</div>
</div>
</div>
@ -631,7 +698,7 @@ async function getActivity(item) {
position: fixed;
bottom: 20px;
right: 20px;
justify-content: space-around
justify-content: space-around;
}
.card-item {
@apply flex items-center justify-center h-1/4;

424
app/pages/model-details/[id].vue
View File

@ -1,82 +1,87 @@
<script setup>
import { commonApi } from "@/api/common";
import { Close, DiamondSharp, PersonAddOutline } from "@vicons/ionicons5";
import {
CircleUser,
Download,
EllipsisVertical,
Heart,
Play,
SquareCheck,
SquarePlus
} from "lucide-vue-next";
import { commonApi } from '@/api/common'
//
import { formatFileSize } from '@/utils/index.ts';
import { NConfigProvider, NMessageProvider } from "naive-ui";
import { ref } from "vue";
import { useRouter } from "vue-router";
const userStore = useUserStore();
const message = useMessage();
import { formatFileSize } from '@/utils/index.ts'
import { Close, DiamondSharp, PersonAddOutline } from '@vicons/ionicons5'
import {
CircleUser,
Download,
EllipsisVertical,
Heart,
Play,
SquareCheck,
SquarePlus,
} from 'lucide-vue-next'
import { NConfigProvider, NMessageProvider } from 'naive-ui'
import { ref } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter();
const userStore = useUserStore()
const message = useMessage()
const router = useRouter()
// 用于版本tabs当前选中的选项卡
definePageMeta({
layout: "default",
});
layout: 'default',
})
// const userStore = useUserStore()
const route = useRoute();
const isBuy = ref(false)
const route = useRoute()
const { id } = route.params
const activeTab = ref(null);
const commentHeight = ref(800);
const detailsInfo = ref({});
const currentUserInfo = ref({});
const isVisibleReport = ref(false);
const activeTab = ref(null)
const commentHeight = ref(800)
const detailsInfo = ref({})
const currentUserInfo = ref({})
const isVisibleReport = ref(false)
// 先获取用户信息 再获取版本信息
const versionByWorkInfo = ref([]);
const versionByWorkInfo = ref([])
async function getInfo() {
try {
const res = await request.get(`/model/selectModelById?id=${id}`);
const res = await request.get(`/model/selectModelById?id=${id}`)
if (res.code === 200) {
detailsInfo.value = res.data;
detailsInfo.value = res.data
if (res.data.tags) {
detailsInfo.value.tagsList = JSON.parse(res.data.tags);
detailsInfo.value.tagsList = JSON.parse(res.data.tags)
}
// detailsInfo.value.styleList =JSON.parse(res.data.styleList)
// // 1翻译
try {
const res1 = await request.get(`/ModelVersion/finbyid?id=${res.data.id}`); // 获取版本
const res1 = await request.get(`/ModelVersion/finbyid?id=${res.data.id}`) // 获取版本
if (res1.code === 200 && res1.data.length > 0) {
versionByWorkInfo.value = res1.data;
versionByWorkInfo.value = res1.data
versionByWorkInfo.value.forEach((item) => {
item.sampleImagePaths = item.sampleImagePaths.split(",");
});
item.sampleImagePaths = item.sampleImagePaths.split(',')
})
nextTick(() => {
activeTab.value = versionByWorkInfo.value[0].id;
});
activeTab.value = versionByWorkInfo.value[0].id
})
// const commentRes = await request.get(`/WorkFlowComment/comment/${res.data.id}`)
}
} catch (error) {
console.log(error);
}
catch (error) {
console.log(error)
}
// // 获取当前作品的用户信息
try {
const res = await request.get(
`/system/user/selectUserById?id=${detailsInfo.value.userId}`
);
`/system/user/selectUserById?id=${detailsInfo.value.userId}`,
)
if (res.code === 200) {
currentUserInfo.value = res.data;
currentUserInfo.value = res.data
}
} catch (error) {
console.log(error);
}
getAttention();
catch (error) {
console.log(error)
}
getAttention()
}
} catch (error) {
console.log(error);
}
catch (error) {
console.log(error)
}
}
getInfo();
getInfo()
// 获取用户点赞/粉丝/关注数量
// interface SelectUserInfo {
@ -94,53 +99,57 @@ const selectUserInfo = ref({
modelDownLoadNum: 0,
modelLikeNum: 0,
modelRunNum: 0,
});
})
// 获取点赞粉丝等的数量
async function getAttention() {
try {
const res = await request.get(
`/attention/selectUserInfo?userId=${detailsInfo.value.userId}`
);
`/attention/selectUserInfo?userId=${detailsInfo.value.userId}`,
)
if (res.code === 200) {
selectUserInfo.value = res.data;
selectUserInfo.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
// 举报/编辑/删除
const isDelete = ref(false);
const isDelete = ref(false)
async function handleSelect(event, type) {
event.stopPropagation(); // 阻止事件冒泡
if (type === "report") {
isVisibleReport.value = true;
event.stopPropagation() // 阻止事件冒泡
if (type === 'report') {
isVisibleReport.value = true
// await request.get(`/WorkFlow/report?id=${id}`) // 举报
} else if (type === "edit") {
}
else if (type === 'edit') {
router.push({
path: `/publish-model`,
query: {
type: "edit",
type: 'edit',
id: detailsInfo.value.id,
},
});
} else {
isDelete.value = true;
})
}
else {
isDelete.value = true
}
}
// 删除
async function onDelete() {
try {
const res = await request.get(`/model/delete?id=${detailsInfo.value.id}`);
const res = await request.get(`/model/delete?id=${detailsInfo.value.id}`)
if (res.code === 200) {
message.success("删除成功");
isDelete.value = false;
router.push("/personal-center");
message.success('删除成功')
isDelete.value = false
router.push('/personal-center')
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
@ -148,19 +157,21 @@ async function onDelete() {
async function onChangeAttention() {
try {
const res = await request.get(
`/attention/addAttention?userId=${detailsInfo.value.userId}`
);
`/attention/addAttention?userId=${detailsInfo.value.userId}`,
)
if (res.code === 200) {
if (res.data) {
detailsInfo.value.isAttention = 1;
message.success("关注成功");
} else {
detailsInfo.value.isAttention = 0;
message.success("取消关注成功");
detailsInfo.value.isAttention = 1
message.success('关注成功')
}
else {
detailsInfo.value.isAttention = 0
message.success('取消关注成功')
}
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
@ -168,124 +179,180 @@ async function onChangeAttention() {
async function onLike() {
try {
const res = await request.get(
`/ModelComment/modelLike?modelId=${detailsInfo.value.id}`
);
`/ModelComment/modelLike?modelId=${detailsInfo.value.id}`,
)
if (res.code === 200) {
detailsInfo.value.isLike === 0
? (detailsInfo.value.isLike = 1)
: (detailsInfo.value.isLike = 0);
: (detailsInfo.value.isLike = 0)
if (detailsInfo.value.isLike === 0) {
message.success("取消点赞成功");
} else {
message.success("点赞成功");
message.success('取消点赞成功')
}
else {
message.success('点赞成功')
}
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
// 举报
const reportParams = ref({
reportId: undefined,
text: "",
text: '',
type: 1,
});
const reportList = ref([]);
})
const reportList = ref([])
async function getDictType() {
try {
const res = await commonApi.dictType({ type: "report_type" });
const res = await commonApi.dictType({ type: 'report_type' })
if (res.code === 200) {
reportList.value = res.data;
reportList.value = res.data
}
} catch (error) {
console.log(error);
}
catch (error) {
console.log(error)
}
}
getDictType();
getDictType()
function handleChange(item) {
reportParams.value.reportId = item.dictValue;
if (item.dictValue !== "5") {
reportParams.value.text = "";
reportParams.value.reportId = item.dictValue
if (item.dictValue !== '5') {
reportParams.value.text = ''
}
console.log("object", reportParams.value);
console.log('object', reportParams.value)
}
function closeReport() {
isVisibleReport.value = false;
isVisibleReport.value = false
}
// 举报
async function onReport() {
if (reportParams.value.reportId !== undefined) {
reportParams.value.productId = detailsInfo.value.id;
reportParams.value.productId = detailsInfo.value.id
try {
const res = await request.post("/report/addReport", reportParams.value);
const res = await request.post('/report/addReport', reportParams.value)
if (res.code === 200) {
message.success("举报成功");
closeReport();
message.success('举报成功')
closeReport()
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
}
// 跳转作者的个人中心
function toPersonalCenter() {
const baseUrl = window.location.origin;
const baseUrl = window.location.origin
if (userStore?.userInfo?.userId === detailsInfo.value.userId) {
window.open(`${baseUrl}/personal-center`, "_blank", "noopener,noreferrer");
} else {
window.open(`${baseUrl}/personal-center`, '_blank', 'noopener,noreferrer')
}
else {
window.open(
`${baseUrl}/personal-publish?userId=${detailsInfo.value.userId}`,
"_blank",
"noopener,noreferrer"
);
'_blank',
'noopener,noreferrer',
)
}
}
const currentTabsIndex = ref(0);
// 切换模型版本
const currentTabsIndex = ref(0)
function handleTabChange(id) {
for (let i = 0; i < versionByWorkInfo.value.length; i++) {
if (id === versionByWorkInfo.value[i].id) {
currentTabsIndex.value = i;
currentTabsIndex.value = i
}
}
}
async function addCollect(){
// 添加模型收藏
async function addCollect() {
try {
const params = {
"productId": versionByWorkInfo.value[currentTabsIndex.value].id,
"productType": detailsInfo.value.modelType,
collectType:0
productId: versionByWorkInfo.value[currentTabsIndex.value].id,
productType: detailsInfo.value.modelType,
collectType: 0,
}
const res = await request.post("/collect/addCollect", params);
const res = await request.post('/collect/addCollect', params)
if (res.code === 200) {
versionByWorkInfo.value[currentTabsIndex.value].isCollect = res.data
if(res.data === 1){
message.success("已加入模型库, 可通过在线生图使用");
}else{
message.success("已从模型库中移除");
if (res.data === 1) {
message.success('已加入模型库, 可通过在线生图使用')
}
else {
message.success('已从模型库中移除')
}
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
async function handelDown(){
// 购买模型后下载模型
async function handelDown() {
try {
const res = await request.get(`/ModelVersion/modelFileDownload?id=${versionByWorkInfo.value[currentTabsIndex.value].id}`);
if (res.code === 200) {
const link = document.createElement('a');
link.href = res.data;
link.download = res.msg; // 自定义文件名
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
} catch (err) {
console.log(err);
const res = await request.get(
`/ModelVersion/modelFileDownload?id=${
versionByWorkInfo.value[currentTabsIndex.value].id
}`,
)
if (res.code === 200) {
const link = document.createElement('a')
link.href = res.data
link.download = res.msg // 自定义文件名
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
}
}
catch (err) {
console.log(err)
}
}
// 购买模型
async function onBuy() {
// 本人直接购买
if (detailsInfo.value.userId === userStore?.userInfo?.userId) {
handelDown()
}
else if (detailsInfo.value.isBuy !== 1) { // 判断是否购买过
isBuy.value = true
}
else {
handelDown()
}
}
// 确认购买付款
async function buyModel() {
if (detailsInfo.value.isBuy === 1) {
handelDown()
}
else {
try {
const params = {
productId: detailsInfo.value.id,
productUserId: detailsInfo.value.userId,
productType: 0,
}
const res = await request.post('/order/buy', params)
if (res.code === 200) {
handelDown()
detailsInfo.value.isBuy = 1
}
}
catch (err) {
console.log(err)
}
}
}
</script>
@ -346,9 +413,9 @@ async function handelDown(){
<div class="w-full">
<n-tabs
v-model:value="activeTab"
@update:value="handleTabChange"
type="line"
animated
@update:value="handleTabChange"
>
<n-tab-pane
v-for="(item, index) in versionByWorkInfo"
@ -364,7 +431,7 @@ async function handelDown(){
:src="subItem"
class="w-full h-[350px] rounded-lg"
alt=""
/>
>
</div>
<div v-if="detailsInfo.original === 1" class="font-bold text-[20px] my-6">
@ -451,11 +518,11 @@ async function handelDown(){
<div class="w-[60px] h-[60px] rounded-full overflow-hidden mr-4">
<client-only>
<NAvatar
@click="toPersonalCenter"
class="w-full h-full mr-2 block cursor-pointer"
round
size="small"
:src="currentUserInfo.avatar"
@click="toPersonalCenter"
/>
</client-only>
</div>
@ -476,8 +543,8 @@ async function handelDown(){
</div>
</div>
<div
class="flex-1 flex justify-end"
v-if="userStore?.userInfo?.userId !== detailsInfo.userId"
class="flex-1 flex justify-end"
>
<div
class="flex items-center font-bold px-1 justify-center w-20 h-8 rounded-full text-[#426af7] border border-[#426af7] border-solid cursor-pointer"
@ -528,8 +595,8 @@ async function handelDown(){
<div class="flex gap-y-2">
<div
v-if="versionByWorkInfo.length > 0"
@click="addCollect"
class="flex flex-1 items-center justify-center bg-[#eceef4] h-[50px] mt-4 mr-1 rounded-md cursor-pointer"
@click="addCollect"
>
<component
:is="
@ -540,19 +607,36 @@ async function handelDown(){
class="h-[20px] w-[20px] text-black menu-icon m-1 text-[#969798]"
/>
<span class="mr-1">
{{ versionByWorkInfo[currentTabsIndex].isCollect === 0 ? '加入模型库' : '已加入'}}
{{
versionByWorkInfo[currentTabsIndex].isCollect === 0
? "加入模型库"
: "已加入"
}}
</span>
</div>
<div
@click="handelDown"
class="flex flex-1 items-center bg-gradient-to-r from-[#ffe9c8] to-[#ffd264] justify-center ml-1 mt-4 text-black bg-[#eceef4] w-full rounded-md h-[50px] cursor-pointer"
class="relative flex flex-1 items-center bg-gradient-to-r from-[#ffe9c8] to-[#ffd264] justify-center ml-1 mt-4 text-black bg-[#eceef4] w-full rounded-md h-[50px] cursor-pointer"
@click="onBuy"
>
<div v-if="detailsInfo.isBuy === 0 && detailsInfo.isFree === 0" class="product-price">
{{ detailsInfo.productPrice }} 金币
</div>
<!-- {{ versionByWorkInfo[currentTabsIndex].isEncrypt }} -->
<img
v-if="versionByWorkInfo[currentTabsIndex]?.isEncrypt === 1"
class="w-10 h-10 absolute -top-1 right-0 -z-5"
src="@assets/img/encryption.png"
alt=""
>
<component
:is="Download"
class="h-[20px] w-[20px] text-black menu-icon m-1 text-[#969798]"
/>
<span class="mr-1" v-if="versionByWorkInfo.length > 0"> 下载 {{ formatFileSize(versionByWorkInfo[currentTabsIndex].fileSize) }} </span>
<span v-if="versionByWorkInfo.length > 0" class="mr-1">
{{ detailsInfo.isBuy === 1 ? "下载" : "购买" }}
{{ formatFileSize(versionByWorkInfo[currentTabsIndex].fileSize) }}
</span>
</div>
</div>
@ -583,7 +667,9 @@ async function handelDown(){
>
<div class="bg-white rounded-xl p-4">
<div class="flex items-center justify-between">
<div class="text-xl">举报</div>
<div class="text-xl">
举报
</div>
<div>
<n-icon size="20" class="mr-2 cursor-pointer" @click="closeReport">
<Close />
@ -592,10 +678,10 @@ async function handelDown(){
</div>
<div class="flex flex-col">
<n-radio
class="m-4 text-[#fff000]"
size="large"
v-for="(item, index) in reportList"
:key="index"
class="m-4 text-[#fff000]"
size="large"
:checked="reportParams.reportId === item.dictValue"
value="Definitely Maybe"
name="basic-demo"
@ -616,11 +702,11 @@ async function handelDown(){
}"
/>
<div
@click="onReport"
class="mt-4 w-[100%] h-10 flex rounded-lg text-white items-center justify-center cursor-pointer"
:class="[
reportParams.reportId !== undefined ? 'bg-[#4c79ee]' : 'bg-[#cccccc]',
]"
@click="onReport"
>
确认
</div>
@ -632,6 +718,17 @@ async function handelDown(){
</div>
</div>
</div>
<n-modal
v-model:show="isBuy"
:mask-closable="false"
preset="dialog"
title="提示！"
content="是否确认购买"
negative-text="取消"
positive-text="确认"
@negative-click="isBuy = false"
@positive-click="buyModel"
/>
<!-- <Report></Report> -->
</div>
</template>
@ -656,7 +753,7 @@ async function handelDown(){
font-weight: 700;
font-size: 24px !important;
}
.n-tabs-tab--active{
.n-tabs-tab--active {
font-size: 24px !important;
}
// .n-tabs.n-tabs--line-type .n-tabs-tab.n-tabs-tab--active, .n-tabs.n-tabs--bar-type .n-tabs-tab.n-tabs-tab--active{
@ -668,8 +765,11 @@ async function handelDown(){
height: 4px;
background: linear-gradient(90deg, #173eff 0%, #1b7dff 100%);
border-radius: 2px;
transition: left 0.2s var(--n-bezier), max-width 0.2s var(--n-bezier),
opacity 0.3s var(--n-bezier), background-color 0.3s var(--n-bezier);
transition:
left 0.2s var(--n-bezier),
max-width 0.2s var(--n-bezier),
opacity 0.3s var(--n-bezier),
background-color 0.3s var(--n-bezier);
}
.original {
margin: 2px 0;
@ -685,4 +785,26 @@ async function handelDown(){
border-radius: 4px;
transform: skew(-10deg);
}
.product-price {
position: absolute;
top: -11px;
right: -1px;
flex-shrink: 0;
width: -moz-fit-content;
width: fit-content;
height: 24px;
padding: 0 8px;
color: #fff;
font-weight: 500;
font-size: 12px;
line-height: 24px;
text-align: center;
background: no-repeat 50% / 100% 100%;
background: linear-gradient(90deg, #ff7d1f, #ff2056 49.5%, #ff3773);
box-shadow: inset 0 -1px 0 0 rgba(234, 62, 26, 0.2);
border-top-left-radius: 8px;
border-bottom-right-radius: 8px;
border-top-right-radius: 2px;
border-bottom-left-radius: 2px;
}
</style>

44
app/pages/order-management/index.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { nextTick, onMounted, ref } from 'vue';
import { nextTick, onMounted, ref } from 'vue'
definePageMeta({
layout: 'header',
@ -15,7 +15,7 @@ interface PointsResult {
const pointsResult = ref<PointsResult>()
async function getPoints() {
try {
const res = await request.get('/member/getPoints')
const res = await request.get('/member/getValidMemberById')
if (res.code === 200) {
pointsResult.value = res.data as PointsResult
nextTick(() => {
@ -31,17 +31,17 @@ getPoints()
const myMemberList = ref([
{
title:'基础版VIP会员',
type:'单月套餐',
time:'2021-02-10至2024-19-23',
payType:'支付宝'
},
title: '基础版VIP会员',
type: '单月套餐',
time: '2021-02-10至2024-19-23',
payType: '支付宝',
},
{
title:'基础版VIP会员',
type:'单月套餐',
time:'2021-02-10至2024-19-23',
payType:'支付宝'
},
title: '基础版VIP会员',
type: '单月套餐',
time: '2021-02-10至2024-19-23',
payType: '支付宝',
},
])
onMounted(() => {
@ -60,27 +60,29 @@ onMounted(() => {
<n-tabs v-model:value="activeTab" type="line" animated>
<n-tab-pane name="manage" tab="订单管理">
<div class="h-[500px] overflow-y-auto">
<div class="p-2 text-base">我的会员</div>
<div v-for="(item, index) in myMemberList" :key="index" class="p-2 bg-[#f9fbfc] rounded-lg text-gray-500 mb-2">
<div class="p-2 text-base">
我的会员
</div>
<div v-for="(item, index) in pointsResult" :key="index" class="p-2 bg-[#f9fbfc] rounded-lg text-gray-500 mb-2">
<div class="p-2 text-[#ff9e0b]">
{{ item.title }}
{{ item.memberLevelName }}
</div>
<div class="flex justify-between p-2">
<!-- <div class="flex justify-between p-2">
<div>订单类型</div>
<div>{{ item.type }}</div>
</div>
</div> -->
<div class="flex justify-between p-2">
<div>生效时间</div>
<div>{{item.time}}</div>
<div>{{ item.startDate }} - {{ item.endDate }}</div>
</div>
<div class="flex justify-between p-2">
<div>支付方式</div>
<div>{{item.payType}}</div>
<div>{{ item.paymentMethod }}</div>
</div>
</div>
</div>
</n-tab-pane>
<n-tab-pane name="record" tab="购买记录">
<!-- <n-tab-pane name="record" tab="购买记录">
<div class="h-[500px] overflow-y-auto">
<div class="mc-table flex w-full">
<div class="w-[200px]">
@ -123,7 +125,7 @@ onMounted(() => {
</div>
</div>
</div>
</n-tab-pane>
</n-tab-pane> -->
</n-tabs>
</div>
</div>

607
app/pages/personal-center/index.vue
View File

@ -1,475 +1,498 @@
<script setup lang="ts">
import { Close } from "@vicons/ionicons5";
const message = useMessage();
import { commonApi } from '@/api/common'
import EditUserInfo from '@/components/EditUserInfo.vue'
import { useUserStore } from '@/stores/user'
import { formatDate } from '@/utils/index.ts'
import { Close } from '@vicons/ionicons5'
import { NConfigProvider, NMessageProvider } from 'naive-ui'
import { nextTick, onMounted, onUnmounted, ref } from 'vue'
import { useRouter } from 'vue-router'
const message = useMessage()
import { commonApi } from "@/api/common";
import EditUserInfo from "@/components/EditUserInfo.vue";
import { useUserStore } from "@/stores/user";
import { formatDate } from "@/utils/index.ts";
import { NConfigProvider, NMessageProvider } from "naive-ui";
import { nextTick, onMounted, onUnmounted, ref } from "vue";
let pollingTimer: ReturnType<typeof setInterval> | undefined
const route = useRoute();
const { type, status } = route.query as { type: string; status: string };
const route = useRoute()
const { type, status } = route.query as { type: string, status: string }
const loading = ref(false);
const finished = ref(false);
const total = ref(0); // 总条数
const loadingTrigger = ref(null);
const loading = ref(false)
const finished = ref(false)
const total = ref(0) // 总条数
const loadingTrigger = ref(null)
import { useRouter } from "vue-router";
const router = useRouter();
const router = useRouter()
const observer = ref<IntersectionObserver | null>(null);
const observer = ref<IntersectionObserver | null>(null)
definePageMeta({
layout: "default",
});
layout: 'default',
})
interface UserInfo {
nickName?: string; // 使用 ? 表示 nickName 是可选的
avatar?: string;
name?: string;
brief?: string;
nickName?: string // 使用 ? 表示 nickName 是可选的
avatar?: string
name?: string
brief?: string
}
const userStore = useUserStore();
const userInfo: UserInfo = userStore.userInfo;
const userStore = useUserStore()
const userInfo: UserInfo = userStore.userInfo
// 当前是发布还是点赞？
const currentState = ref("mallProduct");
const currentState = ref('mallProduct')
// 当前是模型还是工作流还是图片？
const currentType = ref("0");
const currentType = ref('0')
const orderOptions = ref([
{
dictLabel: "最新",
dictValue: "create_time",
dictLabel: '最新',
dictValue: 'create_time',
},
{
dictLabel: "最热",
dictValue: "like_num",
dictLabel: '最热',
dictValue: 'like_num',
},
]);
])
const stateList = ref([
{ id: "mallProduct", title: "发布" },
{ id: "like", title: "点赞" },
]);
{ id: 'mallProduct', title: '发布' },
{ id: 'like', title: '点赞' },
])
const typeList = ref([
{ id: "0", title: "模型" },
{ id: "1", title: "工作流" },
{ id: "2", title: "图片" },
]);
{ id: '0', title: '模型' },
{ id: '1', title: '工作流' },
{ id: '2', title: '图片' },
])
// 发布的form查询条件
const publishParams = ref({
pageNum: 1,
pageSize: 20,
status: "0",
orderByColumn: "create_time",
status: '0',
orderByColumn: 'create_time',
date: null,
endTime: "",
startTime: "",
});
endTime: '',
startTime: '',
})
function initPublishParams() {
publishParams.value = {
pageNum: 1,
pageSize: 20,
status: "0",
orderByColumn: "create_time",
status: '0',
orderByColumn: 'create_time',
date: null,
endTime: "",
startTime: "",
};
endTime: '',
startTime: '',
}
}
// 点赞form的查询条件
const likesParams = ref({
pageNum: 1,
pageSize: 20,
orderByColumn: "create_time",
});
orderByColumn: 'create_time',
})
function initLikesParams() {
likesParams.value = {
pageNum: 1,
pageSize: 20,
orderByColumn: "create_time",
};
orderByColumn: 'create_time',
}
}
const urlList = ref({
mallProduct: {
0: "/personalCenter/selectByUserIdModel",
1: "/personalCenter/selectByUserIdWorkFlow",
2: "/personalCenter/selectByUserIdImage",
0: '/personalCenter/selectByUserIdModel',
1: '/personalCenter/selectByUserIdWorkFlow',
2: '/personalCenter/selectByUserIdImage',
},
like: {
0: "/personalCenter/likeModel",
1: "/personalCenter/likeWorkFlow",
2: "/personalCenter/likeImage",
0: '/personalCenter/likeModel',
1: '/personalCenter/likeWorkFlow',
2: '/personalCenter/likeImage',
},
});
})
const showInvitationModal = ref(false);
const showInvitationModal = ref(false)
// 获取数据字典
const statusOptions = ref([]);
const statusOptions = ref([])
async function getDictType() {
try {
const res = await commonApi.dictType({
type: "mall_product_status",
});
type: 'mall_product_status',
})
if (res.code === 200 && res.data.length > 0) {
statusOptions.value = res.data;
publishParams.value.status = res.data[0].dictValue;
statusOptions.value = res.data
publishParams.value.status = res.data[0].dictValue
}
} catch (error) {
console.log(error);
}
catch (error) {
console.log(error)
}
}
getDictType();
getDictType()
// 编辑用户信息
interface EditUserInfoType {
isVisible: boolean;
isVisible: boolean
}
const editUserInfoRef = ref<EditUserInfoType | null>(null);
const editUserInfoRef = ref<EditUserInfoType | null>(null)
function onEditInfo() {
if (editUserInfoRef.value) {
editUserInfoRef.value.isVisible = true;
editUserInfoRef.value.isVisible = true
}
}
// 实名认证
interface AuthComponentType {
isVisible: boolean;
isVisible: boolean
}
const authenticationRef = ref<AuthComponentType | null>(null);
const authenticationRef = ref<AuthComponentType | null>(null)
function onAuth() {
if (authenticationRef.value) {
authenticationRef.value.isVisible = true;
authenticationRef.value.isVisible = true
}
}
function initChangeParams() {
if (currentState.value === "mallProduct") {
initPublishParams();
} else {
initLikesParams();
if (currentState.value === 'mallProduct') {
initPublishParams()
}
finished.value = false; // 重置加载完成状态
getList();
else {
initLikesParams()
}
finished.value = false // 重置加载完成状态
getList()
}
// 切换发布/点赞
function changeTabs(id: string) {
currentState.value = id;
currentType.value = "0";
initChangeParams();
currentState.value = id
currentType.value = '0'
initChangeParams()
}
// 切换模型/工作流/图片
function changeType(id: string) {
if (id === "2") {
if (id === '2') {
statusOptions.value.forEach((item) => {
if (item.dictValue === "2") {
item.disabled = true;
if (item.dictValue === '2') {
item.disabled = true
}
});
} else {
statusOptions.value.forEach((item) => {
if (item.dictValue === "2") {
item.disabled = false;
}
});
})
}
currentType.value = id;
initChangeParams();
else {
statusOptions.value.forEach((item) => {
if (item.dictValue === '2') {
item.disabled = false
}
})
}
currentType.value = id
initChangeParams()
}
function initPageNUm() {
if (currentState.value === "mallProduct") {
publishParams.value.pageNum = 1;
} else {
likesParams.value.pageNum = 1;
if (currentState.value === 'mallProduct') {
publishParams.value.pageNum = 1
}
finished.value = false; // 重置加载完成状态
getList();
else {
likesParams.value.pageNum = 1
}
finished.value = false // 重置加载完成状态
getList()
}
// 切换select全部状态/已发布/
function changeStatus(value: string) {
publishParams.value.status = value;
initPageNUm();
publishParams.value.status = value
initPageNUm()
}
// 切换发布的最热/最新
function changeOrder(value: string) {
publishParams.value.orderByColumn = value;
initPageNUm();
publishParams.value.orderByColumn = value
initPageNUm()
}
// 切换点赞的最热/最新
function changeLikeOrder(value: string) {
likesParams.value.orderByColumn = value;
initPageNUm();
likesParams.value.orderByColumn = value
initPageNUm()
}
// 切换日期
async function changeDate(value: string[]) {
publishParams.value.startTime = `${await formatDate(value[0] as string)} 00:00:00`;
publishParams.value.endTime = `${await formatDate(value[1] as string)} 23:59:59`;
initPageNUm();
publishParams.value.startTime = `${await formatDate(value[0] as string)} 00:00:00`
publishParams.value.endTime = `${await formatDate(value[1] as string)} 23:59:59`
initPageNUm()
}
// 获取用户点赞/粉丝/关注数量
interface SelectUserInfo {
likeCount: number;
bean: number;
download: number;
attention: number;
likeCount: number
bean: number
download: number
attention: number
}
const selectUserInfo = ref<SelectUserInfo>({
likeCount: 0,
bean: 0,
download: 0,
attention: 0,
});
})
async function getAttention() {
try {
const res = await request.get("/attention/selectUserInfo");
const res = await request.get('/attention/selectUserInfo')
if (res.code === 200) {
selectUserInfo.value = res.data;
selectUserInfo.value = res.data
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getAttention();
getAttention()
// Banner 样式
const bannerStyle = {
backgroundImage:
"url('https://img.zcool.cn/community/special_cover/3a9a64d3628c000c2a1000657eec.jpg')",
};
'url(\'https://img.zcool.cn/community/special_cover/3a9a64d3628c000c2a1000657eec.jpg\')',
}
// 定义响应接口
interface ApiResponse<T> {
code: number;
rows: T[];
message: string;
code: number
rows: T[]
message: string
}
// 定义数据接口
interface UserData {
id: number;
name: string;
email: string;
status: number;
id: number
name: string
email: string
status: number
}
// 查询发布模型接口
const dataList = ref([]);
const dataList = ref([])
async function getList() {
if (loading.value || finished.value) return;
if (loading.value || finished.value)
return
loading.value = true;
let params = {};
if (currentState.value === "mallProduct") {
params = publishParams.value;
} else {
params = likesParams.value;
loading.value = true
let params = {}
if (currentState.value === 'mallProduct') {
params = publishParams.value
}
const url = urlList.value[currentState.value][currentType.value];
else {
params = likesParams.value
}
const url = urlList.value[currentState.value][currentType.value]
try {
const res = await request.post<ApiResponse<UserData>>(url, params);
const res = await request.post<ApiResponse<UserData>>(url, params)
if (res.code === 200) {
// 如果是第一页，直接赋值，否则追加数据
if (params.pageNum === 1) {
dataList.value = res.rows;
} else {
dataList.value = [...dataList.value, ...res.rows];
dataList.value = res.rows
}
else {
dataList.value = [...dataList.value, ...res.rows]
}
total.value = res.total; // 假设接口返回了总条数
total.value = res.total // 假设接口返回了总条数
// 判断是否加载完所有数据
if (dataList.value.length >= total.value) {
finished.value = true;
finished.value = true
}
// 自动增加页码
if (currentState.value === "mallProduct") {
publishParams.value.pageNum++;
} else {
likesParams.value.pageNum++;
if (currentState.value === 'mallProduct') {
publishParams.value.pageNum++
}
else {
likesParams.value.pageNum++
}
}
} catch (err) {
dataList.value = [];
finished.value = true;
console.log(err);
} finally {
loading.value = false;
}
catch (err) {
dataList.value = []
finished.value = true
console.log(err)
}
finally {
loading.value = false
}
}
onMounted(() => {
window.addEventListener("scroll", topedRefresh);
window.addEventListener('scroll', topedRefresh)
observer.value = new IntersectionObserver(
([entry]) => {
if (entry.isIntersecting && !loading.value && !finished.value) {
getList();
getList()
}
},
{
threshold: 0.1,
}
);
},
)
if (loadingTrigger.value) {
observer.value.observe(loadingTrigger.value);
observer.value.observe(loadingTrigger.value)
}
if (type && type === "like") {
currentState.value = type;
if (type && type === 'like') {
currentState.value = type
}
if (status === "0" || status === "1" || status === "2") {
currentType.value = status;
if (status === '0' || status === '1' || status === '2') {
currentType.value = status
}
getList();
});
getList()
})
onUnmounted(() => {
window.removeEventListener("scroll", topedRefresh);
window.removeEventListener('scroll', topedRefresh)
if (observer.value) {
observer.value.disconnect();
observer.value.disconnect()
}
});
})
async function topedRefresh() {
if (import.meta.client) {
await nextTick();
await nextTick()
window.scrollTo({
top: 0,
behavior: "smooth",
});
behavior: 'smooth',
})
}
initPageNUm();
initPageNUm()
}
function onClearDate() {
(publishParams.value.startTime = ""), (publishParams.value.endTime = ""), initPageNUm();
(publishParams.value.startTime = ''), (publishParams.value.endTime = ''), initPageNUm()
}
// 获取粉丝的列表
const isShowFan = ref(false);
const isShowFan = ref(false)
const attentionFinished = ref(false);
const attentionList = ref([]);
const attentionFinished = ref(false)
const attentionList = ref([])
const attentionListParams = ref({
pageNumber: 1,
pageSize: 20,
});
})
async function getAttentionList() {
try {
if (attentionFinished.value) return;
if (attentionFinished.value)
return
const res = await request.post(`/attention/selectToAttention`, {
...attentionListParams.value,
});
})
if (res.code === 200) {
if (attentionListParams.value.pageNumber === 1) {
attentionList.value = res.data.list;
} else {
attentionList.value = [...attentionList.value, ...res.data.list];
attentionList.value = res.data.list
}
else {
attentionList.value = [...attentionList.value, ...res.data.list]
}
total.value = res.data.total; // 假设接口返回了总条数
total.value = res.data.total // 假设接口返回了总条数
// 判断是否加载完所有数据
if (attentionList.value.length >= total.value) {
attentionFinished.value = true;
attentionFinished.value = true
}
attentionListParams.value.pageNumber++;
attentionListParams.value.pageNumber++
}
} catch (err) {
attentionList.value = [];
attentionFinished.value = true;
console.log(err);
}
catch (err) {
attentionList.value = []
attentionFinished.value = true
console.log(err)
}
}
getAttentionList();
getAttentionList()
// 获取关注的列表
const likeFinished = ref(false);
const likeList = ref([]);
const likeFinished = ref(false)
const likeList = ref([])
const likeListParams = ref({
pageNumber: 1,
pageSize: 20,
type:null
});
type: null,
})
async function getLikeList() {
try {
if (likeFinished.value) return;
if (likeFinished.value)
return
const res = await request.post(`/attention/selectAttentionList`, {
...likeListParams.value,
});
})
if (res.code === 200) {
if (likeListParams.value.pageNumber === 1) {
likeList.value = res.data.list;
} else {
likeList.value = [...likeList.value, ...res.data.list];
likeList.value = res.data.list
}
else {
likeList.value = [...likeList.value, ...res.data.list]
}
total.value = res.data.total; // 假设接口返回了总条数
total.value = res.data.total // 假设接口返回了总条数
// 判断是否加载完所有数据
if (likeList.value.length >= total.value) {
likeFinished.value = true;
likeFinished.value = true
}
likeListParams.value.pageNumber++;
likeListParams.value.pageNumber++
}
} catch (err) {
likeList.value = [];
likeFinished.value = true;
console.log(err);
}
catch (err) {
likeList.value = []
likeFinished.value = true
console.log(err)
}
}
getLikeList();
getLikeList()
function closefanList() {
isShowFan.value = false;
isShowFan.value = false
}
// 去关注/取消关注当前用户
async function onAttention(item: any) {
try {
const userId = userStore.userInfo.userId
if(userId === item.userId){
if (userId === item.userId) {
return message.warning('自己不能关注自己')
}
const res = await request.get(`/attention/addAttention?userId=${item.userId}`);
const res = await request.get(`/attention/addAttention?userId=${item.userId}`)
if (res.code === 200) {
if (res.data) {
message.success("关注成功");
} else {
message.success("取消关注成功");
message.success('关注成功')
}
item.attention = !item.attention;
else {
message.success('取消关注成功')
}
item.attention = !item.attention
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
// 过去邀请码
const invitationCode = ref("");
const invitationCode = ref('')
async function getInvitation() {
try {
const res = await request.get(`/invitation/getInvitationCode`);
const res = await request.get(`/invitation/getInvitationCode`)
if (res.code === 200) {
invitationCode.value = res.msg;
invitationCode.value = res.msg
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
getInvitation();
getInvitation()
// 获取邀请列表
// async function getInvitationList() {
@ -478,68 +501,70 @@ getInvitation();
// 复制到粘贴板
function copyToClipboard(text: string) {
const textarea = document.createElement("textarea");
textarea.value = text;
document.body.appendChild(textarea);
textarea.select();
const success = document.execCommand("copy");
document.body.removeChild(textarea);
const textarea = document.createElement('textarea')
textarea.value = text
document.body.appendChild(textarea)
textarea.select()
const success = document.execCommand('copy')
document.body.removeChild(textarea)
if (success) {
message.success("复制成功!");
} else {
message.success("复制成功!");
message.success('复制成功!')
}
else {
message.success('复制成功!')
}
}
// 复制到粘贴板
function handlePositiveClick() {
copyToClipboard(invitationCode.value);
copyToClipboard(invitationCode.value)
}
const activeTab = ref('like')
const activeTab = ref('like')
//邀请码列表
const invitationList = ref({});
// 邀请码列表
const invitationList = ref({})
async function handleNegativeClick() {
try {
const res = await request.get(`/invitation/earningsDisplay`);
const res = await request.get(`/invitation/earningsDisplay`)
if (res.code === 200) {
invitationList.value = res.data
showInvitationModal.value = true;
showInvitationModal.value = true
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
const showLike = (type:string) =>{
isShowFan.value= true
function showLike(type: string) {
isShowFan.value = true
activeTab.value = type
}
const toWallet = () => {
function toWallet() {
router.push({
path: `/wallet`,
});
})
}
// 查询是否已绑定支付宝
const zfbStatus = ref('0')
async function getBindStatus(){
async function getBindStatus() {
const res = await request.get(`/ali/pay/queryBindStatus`)
if (res.code === 200) { //'1 绑定 0不绑定
zfbStatus.value = res.data
}
if (res.code === 200) { // '1 绑定 0不绑定
zfbStatus.value = res.data
}
}
getBindStatus()
// 绑定支付宝
const qrUrl = ref('')
const isShowBindingModal = ref(false)
const showBinding = async() =>{
async function showBinding() {
try {
const res = await request.get(`/ali/pay/generateQrCode`);
const res = await request.get(`/ali/pay/generateQrCode`)
if (res.code === 200) {
qrUrl.value = res.data;
qrUrl.value = res.data
isShowBindingModal.value = true
pollingTimer && clearTimeout(pollingTimer)
@ -559,16 +584,16 @@ const showBinding = async() =>{
}
}, 2000)
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
const closeBindingModal = () =>{
function closeBindingModal() {
pollingTimer && clearTimeout(pollingTimer)
isShowBindingModal.value = false
}
</script>
<template>
@ -588,7 +613,7 @@ const closeBindingModal = () =>{
class="head-img m-1 h-16 w-16 rounded-full bg-white"
:src="userStore?.userInfo?.avatar"
alt="User Avatar"
/>
>
</client-only>
<!-- {{ userStore.userInfo.avatar }} -->
</div>
@ -603,7 +628,7 @@ const closeBindingModal = () =>{
</div>
<!-- Real Name Verification -->
<div
v-if="userInfo.name"
v-if="userStore?.userInfo.name"
class="edit-info rounded-full bg-white px-5 py-2 shadow-md"
>
已经实名
@ -625,7 +650,9 @@ const closeBindingModal = () =>{
@negative-click="handleNegativeClick"
>
<template #trigger>
<n-button class="ml-2 rounded-lg" type="info" round>获取邀请码</n-button>
<n-button class="ml-2 rounded-lg" type="info" round>
获取邀请码
</n-button>
</template>
邀请码: {{ invitationCode }}
</n-popconfirm>
@ -633,10 +660,10 @@ const closeBindingModal = () =>{
<div class="ml-4 cursor-pointer" @click="toWallet()">
<img src="@/assets/img/wallet.png" alt="">
</div>
<div v-if="zfbStatus === '1'" class="bg-[#3875f6] rounded-full px-4 py-2">
<div v-if="zfbStatus === '1'" class="bg-[#3875f6] rounded-full px-4 py-2 ml-4 text-white">
已绑定支付宝
</div>
<div v-else @click="showBinding" class="text-xs px-3 py-2 border border-solid border-[#ccc] rounded-full ml-4 bg-white cursor-pointer">
<div v-else class="text-xs px-3 py-2 border border-solid border-[#ccc] rounded-full ml-4 bg-white cursor-pointer" @click="showBinding">
绑定支付宝
</div>
</div>
@ -671,7 +698,7 @@ const closeBindingModal = () =>{
</div>
<div class="production-state-item mr-5">
<span class="production-state-number font-bold">{{
selectUserInfo.modelDownloadNum + selectUserInfo.modelRunNum
selectUserInfo.modelDownloadNum + selectUserInfo.modelRunNum
}}</span>
作品被使用次数
</div>
@ -789,10 +816,14 @@ const closeBindingModal = () =>{
/>
</div>
<div ref="loadingTrigger" class="h-10">
<div v-if="loading" class="text-center text-gray-500">加载中...</div>
<div v-if="finished" class="text-center text-gray-500">没有更多数据了</div>
<div v-if="loading" class="text-center text-gray-500">
加载中...
</div>
<div v-if="finished" class="text-center text-gray-500">
没有更多数据了
</div>
</div>
<div class="fan-centent" v-if="isShowFan">
<div v-if="isShowFan" class="fan-centent">
<div
class="w-[550px] h-[calc(100vh-100px)] max-h-[700px] m-auto py-0 px-8 pb-[43px] bg-[#fff] rounded-lg relative"
>
@ -826,7 +857,7 @@ const closeBindingModal = () =>{
:src="item.avatar || ''"
alt=""
class="w-14 h-14 rounded-full mr-2"
/>
>
{{ item.nickName }}
</div>
<div
@ -862,7 +893,7 @@ const closeBindingModal = () =>{
:src="item.avatar || ''"
alt=""
class="w-14 h-14 rounded-full mr-2"
/>
>
{{ item.nickName }}
</div>
<div
@ -896,28 +927,40 @@ const closeBindingModal = () =>{
噢！
</template> -->
<div class="py-4 flex justify-between">
<div class="text-xl font-bold">邀请列表</div>
<div class="text-xl font-bold">
邀请列表
</div>
<div class="text-sm text-gray-600">
总收益: {{ invitationList.totalAmount }}
</div>
</div>
<div class="rounded-lg">
<div class="flex w-[100%]">
<div class="w-[180px] flex items-center py-2">头像</div>
<div class="w-[180px] flex items-center py-2">邀请人购买数量</div>
<div class="w-[180px] flex items-center py-2">邀请人名字</div>
<div class="w-[180px] flex items-center py-2">
头像
</div>
<div class="w-[180px] flex items-center py-2">
邀请人购买数量
</div>
<div class="w-[180px] flex items-center py-2">
邀请人名字
</div>
</div>
<div class="max-h-[500px] overflow-y-auto">
<div
class="flex w-[100%] hover:bg-[#f3f3f3] px-2"
v-for="(item, index) in invitationList.earningsDisplayList"
:key="index"
class="flex w-[100%] hover:bg-[#f3f3f3] px-2"
>
<div class="w-[180px] flex items-center py-2">
<img class="w-10 h-10 rounded-full" :src="item.user.avatar" alt="" />
<img class="w-10 h-10 rounded-full" :src="item.user.avatar" alt="">
</div>
<div class="w-[180px] flex items-center py-2">
{{ item.count }}
</div>
<div class="w-[180px] flex items-center py-2">
{{ item.user.userName }}
</div>
<div class="w-[180px] flex items-center py-2">{{ item.count }}</div>
<div class="w-[180px] flex items-center py-2">{{ item.user.userName }}</div>
</div>
</div>
</div>
@ -925,15 +968,15 @@ const closeBindingModal = () =>{
</n-modal>
<div v-if="isShowBindingModal" class="fan-centent">
<div class="relative flex flex-col items-center">
<div class="bg-[#000] py-10 px-20 flex flex-col items-center justify-center rounded-lg">
<div class="text-xl text-white mb-4">
扫码绑定
<div class="bg-[#000] bg-opacity-80 py-10 px-20 flex flex-col items-center justify-center rounded-lg">
<div class="text-xl text-white mb-4">
扫码绑定
</div>
<n-qr-code :value="qrUrl" :size="150" style="padding: 0;" />
<div class="text-base text-white mt-4">
请用手机支付宝扫码
</div>
</div>
<n-qr-code :value="qrUrl" :size="150" style="padding: 0;" />
<div class="text-base text-white mt-4">
请用手机支付宝扫码
</div>
</div>
<n-icon
size="30"
class="cursor-pointer mt-4 text-white"

3
app/pages/publish-model/index.vue
View File

@ -30,6 +30,8 @@ async function initFormData() {
activityId: null, // 参与活动string
isOriginal: 1, // 几代表原创
originalAuthorName: "",
isFree: 1, //0付费
productPrice:0, //商品价格
},
modelVersionList: [
@ -47,7 +49,6 @@ async function initFormData() {
sampleImagePaths: [], // 第三部的图片路径最多20张,切割
triggerWords: "", // 触发词
isPublic: 1, // 权限是否公开权限 1公开 0自见
isFree: 0, // 是否免费
isOnlineUse: 1, // 是否允许在线使用
allowDownloadImage: 1, // 允许下载生图

248
app/pages/wallet/index.vue
View File

@ -1,11 +1,118 @@
<script setup>
import { isAmount } from '@/utils/index.ts'
import { Close } from '@vicons/ionicons5'
import { ref } from 'vue'
const activeTab = ref('withdrawDetail')
const showWalletModal = ref(false)
function showModal() {
showWalletModal.value = true
}
const message = useMessage()
function closeWalletModal() {
showWalletModal.value = false
needWalletNum.value = 0
}
// const allDetailList = ref([]);
// 获取可提现金额
const integralGold = ref({})
async function getIntegralGold() {
try {
const res = await request.post('/personalCenter/getPointAndWallet')
if (res.code === 200) {
integralGold.value = res.data
}
}
catch (err) {
console.log(err)
}
}
getIntegralGold()
// 提现操作
const needWalletNum = ref(0)
async function handleWallet() {
if (isAmount(needWalletNum.value)) {
if (needWalletNum.value > integralGold.value.wallet)
return message.warning('可提现金额不足')
try {
const res = await request.get(`/ali/pay/fetch?amount=${needWalletNum.value}`)
if (res.code === 200) {
message.success('提现成功!')
closeWalletModal()
location.reload()
// getIntegralGold()
}
}
catch (err) {
console.log(err)
}
}
else {
message.warning('请输入正确的金额')
}
}
// 获取累计收入金额
const totalAmount = ref(0)
async function getTotalAmount() {
try {
const res = await request.get('/invitation/totalAmount')
if (res.code === 200) {
totalAmount.value = res.data
}
}
catch (err) {
console.log(err)
}
}
getTotalAmount()
// 获取提现明细列表
const withdrawFinished = ref(false)
const withdrawDetailList = ref([])
const withdrawParams = ref({
pageNum: 1,
pageSize: 10,
})
async function getWithdrawDetail() {
try {
if (withdrawFinished.value)
return
const res = await request.post('/invitation/withdrawalRecord', withdrawParams.value)
if (res.code === 200) {
if (withdrawParams.value.pageNum === 1) {
withdrawDetailList.value = res.rows
}
else {
withdrawDetailList.value = [...withdrawDetailList.value, ...res.rows]
}
// 判断是否加载完所有数据
if (withdrawDetailList.value.length >= res.total) {
withdrawFinished.value = true
}
withdrawParams.value.pageNum++
}
}
catch (err) {
console.log(err)
}
}
getWithdrawDetail()
</script>
<template>
<div>
<div class="p-4 flex text-white gap-3">
<div
class="w-60 h-28 bg-[#a494f7] px-8 py-6 rounded-lg flex flex-col justify-around"
>
<div class="text-xl">累计收入金额</div>
<div class="text-base">¥ {{ totalAmount || 0 }}</div>
<div class="text-xl">
累计收入金额
</div>
<div class="text-base">
¥ {{ totalAmount || 0 }}
</div>
</div>
<div
class="w-60 h-28 bg-[#e87988] px-8 py-6 rounded-lg flex flex-col justify-around"
@ -19,7 +126,9 @@
提现 >
</div>
</div>
<div class="text-base">¥ {{ integralGold.wallet || 0 }}</div>
<div class="text-base">
¥ {{ integralGold.wallet || 0 }}
</div>
</div>
</div>
<div class="p-4 text-[#06186d]">
@ -55,10 +164,18 @@
<n-tab-pane name="withdrawDetail" tab="提现明细">
<div class="border border-solid border-gray-200 rounded-lg relative">
<div class="mc-table flex w-full bg-[#e5ecf4] sticky top-0">
<div class="w-[250px]">提现时间</div>
<div class="w-[250px]">账户类型</div>
<div class="flex-1">详情</div>
<div class="w-[200px]">提现金额</div>
<div class="w-[250px]">
提现时间
</div>
<div class="w-[250px]">
账户类型
</div>
<div class="flex-1">
详情
</div>
<div class="w-[200px]">
提现金额
</div>
</div>
<n-infinite-scroll
style="height: calc(100vh - 300px)"
@ -73,8 +190,12 @@
<div class="w-[250px]">
{{ item.createTime }}
</div>
<div class="w-[250px]">{{ item.account }}</div>
<div class="flex-1">-</div>
<div class="w-[250px]">
{{ item.account }}
</div>
<div class="flex-1">
-
</div>
<div class="w-[200px]">
{{ item.amount }}
</div>
@ -95,9 +216,9 @@
preset="dialog"
>
<div class="flex justify-between">
<div class="text-xl">
提现
</div>
<div class="text-xl">
提现
</div>
<n-icon size="20" class="mr-2 cursor-pointer" @click="closeWalletModal">
<Close />
</n-icon>
@ -108,115 +229,26 @@
</div>
<div class="mt-6">
<n-input-number
placeholder="输入要提现的金额"
v-model:value="needWalletNum"
placeholder="输入要提现的金额"
:precision="2"
clearable
/>
</div>
</div>
<div class="flex justify-center mt-6">
<n-button type="error" @click="closeWalletModal"> 取消 </n-button>
<n-button type="primary" class="ml-8" @click="handleWallet"> 确定 </n-button>
<n-button type="error" @click="closeWalletModal">
取消
</n-button>
<n-button type="primary" class="ml-8" @click="handleWallet">
确定
</n-button>
</div>
</n-card>
</n-modal>
</div>
</template>
<script setup>
import { isAmount } from '@/utils/index.ts';
import { Close } from "@vicons/ionicons5";
import { ref } from "vue";
const activeTab = ref("withdrawDetail");
const showWalletModal = ref(false);
const showModal = () => {
showWalletModal.value = true;
};
const message = useMessage();
const closeWalletModal = () => {
showWalletModal.value = false;
needWalletNum.value = 0
};
// const allDetailList = ref([]);
// 获取可提现金额
const integralGold = ref({});
async function getIntegralGold() {
try {
const res = await request.post("/personalCenter/getPointAndWallet");
if (res.code === 200) {
integralGold.value = res.data;
}
} catch (err) {
console.log(err);
}
}
getIntegralGold();
// 提现操作
const needWalletNum = ref(0)
const handleWallet = async() =>{
if(isAmount(needWalletNum.value)){
if(needWalletNum.value > integralGold.value.wallet) return message.warning('可提现金额不足')
try {
const res = await request.get(`/ali/pay/fetch?amount=${needWalletNum.value}`);
if (res.code === 200) {
closeWalletModal()
getIntegralGold()
}
} catch (err) {
console.log(err);
}
}else{
message.warning('请输入正确的金额')
}
}
//获取累计收入金额
const totalAmount = ref(0);
async function getTotalAmount() {
try {
const res = await request.get("/invitation/totalAmount");
if (res.code === 200) {
totalAmount.value = res.data;
}
} catch (err) {
console.log(err);
}
}
getTotalAmount();
//获取提现明细列表
const withdrawFinished = ref(false);
const withdrawDetailList = ref([]);
const withdrawParams = ref({
pageNum: 1,
pageSize: 10,
});
async function getWithdrawDetail() {
try {
if (withdrawFinished.value) return;
const res = await request.post("/invitation/withdrawalRecord", withdrawParams.value);
if (res.code === 200) {
// withdrawDetailList.value = res.data;
if (withdrawParams.value.pageNum === 1) {
withdrawDetailList.value = res.rows;
} else {
withdrawDetailList.value = [...withdrawDetailList.value, ...res.rows];
}
// 判断是否加载完所有数据
if (withdrawDetailList.value.length >= res.total) {
withdrawFinished.value = true;
}
withdrawParams.value.pageNum++;
}
} catch (err) {
console.log(err);
}
}
getWithdrawDetail();
</script>
<style scoped>
.mc-table {
padding: 10px;

215
app/pages/workflow-details/[id].vue
View File

@ -1,17 +1,22 @@
<script setup>
import { commonApi } from "@/api/common";
import { formatFileSize } from '@/utils/index.ts';
import { Close, DiamondSharp, PersonAddOutline } from '@vicons/ionicons5';
import { commonApi } from '@/api/common'
import { formatFileSize } from '@/utils/index.ts'
import { Close, DiamondSharp, PersonAddOutline } from '@vicons/ionicons5'
import {
CircleUser,
Download,
EllipsisVertical, Heart, Play, SquareCheck, SquarePlus
} from 'lucide-vue-next';
CircleUser,
Download,
EllipsisVertical,
Heart,
Play,
SquareCheck,
SquarePlus,
} from 'lucide-vue-next'
// import { NConfigProvider, NMessageProvider } from 'naive-ui';
import { nextTick, ref } from 'vue';
import { useRouter } from 'vue-router';
const userStore = useUserStore();
import { nextTick, ref } from 'vue'
import { useRouter } from 'vue-router'
const userStore = useUserStore()
const message = useMessage()
const router = useRouter()
@ -26,7 +31,7 @@ const activeTab = ref(null)
const commentHeight = ref(800)
const detailsInfo = ref({})
const currentUserInfo = ref({})
const isVisibleReport = ref(false);
const isVisibleReport = ref(false)
// 先获取用户信息 再获取版本信息
const versionByWorkInfo = ref([])
@ -103,11 +108,11 @@ async function getAttention() {
// 举报/编辑/删除
const isDelete = ref(false)
async function handleSelect(event,type) {
event.stopPropagation(); // 阻止事件冒泡
async function handleSelect(event, type) {
event.stopPropagation() // 阻止事件冒泡
if (type === 'report') {
// await request.get(`/WorkFlow/report?id=${id}`) // 举报
isVisibleReport.value = true;
isVisibleReport.value = true
}
else if (type === 'edit') {
router.push({
@ -177,103 +182,108 @@ async function onLike() {
}
}
// 举报
const reportParams = ref({
reportId: undefined,
text: "",
type:3
});
const reportList = ref([]);
text: '',
type: 3,
})
const reportList = ref([])
async function getDictType() {
try {
const res = await commonApi.dictType({ type: "report_type" });
const res = await commonApi.dictType({ type: 'report_type' })
if (res.code === 200) {
reportList.value = res.data;
reportList.value = res.data
}
} catch (error) {
console.log(error);
}
catch (error) {
console.log(error)
}
}
getDictType();
getDictType()
function handleChange(item) {
reportParams.value.reportId = item.dictValue;
if (item.dictValue !== "5") {
reportParams.value.text = "";
reportParams.value.reportId = item.dictValue
if (item.dictValue !== '5') {
reportParams.value.text = ''
}
console.log("object", reportParams.value);
console.log('object', reportParams.value)
}
function closeReport() {
isVisibleReport.value = false;
isVisibleReport.value = false
}
async function onReport(){
if( reportParams.value.reportId !== undefined){
async function onReport() {
if (reportParams.value.reportId !== undefined) {
reportParams.value.productId = detailsInfo.value.id
try{
try {
const res = await request.post('/report/addReport', reportParams.value)
if(res.code === 200){
message.success("举报成功");
if (res.code === 200) {
message.success('举报成功')
closeReport()
}
}catch(err){
console.log(err);
}
catch (err) {
console.log(err)
}
}
}
function toPersonalCenter(){
function toPersonalCenter() {
const baseUrl = window.location.origin
if(userStore?.userInfo?.userId === detailsInfo.value.userId){
if (userStore?.userInfo?.userId === detailsInfo.value.userId) {
window.open(`${baseUrl}/personal-center`, '_blank', 'noopener,noreferrer')
}else{
}
else {
window.open(`${baseUrl}/personal-publish?userId=${detailsInfo.value.userId}`, '_blank', 'noopener,noreferrer')
}
}
const currentTabsIndex = ref(0);
const currentTabsIndex = ref(0)
function handleTabChange(id) {
for (let i = 0; i < versionByWorkInfo.value.length; i++) {
if (id === versionByWorkInfo.value[i].id) {
currentTabsIndex.value = i;
currentTabsIndex.value = i
}
}
}
async function addCollect(){
async function addCollect() {
try {
const params = {
"productId": versionByWorkInfo.value[currentTabsIndex.value].id,
"collectType": 1,
productId: versionByWorkInfo.value[currentTabsIndex.value].id,
collectType: 1,
}
const res = await request.post("/collect/addCollect", params);
const res = await request.post('/collect/addCollect', params)
if (res.code === 200) {
versionByWorkInfo.value[currentTabsIndex.value].isCollect = res.data
if(res.data === 1){
message.success("已加入收藏");
}else{
message.success("已取消收藏");
if (res.data === 1) {
message.success('已加入收藏')
}
else {
message.success('已取消收藏')
}
}
} catch (err) {
console.log(err);
}
catch (err) {
console.log(err)
}
}
async function handelDown(){
async function handelDown() {
try {
const res = await request.get(`/WorkFlowVersion/workFlowFileDownload?id=${versionByWorkInfo.value[currentTabsIndex.value].id}`);
if (res.code === 200) {
const link = document.createElement('a');
link.href = res.data;
link.download = res.msg; // 自定义文件名
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
} catch (err) {
console.log(err);
const res = await request.get(`/WorkFlowVersion/workFlowFileDownload?id=${versionByWorkInfo.value[currentTabsIndex.value].id}`)
if (res.code === 200) {
const link = document.createElement('a')
link.href = res.data
link.download = res.msg // 自定义文件名
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
}
}
catch (err) {
console.log(err)
}
}
</script>
@ -313,10 +323,10 @@ async function handelDown(){
<div class="flex items-center bg-[#f4f5f9] px-2 rounded-full">
<!-- <img src="@/assets/img/heart.png" class="w-[14px] h-[14px] mr-1" alt=""> -->
<component
:is="Heart"
class="h-[12px] w-[12px] mr-1 text-[#000]"
/>
<span>{{ detailsInfo.likeCount }} </span>
:is="Heart"
class="h-[12px] w-[12px] mr-1 text-[#000]"
/>
<span>{{ detailsInfo.likeNum || 0 }} </span>
</div>
</template>
点赞数
@ -335,8 +345,9 @@ async function handelDown(){
<div class="flex w-full gap-1">
<div class="w-2/3">
<div class="w-full">
<n-tabs v-model:value="activeTab" type="line" animated
@update:value="handleTabChange"
<n-tabs
v-model:value="activeTab" type="line" animated
@update:value="handleTabChange"
>
<n-tab-pane
v-for="(item, index) in versionByWorkInfo"
@ -366,17 +377,17 @@ async function handelDown(){
</n-tabs>
</div>
<div class="mt-4">
<client-only>
<div style="padding: 20px">
<BaseComment v-if="detailsInfo.id" type="workflow" :height="commentHeight" :details-info="detailsInfo" />
<client-only>
<div style="padding: 20px">
<BaseComment v-if="detailsInfo.id" type="workflow" :height="commentHeight" :details-info="detailsInfo" />
<!-- <NConfigProvider>
<NMessageProvider>
<BaseComment v-if="detailsInfo.id" type="workflow" :height="commentHeight" :details-info="detailsInfo" />
</NMessageProvider>
</NConfigProvider> -->
</div>
</client-only>
</div>
</client-only>
</div>
</div>
<div class="w-1/3 mt-3">
@ -414,14 +425,14 @@ async function handelDown(){
</div>
<template v-if="userStore?.userInfo?.userId === detailsInfo.userId">
<div
class="menu-item hover:bg-gray-100 py-2 cursor-pointer rounded-lg"
@click="(event) => handleSelect(event, 'edit')"
>
编辑
</div>
<div class="menu-item hover:bg-gray-100 py-2 cursor-pointer rounded-lg" @click="(event) => handleSelect(event, 'delete')">
删除
</div>
class="menu-item hover:bg-gray-100 py-2 cursor-pointer rounded-lg"
@click="(event) => handleSelect(event, 'edit')"
>
编辑
</div>
<div class="menu-item hover:bg-gray-100 py-2 cursor-pointer rounded-lg" @click="(event) => handleSelect(event, 'delete')">
删除
</div>
</template>
</div>
</div>
@ -438,11 +449,11 @@ async function handelDown(){
> -->
<client-only>
<NAvatar
@click="toPersonalCenter"
class="w-full h-full mr-2 block cursor-pointer"
round
size="small"
:src="currentUserInfo.avatar"
@click="toPersonalCenter"
/>
</client-only>
</div>
@ -463,15 +474,15 @@ async function handelDown(){
</div>
</div>
<client-only>
<div class="flex-1 flex justify-end" v-if="userStore?.userInfo?.userId !== detailsInfo.userId">
<div class="flex items-center font-bold px-1 justify-center w-20 h-8 rounded-full text-[#426af7] border border-[#426af7] border-solid cursor-pointer" @click="onChangeAttention">
<n-icon v-if="detailsInfo.isAttention === 0" size="16" class="mr-2">
<PersonAddOutline />
</n-icon>
{{ detailsInfo.isAttention === 1 ? '已关注' : '关注' }}
<div v-if="userStore?.userInfo?.userId !== detailsInfo.userId" class="flex-1 flex justify-end">
<div class="flex items-center font-bold px-1 justify-center w-20 h-8 rounded-full text-[#426af7] border border-[#426af7] border-solid cursor-pointer" @click="onChangeAttention">
<n-icon v-if="detailsInfo.isAttention === 0" size="16" class="mr-2">
<PersonAddOutline />
</n-icon>
{{ detailsInfo.isAttention === 1 ? '已关注' : '关注' }}
</div>
</div>
</div>
</client-only>
</client-only>
</div>
<div class="flex items-center text-[#969798]">
@ -521,8 +532,8 @@ async function handelDown(){
<div class="flex gap-y-2">
<div
v-if="versionByWorkInfo.length > 0"
@click="addCollect"
class="flex flex-1 items-center justify-center bg-[#eceef4] h-[50px] mt-4 mr-1 rounded-md cursor-pointer"
@click="addCollect"
>
<component
:is="
@ -533,19 +544,19 @@ async function handelDown(){
class="h-[20px] w-[20px] text-black menu-icon m-1 text-[#969798]"
/>
<span class="mr-1">
{{ versionByWorkInfo[currentTabsIndex].isCollect === 0 ? '加入收藏' : '已收藏'}}
{{ versionByWorkInfo[currentTabsIndex].isCollect === 0 ? '加入收藏' : '已收藏' }}
</span>
</div>
<div
@click="handelDown"
class="flex flex-1 items-center bg-gradient-to-r from-[#ffe9c8] to-[#ffd264] justify-center ml-1 mt-4 text-black bg-[#eceef4] w-full rounded-md h-[50px] cursor-pointer"
@click="handelDown"
>
<component
:is="Download"
class="h-[20px] w-[20px] text-black menu-icon m-1 text-[#969798]"
/>
<span class="mr-1" v-if="versionByWorkInfo.length > 0"> 下载 {{ formatFileSize(versionByWorkInfo[currentTabsIndex].fileSize) }} </span>
<span v-if="versionByWorkInfo.length > 0" class="mr-1"> 下载 {{ formatFileSize(versionByWorkInfo[currentTabsIndex].fileSize) }} </span>
</div>
</div>
<!-- <div style="background: linear-gradient(135deg,#3cc9ff, #8fa6ff, 41%, #d8b4ff 74%,#326bff)" class="flex items-center justify-center mt-4 w-full h-14 text-black bg-[#fff] w-full rounded-md h-[80px] cursor-pointer hover:bg-[#f1f2f7]">
@ -575,7 +586,9 @@ async function handelDown(){
>
<div class="bg-white rounded-xl p-4">
<div class="flex items-center justify-between">
<div class="text-xl">举报</div>
<div class="text-xl">
举报
</div>
<div>
<n-icon size="20" class="mr-2 cursor-pointer" @click="closeReport">
<Close />
@ -584,10 +597,10 @@ async function handelDown(){
</div>
<div class="flex flex-col">
<n-radio
class="m-4 text-[#fff000]"
size="large"
v-for="(item, index) in reportList"
:key="index"
class="m-4 text-[#fff000]"
size="large"
:checked="reportParams.reportId === item.dictValue"
value="Definitely Maybe"
name="basic-demo"
@ -606,13 +619,13 @@ async function handelDown(){
}"
/>
<div
@click="onReport"
class="mt-4 w-[100%] h-10 flex rounded-lg text-white items-center justify-center cursor-pointer"
:class="[
reportParams.reportId !== undefined
? 'bg-[#4c79ee]'
: 'bg-[#cccccc]',
]"
@click="onReport"
>
确认
</div>
@ -659,14 +672,14 @@ async function handelDown(){
opacity 0.3s var(--n-bezier),
background-color 0.3s var(--n-bezier);
}
.original{
.original {
display: flex;
align-items: center;
justify-content: center;
margin: 2px 0;
padding: 2px 0;
width: 90px;
color: #aa8645;
color: #aa8645;
font-weight: 400;
background: linear-gradient(94.11deg, #efd6a9 10.52%, #f0dcbc 107.96%);
border-radius: 4px;

2
app/stores/user.ts
View File

@ -24,7 +24,7 @@ export const useUserStore = defineStore('user', () => {
function setUserInfo(info: any) {
userInfo.value = info
if(!info.avatar){
if (!info.avatar) {
userInfo.value.avatar = defaultAvatar
}
}

41
app/utils/request.ts
View File

@ -1,8 +1,9 @@
import type { AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios'
// utils/request.ts
import { useModalStore } from '@/stores/modal.ts';
import type { AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios';
import axios from 'axios';
import { createDiscreteApi } from 'naive-ui';
import { useModalStore } from '@/stores/modal.ts'
import axios from 'axios'
import { createDiscreteApi } from 'naive-ui'
const { message, loadingBar } = createDiscreteApi(['message', 'loadingBar'])
// 定义响应数据接口
@ -25,15 +26,15 @@ class RequestHttp {
// 请求拦截器
this.instance.interceptors.request.use(
(config:any) => {
(config: any) => {
const userStore = useUserStore()
const isToken = (config.headers || {}).isToken === false
if (userStore.token && !isToken) {
config.headers.Authorization = `Bearer ${userStore.token}` // 让每个请求携带自定义token 请根据实际情况自行修改
}
// if (userStore.token && !isToken) {
// config.headers.Authorization = `Bearer eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6IjA1NDk1MmNmLTg2YTgtNDZkNC05OWU0LWUzYzU5ODFjZGE2OSJ9.fifWwKgHIswkqGLqp71BWx-UJjv_qYiPO_XeMYt2HkzLfEoDVVpdHysebp_2XNWdjLi4weRga1GzlUBdW_xebw` // 让每个请求携带自定义token 请根据实际情况自行修改
// config.headers.Authorization = `Bearer eyJhbGciOiJIUzUxMiJ9.eyJsb2dpbl91c2VyX2tleSI6IjA1NDk1MmNmLTg2YTgtNDZkNC05OWU0LWUzYzU5ODFjZGE2OSJ9.fifWwKgHIswkqGLqp71BWx-UJjv_qYiPO_XeMYt2HkzLfEoDVVpdHysebp_2XNWdjLi4weRga1GzlUBdW_xebw` // 让每个请求携带自定义token 请根据实际情况自行修改
// }
// 开启 loading
if (config.loading) {
@ -41,7 +42,7 @@ class RequestHttp {
}
return config
},
(error:any) => {
(error: any) => {
return Promise.reject(error)
},
)
@ -54,19 +55,18 @@ class RequestHttp {
if (config.loading) {
loadingBar.finish()
}
// 处理业务状态码
if (data.code !== 200) {
this.handleError(data.code)
this.handleError(data.code, data)
// token过期以后，需要重新登录
if (data.code === 401) {
// message.error(data.message || '登录已过期,请重新登录')
// const modalStore = useModalStore()
const modalStore = useModalStore();
modalStore.showLoginModal();
const modalStore = useModalStore()
modalStore.showLoginModal()
const userStore = useUserStore()
try {
// eslint-disable-next-line ts/no-use-before-define
// await request.post('/logout')
// userStore.logout()
// navigateTo('/model-square')
@ -75,18 +75,22 @@ class RequestHttp {
console.log(error)
}
}
// if(data.code === 12202){
// message.error(data.msg)
// }
return Promise.reject(data)
}
return data
},
(error:any) => {
(error: any) => {
// 关闭 loading
loadingBar.error()
// 处理错误
if (error.response) {
this.handleError(error.response.status)
this.handleError(error.response.status, {})
}
else {
message.error('网络连接异常')
@ -98,7 +102,10 @@ class RequestHttp {
}
// 处理错误状态码
private handleError(status: number): void {
private handleError(status: number, data: any): void {
if (data.code && data.code === 12202) {
return message.error(data.msg)
}
switch (status) {
case 400:
message.error('请求参数错误')

BIN
assets/img/encryption.png 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 463 B

9
nuxt.config.ts
View File

@ -5,6 +5,7 @@ import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
import Components from 'unplugin-vue-components/vite'
import { pwa } from './app/config/pwa'
import { appDescription } from './app/constants/index'
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)
@ -83,16 +84,16 @@ export default defineNuxtConfig({
preset: 'node-server',
devProxy: {
'/api': {
target: 'http://113.45.190.154:8080', // 线上
// target: 'http://192.168.2.10:8080', // 代
// target: 'http://192.168.2.5:8080', // 嗨
// target: 'http://113.45.190.154:8080', // 线上
// target: 'http://192.168.2.29:8080', // 代
target: 'http://192.168.2.4:8080', // 嗨
// target: 'https://2d1a399f.r27.cpolar.top', // 嗨
changeOrigin: true,
prependPath: true,
},
},
esbuild: {
options: { target: 'esnext' },
options: { target: 'es2019' },
},
prerender: {
crawlLinks: false,

4
package.json
View File

@ -1,13 +1,13 @@
{
"name": "mcwl",
"version": "1.0.0",
"type": "module",
"version": "1.0.0",
"private": true,
"packageManager": "pnpm@9.15.1",
"scripts": {
"build": "nuxi build --dotenv .env.pro",
"dev:pwa": "VITE_PLUGIN_PWA=true nuxi dev",
"dev": "nuxi dev --port 3002",
"dev": "nuxi dev --port 3080",
"generate": "nuxi generate",
"prepare": "nuxi prepare",
"start": "node .output/server/index.mjs",