12 changed files with 142 additions and 577 deletions
@ -1,71 +0,0 @@ |
|||
<template> |
|||
<div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load"> |
|||
<el-row :gutter="24" class="flex"> |
|||
<template v-for="(item,index) in list" :key="index"> |
|||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs"> |
|||
<el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @click="openSpmUrl(`/item`, item,item.companyId,true)"> |
|||
<el-image |
|||
:src="item.image" |
|||
:fit="fit" :lazy="true" class="w-full md:h-[150px] h-[199px] cursor-pointer bg-gray-50"/> |
|||
<div class="flex-1 px-4 py-5 sm:p-6 !p-4"> |
|||
<div class="text-gray-700 dark:text-white text-base font-semibold flex flex-col gap-1.5"> |
|||
<div class="flex-1 text-xl cursor-pointer flex items-center"> |
|||
{{ item.shortName }} |
|||
<el-tag v-if="item.chargingMethod === 0" size="small" type="success" class="text-white ml-2" effect="dark">免费</el-tag> |
|||
</div> |
|||
</div> |
|||
<div class="flex items-center gap-1.5 py-2 text-gray-500 justify-between"> |
|||
<div class="text-gray-500 line-clamp-2">{{ item.comments }}</div> |
|||
</div> |
|||
<div class="button-group flex justify-between items-center mt-3"> |
|||
<el-space class="flex items-end"> |
|||
<el-avatar size="small" :src="item.companyLogo" /> |
|||
<span class="text-gray-400 line-clamp-1 pr-2">{{ item.companyName }}</span> |
|||
</el-space> |
|||
<el-button type="warning" v-if="item.price" @click.stop="openSpmUrl(`/product/create`,item,item.companyId,true)"> |
|||
<div class="flex items-center"> |
|||
<span>￥{{ item.price }}</span> |
|||
<span v-if="item.chargingMethod == 2">/年</span> |
|||
<span v-if="item.chargingMethod == 3">/月</span> |
|||
<span v-if="item.chargingMethod == 4">/天</span> |
|||
</div> |
|||
</el-button> |
|||
<el-button v-else type="success" @click.stop="openSpmUrl(`/product/create`,item,item.companyId,true)">立即开通 |
|||
</el-button> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
</el-col> |
|||
</template> |
|||
</el-row> |
|||
</div> |
|||
<div v-if="disabled" class="px-1 text-center text-gray-500 min-h-xs"> |
|||
没有更多了 |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import {openSpmUrl} from "~/utils/common"; |
|||
import type {Company} from "~/api/system/company/model"; |
|||
|
|||
const props = withDefaults( |
|||
defineProps<{ |
|||
list?: Company[]; |
|||
disabled?: boolean; |
|||
fit?: any; |
|||
}>(), |
|||
{ |
|||
fit: 'cover' |
|||
} |
|||
); |
|||
|
|||
const emit = defineEmits<{ |
|||
(e: 'done'): void; |
|||
}>(); |
|||
|
|||
const load = () => { |
|||
if(!props.disabled){ |
|||
emit('done') |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,115 +0,0 @@ |
|||
<template> |
|||
<div class="banner m-auto relative sm:flex"> |
|||
<svg viewBox="0 0 1440 181" fill="none" xmlns="http://www.w3.org/2000/svg" |
|||
class="pointer-events-none absolute w-full top-[-2px] transition-all text-green-5 flex-shrink-0 opacity-100 duration-[400ms] opacity-80 -z-10"> |
|||
<mask id="path-1-inside-1_414_5526" fill="white"> |
|||
<path d="M0 0H1440V181H0V0Z"></path> |
|||
</mask> |
|||
<path d="M0 0H1440V181H0V0Z" fill="url(#paint0_linear_414_5526)" fill-opacity="0.22"></path> |
|||
<path d="M0 2H1440V-2H0V2Z" fill="url(#paint1_linear_414_5526)" mask="url(#path-1-inside-1_414_5526)"></path> |
|||
<defs> |
|||
<linearGradient id="paint0_linear_414_5526" x1="720" y1="0" x2="720" y2="181" gradientUnits="userSpaceOnUse"> |
|||
<stop stop-color="currentColor"></stop> |
|||
<stop offset="1" stop-color="currentColor" stop-opacity="0"></stop> |
|||
</linearGradient> |
|||
<linearGradient id="paint1_linear_414_5526" x1="0" y1="90.5" x2="1440" y2="90.5" gradientUnits="userSpaceOnUse"> |
|||
<stop stop-color="currentColor" stop-opacity="0"></stop> |
|||
<stop offset="0.395" stop-color="currentColor"></stop> |
|||
<stop offset="1" stop-color="currentColor" stop-opacity="0"></stop> |
|||
</linearGradient> |
|||
</defs> |
|||
</svg> |
|||
<div class="md:w-screen-xl m-auto md:p-0 px-4"> |
|||
<div class="py-8 sm:py-16" _path="/templates" _dir="" _draft="false" _partial="false" _locale="" |
|||
_id="content:4.templates.yml" _type="yaml" _source="content" _file="4.templates.yml" _stem="4.templates" |
|||
_extension="yml"> |
|||
<div class="gap-8 sm:gap-y-16 grid lg:grid-cols-2 lg:items-center" v-if="layout"> |
|||
<div class=""> |
|||
<h1 |
|||
class="text-3xl font-bold tracking-tight text-gray-900 dark:text-white sm:text-4xl lg:text-5xl"> |
|||
<span v-if="layout.title">{{ layout.title }}</span> |
|||
<span v-if="layout.name">{{ layout.name }}</span> |
|||
</h1> |
|||
|
|||
<div class="mt-4 text-lg text-gray-500 dark:text-gray-400"> |
|||
{{ layout.description }} |
|||
</div> |
|||
<div class="flex justify-between w-full items-center mt-4"> |
|||
<el-space> |
|||
<div class="w-[500px]"> |
|||
<el-input |
|||
v-model="where.keywords" |
|||
placeholder="搜索" |
|||
:prefix-icon="Search" |
|||
@keydown.enter="handleClick" |
|||
> |
|||
<template #append> |
|||
<el-button size="large" type="primary" @click="handleClick">搜索</el-button> |
|||
</template> |
|||
</el-input> |
|||
</div> |
|||
<el-button |
|||
size="large" |
|||
@click="openSpmUrl(`/passport/login`)" |
|||
> |
|||
创建 |
|||
</el-button> |
|||
</el-space> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { Search } from '@element-plus/icons-vue' |
|||
import {useConfigInfo} from "~/composables/configState"; |
|||
import {openSpmUrl} from "~/utils/common"; |
|||
import type {CompanyParam} from "~/api/system/company/model"; |
|||
|
|||
const token = useToken(); |
|||
const sysDomain = useSysDomain(); |
|||
|
|||
withDefaults( |
|||
defineProps<{ |
|||
layout?: any; |
|||
title?: string; |
|||
desc?: string; |
|||
buyUrl?: string; |
|||
}>(), |
|||
{ |
|||
title: 'Templates', |
|||
desc: 'Explore community templates to get up and running in a few seconds.', |
|||
demoUrl: '/product/website', |
|||
buyUrl: 'https://github.com/websoft9/ansible-templates' |
|||
} |
|||
); |
|||
|
|||
// 搜索表单 |
|||
const where = reactive<CompanyParam>({ |
|||
keywords: '' |
|||
}); |
|||
|
|||
const config = useConfigInfo(); |
|||
// 搜索结果 |
|||
const handleClick = async () => { |
|||
if (where.keywords == '') { |
|||
return false; |
|||
} |
|||
if(activeName.value == 'web'){ |
|||
const {data: response} = await useServerRequest<ApiResult<PageResult<Website>>>('/cms/cms-website/page',{baseURL: runtimeConfig.public.apiServer, params: { |
|||
page: page.value, keywords: where.keywords |
|||
}}) |
|||
if(response.value?.data){ |
|||
if (response.value?.data.list) { |
|||
websites.value = response.value?.data.list; |
|||
} |
|||
if(response.value.data.count == 0){ |
|||
resultText.value = '暂无相关结果' |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,114 +0,0 @@ |
|||
<!-- 文章详情 --> |
|||
<template> |
|||
<PageContainer :form="form" /> |
|||
|
|||
<div class="page-main md:w-screen-xl m-auto bg-white rounded-lg"> |
|||
<div class="p-4 leading-7" v-html="form?.content"> |
|||
</div> |
|||
</div> |
|||
|
|||
</template> |
|||
<script setup lang="ts"> |
|||
import type {ApiResult} from "~/api"; |
|||
import {useServerRequest} from "~/composables/useServerRequest"; |
|||
import {useWebsite} from "~/composables/configState"; |
|||
import type {BreadcrumbItem} from "~/types/global"; |
|||
import type {Navigation} from "~/api/cms/navigation/model"; |
|||
import {getIdBySpm} from "~/utils/common"; |
|||
import type {Article} from "~/api/cms/article/model"; |
|||
import useFormData from "~/utils/use-form-data"; |
|||
|
|||
// 引入状态管理 |
|||
const route = useRoute(); |
|||
const website = useWebsite(); |
|||
const breadcrumb = ref<BreadcrumbItem>(); |
|||
|
|||
|
|||
// 配置信息 |
|||
const { form, assignFields } = useFormData<Article>({ |
|||
// 文章id |
|||
articleId: undefined, |
|||
// 文章标题 |
|||
title: undefined, |
|||
// 分类类型 |
|||
type: undefined, |
|||
// 展现方式 |
|||
showType: undefined, |
|||
// 文章类型 |
|||
categoryId: undefined, |
|||
// 文章分类 |
|||
categoryName: undefined, |
|||
parentId: undefined, |
|||
parentName: undefined, |
|||
// 封面图 |
|||
image: undefined, |
|||
// 附件 |
|||
files: undefined, |
|||
// 缩列图 |
|||
thumbnail: undefined, |
|||
// 视频地址 |
|||
video: undefined, |
|||
// 上传的文件类型 |
|||
accept: undefined, |
|||
// 来源 |
|||
source: undefined, |
|||
// 文章内容 |
|||
content: undefined, |
|||
// 虚拟阅读量 |
|||
virtualViews: undefined, |
|||
// 实际阅读量 |
|||
actualViews: undefined, |
|||
// 用户ID |
|||
userId: undefined, |
|||
// 用户昵称 |
|||
nickname: undefined, |
|||
// 账号 |
|||
username: undefined, |
|||
// 用户头像 |
|||
userAvatar: undefined, |
|||
// 所属门店ID |
|||
shopId: undefined, |
|||
// |
|||
likes: undefined, |
|||
// 排序 |
|||
sortNumber: undefined, |
|||
// 备注 |
|||
comments: undefined, |
|||
// 状态 |
|||
status: undefined, |
|||
// 创建时间 |
|||
createTime: undefined, |
|||
// 更新时间 |
|||
updateTime: undefined |
|||
}); |
|||
|
|||
// 请求数据 |
|||
const reload = async () => { |
|||
|
|||
// 存在spm(优先级高) |
|||
const { data: nav } = await useServerRequest<ApiResult<Navigation>>('/cms/cms-article/' + getIdBySpm(5)) |
|||
if (nav.value?.data) { |
|||
assignFields(nav.value.data) |
|||
} |
|||
|
|||
// seo |
|||
useHead({ |
|||
title: `${form.title} - ${website.value.websiteName}`, |
|||
bodyAttrs: { |
|||
class: "page-container", |
|||
} |
|||
}); |
|||
// 面包屑 |
|||
breadcrumb.value = form |
|||
} |
|||
|
|||
watch( |
|||
() => route.path, |
|||
(path) => { |
|||
console.log(path,'=>Path') |
|||
|
|||
reload(); |
|||
}, |
|||
{ immediate: true } |
|||
); |
|||
</script> |
|||
@ -1,99 +0,0 @@ |
|||
<template> |
|||
<div class="banner m-auto relative sm:flex"> |
|||
<svg viewBox="0 0 1440 181" fill="none" xmlns="http://www.w3.org/2000/svg" |
|||
class="pointer-events-none absolute w-full top-[-2px] transition-all text-green-5 flex-shrink-0 opacity-100 duration-[400ms] opacity-80 -z-10"> |
|||
<mask id="path-1-inside-1_414_5526" fill="white"> |
|||
<path d="M0 0H1440V181H0V0Z"></path> |
|||
</mask> |
|||
<path d="M0 0H1440V181H0V0Z" fill="url(#paint0_linear_414_5526)" fill-opacity="0.22"></path> |
|||
<path d="M0 2H1440V-2H0V2Z" fill="url(#paint1_linear_414_5526)" mask="url(#path-1-inside-1_414_5526)"></path> |
|||
<defs> |
|||
<linearGradient id="paint0_linear_414_5526" x1="720" y1="0" x2="720" y2="181" gradientUnits="userSpaceOnUse"> |
|||
<stop stop-color="currentColor"></stop> |
|||
<stop offset="1" stop-color="currentColor" stop-opacity="0"></stop> |
|||
</linearGradient> |
|||
<linearGradient id="paint1_linear_414_5526" x1="0" y1="90.5" x2="1440" y2="90.5" gradientUnits="userSpaceOnUse"> |
|||
<stop stop-color="currentColor" stop-opacity="0"></stop> |
|||
<stop offset="0.395" stop-color="currentColor"></stop> |
|||
<stop offset="1" stop-color="currentColor" stop-opacity="0"></stop> |
|||
</linearGradient> |
|||
</defs> |
|||
</svg> |
|||
<div class="md:w-screen-xl m-auto"> |
|||
<Breadcrumb :data="form" /> |
|||
<div class="py-8 sm:py-16" _path="/templates" _dir="" _draft="false" _partial="false" _locale="" |
|||
_id="content:4.templates.yml" _type="yaml" _source="content" _file="4.templates.yml" _stem="4.templates" |
|||
_extension="yml"> |
|||
<div class="gap-8 sm:gap-y-16 lg:items-center" v-if="form"> |
|||
<div class="w-full"> |
|||
<h1 |
|||
class="text-2xl font-bold tracking-tight text-gray-900 dark:text-white sm:text-3xl lg:text-4xl"> |
|||
<span v-if="form.title">{{ form.title }}</span> |
|||
</h1> |
|||
|
|||
<div class="mt-4 text-gray-500 dark:text-gray-400"> |
|||
<span>{{ form.nickname }}</span> · {{ form.createTime }} |
|||
</div> |
|||
|
|||
<el-space class="mt-4"> |
|||
<el-button |
|||
:icon="ElIconView" |
|||
size="large" |
|||
v-if="form.demoUrl" |
|||
@click="openSpmUrl(form.demoUrl)" |
|||
> |
|||
演示地址 |
|||
</el-button> |
|||
<el-button |
|||
v-if="form.buyUrl" |
|||
:icon="ElIconBottom" |
|||
size="large" |
|||
@click="openSpmUrl(form.buyUrl)" |
|||
> |
|||
下载模版 |
|||
</el-button> |
|||
<el-button |
|||
:icon="ElIconMemo" |
|||
size="large" |
|||
v-if="form.docUrl" |
|||
@click="openSpmUrl(form.docUrl)" |
|||
> |
|||
帮助文档 |
|||
</el-button> |
|||
</el-space> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import {useConfigInfo} from "~/composables/configState"; |
|||
import {openSpmUrl} from "~/utils/common"; |
|||
import Breadcrumb from "~/components/Breadcrumb.vue"; |
|||
import type {Article} from "~/api/cms/article/model"; |
|||
|
|||
|
|||
const token = useToken(); |
|||
const sysDomain = useSysDomain(); |
|||
|
|||
withDefaults( |
|||
defineProps<{ |
|||
form?: Article; |
|||
title?: string; |
|||
desc?: string; |
|||
buyUrl?: string; |
|||
}>(), |
|||
{ |
|||
title: 'Templates', |
|||
desc: 'Explore community templates to get up and running in a few seconds.', |
|||
demoUrl: '/product/website', |
|||
buyUrl: 'https://github.com/websoft9/ansible-templates' |
|||
} |
|||
); |
|||
|
|||
const config = useConfigInfo(); |
|||
|
|||
</script> |
|||
@ -1,84 +0,0 @@ |
|||
<template> |
|||
<PageBanner :layout="layout" :title="`${form?.categoryName}`" :desc="`${form?.comments}`" /> |
|||
<CardList :param="{type: 0,official: true}" :list="list" :disabled="disabled" @done="onSearch" /> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import type {ApiResult, PageResult} from "~/api"; |
|||
import {useServerRequest} from "~/composables/useServerRequest"; |
|||
import type {Navigation} from "~/api/cms/navigation/model"; |
|||
import type {Company, CompanyParam} from "~/api/system/company/model"; |
|||
import CardList from './components/CardList.vue'; |
|||
|
|||
const route = useRoute(); |
|||
|
|||
// 页面信息 |
|||
const runtimeConfig = useRuntimeConfig(); |
|||
const list = ref<Company[]>([]); |
|||
const page = ref<number>(1); |
|||
const resultText = ref(''); |
|||
const layout = ref<any>(); |
|||
const disabled = ref<boolean>(false); |
|||
|
|||
// 获取状态 |
|||
const form = ref<Navigation>(); |
|||
|
|||
// 搜索表单 |
|||
const where = reactive<CompanyParam>({ |
|||
keywords: '' |
|||
}); |
|||
|
|||
const onSearch = () => { |
|||
if(!disabled.value){ |
|||
page.value++; |
|||
reload(route.path); |
|||
} |
|||
} |
|||
|
|||
// 请求数据 |
|||
const reload = async (path: string) => { |
|||
const {data: response} = await useServerRequest<ApiResult<PageResult<Company>>>('/system/company/pageAll',{baseURL: runtimeConfig.public.apiServer, params: { |
|||
page: page.value, |
|||
limit: 8, |
|||
official: false, |
|||
keywords: where.keywords |
|||
}}) |
|||
if(response.value?.data){ |
|||
if (list.value.length < response.value?.data.count) { |
|||
disabled.value = false; |
|||
if (response.value?.data.list) { |
|||
list.value = list.value.concat(response.value?.data.list); |
|||
} |
|||
}else { |
|||
disabled.value = true; |
|||
} |
|||
if(response.value.data.count == 0){ |
|||
resultText.value = '暂无相关结果' |
|||
} |
|||
} |
|||
} |
|||
|
|||
const { data: nav } = await useServerRequest<ApiResult<Navigation>>(`/cms/cms-navigation/${getIdBySpm(5)}`) |
|||
if(nav.value?.data){ |
|||
form.value = nav.value?.data; |
|||
useHead({ |
|||
title: `${form.value.title} - WEBSOFT`, |
|||
bodyAttrs: { |
|||
class: "page-container", |
|||
} |
|||
}); |
|||
} |
|||
// 页面布局 |
|||
if(form.value?.layout){ |
|||
layout.value = JSON.parse(form.value?.layout) |
|||
} |
|||
|
|||
|
|||
|
|||
watch( |
|||
() => route.path, |
|||
(path) => { |
|||
reload(path); |
|||
}, |
|||
{ immediate: true } |
|||
); |
|||
</script> |
|||
Loading…
Reference in new issue