fix(styles): 产品模块 UI 更新

This commit is contained in:
ronger 2024-02-03 10:58:54 +08:00
parent f27ebf97a1
commit c1fd19cc98
7 changed files with 45 additions and 20 deletions

View File

@ -266,7 +266,7 @@ export default {
tab: '\t',
cdn: apiConfig.VDITOR,
cache: {
enable: this.postId ? false : true,
enable: !this.postId,
id: this.postId ? this.postId : '',
},
after() {

View File

@ -1,18 +1,30 @@
<template>
<div class="wrapper">
<el-row class="row-cards row-deck" :gutter="20">
<el-col :span="8" v-for="product in products.list" :key="product.idProduct" style="margin-right: 20px;">
<el-col :span="10" v-for="product in products.list" :key="product.idProduct" style="margin-right: 20px;margin-bottom: 10px;">
<el-card :body-style="{ padding: '20px' }">
<el-col :span="24">
<el-image :src="product.productImgUrl"
style="border-radius: 10px;background: #f5f7fa;border: #f5f7fa solid 1px;" fit="cover"></el-image>
</el-col>
<el-col style="padding-top: 20px;font-size: 16px;line-height: 22px;font-weight: 500;margin-bottom: 4px;">
<span v-html="product.productTitle"></span>
<el-col :span="24">
<el-tag
style="margin-right: 0.5rem;"
v-for="tag in product.tags?.split(',') || []"
:key="tag"
size="small"
effect="plain">
# {{ tag }}
</el-tag>
</el-col>
<el-col style="padding-top: 30px;text-align: right;">
<!-- <el-button type="text" class="button">立即购买</el-button>-->
<el-button type="text" class="button" @click="handleClick(product.idProduct)">查看详情</el-button>
<el-col :span="24" style="font-size: 16px;line-height: 22px;font-weight: 500;margin: 4px 0;text-align: center;">
<span style="font-weight: bolder;" v-html="product.productTitle"></span>
</el-col>
<el-col span="24">
<small v-html="product.productDescription"></small>
</el-col>
<el-col :span="24" style="text-align: center;">
<el-button type="text" class="button" @click="handleClick(product.idProduct)">了解更多</el-button>
</el-col>
</el-card>
</el-col>

View File

@ -1,4 +1,4 @@
import {NODE_ENV} from '../environment'
import {NODE_ENV} from '@/environment'
const apisMap = {
development: {
@ -8,8 +8,8 @@ const apisMap = {
PROXY: '/proxy',
SOCKET: 'http://localhost:3000/ws',
GRAVATAR: '/proxy/static.rymcu.com/avatar',
VDITOR: 'https://static.rymcu.com/vditor@3.8.14/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.8.14/dist/css/content-theme'
VDITOR: 'https://static.rymcu.com/vditor@3.9.8/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.9.8/dist/css/content-theme'
},
test: {
FE: 'https://rymcu.com',
@ -18,8 +18,8 @@ const apisMap = {
PROXY: 'https://static.rymcu.com/proxy',
SOCKET: 'https://rymcu.com/wss',
GRAVATAR: 'https://static.rymcu.com/avatar',
VDITOR: 'https://static.rymcu.com/vditor@3.8.14/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.8.14/dist/css/content-theme'
VDITOR: 'https://static.rymcu.com/vditor@3.9.8/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.9.8/dist/css/content-theme'
},
production: {
FE: 'https://rymcu.com',
@ -28,8 +28,8 @@ const apisMap = {
PROXY: 'https://static.rymcu.com/proxy',
SOCKET: 'https://rymcu.com/wss',
GRAVATAR: 'https://static.rymcu.com/avatar',
VDITOR: 'https://static.rymcu.com/vditor@3.8.14/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.8.14/dist/css/content-theme'
VDITOR: 'https://static.rymcu.com/vditor@3.9.8/',
VDITOR_CSS: 'https://static.rymcu.com/vditor@3.9.8/dist/css/content-theme'
}
}

View File

@ -46,7 +46,7 @@ export default {
** Global CSS
*/
css: [
'element-ui/lib/theme-chalk/index.css',
'element-ui/lib/theme-chalk/index.css'
],
/*
** Plugins to load before mounting the App
@ -72,7 +72,7 @@ export default {
'@nuxtjs/axios',
'@nuxtjs/proxy',
'@nuxtjs/auth-next',
'@nuxtjs/device',
'@nuxtjs/device'
],
auth: {
redirect: {
@ -128,7 +128,7 @@ export default {
** See https://nuxtjs.org/api/configuration-build/
*/
build: {
transpile: [/^element-ui/,'defu'],
transpile: [/^element-ui/, 'defu'],
optimization: {
splitChunks: {
minSize: 10000,

View File

@ -27,7 +27,7 @@
"raw-loader": "^4.0.2",
"save-svg-as-png": "^1.4.17",
"simple-icons": "^6.23.0",
"vditor": "^3.8.18",
"vditor": "^3.9.8",
"vue-cropper": "^0.6.2",
"vue-sse": "^2.5.2",
"vuejs-avataaars": "^4.0.1"

View File

@ -197,7 +197,7 @@
// Vue.Vditor.highlightRender({style: 'github'}, element, this.contentEditor);
},
theme: {
cdn: apiConfig.VDITOR_CSS
path: apiConfig.VDITOR_CSS
}
},
upload: {
@ -427,8 +427,11 @@
height: 480,
placeholder: '', //_ts.$t('inputContent', _ts.$store.state.locale)
resize: false,
value: articleContent
value: ''
});
let mark = _ts.contentEditor.html2md(articleContent);
_ts.contentEditor.setValue(mark);
})
}
}

View File

@ -8,6 +8,16 @@
{{ product.productTitle }}
</h1>
</div>
<div style="margin: 1rem 0;">
<el-tag
style="margin-right: 0.5rem;"
v-for="tag in product.tags?.split(',') || []"
:key="tag"
size="small"
effect="plain">
# {{ tag }}
</el-tag>
</div>
<div class="pt-7 pipe-content__reset vditor-reset" id="articleContent" v-html="product.productContent"
style="overflow: hidden;"></div>
</div>