huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善页面6

Browse Source
This commit is contained in:
huangzhenbao
2026-02-13 01:13:21 +08:00
parent 1b558e3117
commit da1075b9e9
15 changed files with 1331 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
layouts/admin/router/adminComponentMap.uts
View File

@@ -170,8 +170,18 @@ export const componentMap: Map<string, any> = new Map([
['DecorationLink', defineAsyncComponent(() => import('@/pages/mall/admin/design/link-management.uvue'))],
// 应用模块
['AppStatistic', PlaceholderPage],
['AppList', PlaceholderPage],
['AppWechatMenu', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/menu.uvue'))],
['AppWechatNews', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/news.uvue'))],
['AppWechatReplyFollow', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/reply/follow.uvue'))],
['AppWechatReplyKeyword', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/reply/keyword.uvue'))],
['AppWechatReplyInvalid', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/reply/invalid.uvue'))],
['AppWechatConfig', defineAsyncComponent(() => import('@/pages/mall/admin/app/wechat/config.uvue'))],
['AppRoutineDownload', defineAsyncComponent(() => import('@/pages/mall/admin/app/routine/download.uvue'))],
['AppRoutineConfig', defineAsyncComponent(() => import('@/pages/mall/admin/app/routine/config.uvue'))],
['AppMobileConfig', defineAsyncComponent(() => import('@/pages/mall/admin/app/mobile/config.uvue'))],
['AppMobileVersion', defineAsyncComponent(() => import('@/pages/mall/admin/app/mobile/version.uvue'))],
['AppPcDesign', defineAsyncComponent(() => import('@/pages/mall/admin/app/pc/design.uvue'))],
['AppPcConfig', defineAsyncComponent(() => import('@/pages/mall/admin/app/pc/config.uvue'))],
// 维护模块
['MaintainDevConfig', defineAsyncComponent(() => import('@/pages/mall/admin/maintain/dev-config/category.uvue'))],

44
layouts/admin/router/adminRoutes.uts
View File

@@ -173,10 +173,13 @@ export const topMenus: TopMenu[] = [
id: 'app',
title: '应用',
icon: 'app',
path: '/pages/mall/admin/app/statistic',
path: '/pages/mall/admin/app/wechat/menu',
order: 11,
groups: [
{ id: 'app-manage', title: '', order: 1 }
{ id: 'app-wechat', title: '公众号', order: 1 },
{ id: 'app-routine', title: '小程序', order: 2 },
{ id: 'app-mobile', title: 'APP', order: 3 },
{ id: 'app-pc', title: 'PC端', order: 4 }
]
},
{
@@ -1102,24 +1105,25 @@ export const routes: RouteRecord[] = [
{ id: 'setting_api_pay', title: '商城支付配置', path: '/pages/mall/admin/setting/interface/payment', componentKey: 'SettingInterfacePayment', parentId: 'setting', groupId: 'setting-interface', order: 8 },
// ========== 应用模块 ==========
{
id: 'app_statistic',
title: '应用统计',
path: '/pages/mall/admin/app/statistic',
componentKey: 'AppStatistic',
parentId: 'app',
groupId: 'app-manage',
order: 1
},
{
id: 'app_list',
title: '应用列表',
path: '/pages/mall/admin/app/list',
componentKey: 'AppList',
parentId: 'app',
groupId: 'app-manage',
order: 2
},
// 1. 公众号
{ id: 'app_wechat_menu', title: '微信菜单', path: '/pages/mall/admin/app/wechat/menu', componentKey: 'AppWechatMenu', parentId: 'app', groupId: 'app-wechat', order: 1 },
{ id: 'app_wechat_news', title: '图文管理', path: '/pages/mall/admin/app/wechat/news', componentKey: 'AppWechatNews', parentId: 'app', groupId: 'app-wechat', order: 2 },
{ id: 'app_wechat_reply_follow', title: '关注回复', path: '/pages/mall/admin/app/wechat/reply/follow', componentKey: 'AppWechatReplyFollow', parentId: 'app', groupId: 'app-wechat', order: 3 },
{ id: 'app_wechat_reply_keyword', title: '关键字回复', path: '/pages/mall/admin/app/wechat/reply/keyword', componentKey: 'AppWechatReplyKeyword', parentId: 'app', groupId: 'app-wechat', order: 4 },
{ id: 'app_wechat_reply_invalid', title: '无效词回复', path: '/pages/mall/admin/app/wechat/reply/invalid', componentKey: 'AppWechatReplyInvalid', parentId: 'app', groupId: 'app-wechat', order: 5 },
{ id: 'app_wechat_config', title: '公众号配置', path: '/pages/mall/admin/app/wechat/config', componentKey: 'AppWechatConfig', parentId: 'app', groupId: 'app-wechat', order: 6 },
// 2. 小程序
{ id: 'app_routine_download', title: '小程序下载', path: '/pages/mall/admin/app/routine/download', componentKey: 'AppRoutineDownload', parentId: 'app', groupId: 'app-routine', order: 1 },
{ id: 'app_routine_config', title: '小程序配置', path: '/pages/mall/admin/app/routine/config', componentKey: 'AppRoutineConfig', parentId: 'app', groupId: 'app-routine', order: 2 },
// 3. APP
{ id: 'app_mobile_config', title: 'APP配置', path: '/pages/mall/admin/app/mobile/config', componentKey: 'AppMobileConfig', parentId: 'app', groupId: 'app-mobile', order: 1 },
{ id: 'app_mobile_version', title: '版本管理', path: '/pages/mall/admin/app/mobile/version', componentKey: 'AppMobileVersion', parentId: 'app', groupId: 'app-mobile', order: 2 },
// 4. PC端
{ id: 'app_pc_design', title: 'PC端装修', path: '/pages/mall/admin/app/pc/design', componentKey: 'AppPcDesign', parentId: 'app', groupId: 'app-pc', order: 1 },
{ id: 'app_pc_config', title: 'PC端配置', path: '/pages/mall/admin/app/pc/config', componentKey: 'AppPcConfig', parentId: 'app', groupId: 'app-pc', order: 2 },
// ========== 维护模块 ==========
// 开发配置

84
pages.json
View File

@@ -759,6 +759,90 @@
"navigationBarTitleText": "商城支付配置",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/menu",
"style": {
"navigationBarTitleText": "微信菜单",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/news",
"style": {
"navigationBarTitleText": "图文管理",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/reply/follow",
"style": {
"navigationBarTitleText": "微信关注回复",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/reply/keyword",
"style": {
"navigationBarTitleText": "关键字回复",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/reply/invalid",
"style": {
"navigationBarTitleText": "无效关键词回复",
"navigationStyle": "custom"
}
},
{
"path": "app/wechat/config",
"style": {
"navigationBarTitleText": "公众号配置",
"navigationStyle": "custom"
}
},
{
"path": "app/routine/download",
"style": {
"navigationBarTitleText": "小程序下载",
"navigationStyle": "custom"
}
},
{
"path": "app/routine/config",
"style": {
"navigationBarTitleText": "小程序配置",
"navigationStyle": "custom"
}
},
{
"path": "app/mobile/config",
"style": {
"navigationBarTitleText": "APP配置",
"navigationStyle": "custom"
}
},
{
"path": "app/mobile/version",
"style": {
"navigationBarTitleText": "版本管理",
"navigationStyle": "custom"
}
},
{
"path": "app/pc/design",
"style": {
"navigationBarTitleText": "PC端装修",
"navigationStyle": "custom"
}
},
{
"path": "app/pc/config",
"style": {
"navigationBarTitleText": "PC端配置",
"navigationStyle": "custom"
}
}
]
},

70
pages/mall/admin/app/mobile/config.uvue Normal file
View File

@@ -0,0 +1,70 @@
<template>
<view class="admin-page">
<view class="admin-card content-card">
<view class="tabs-row">
<view class="tab-item active">APP配置</view>
</view>
<view class="config-form">
<view class="form-item">
<text class="label">APPID：</text>
<input class="form-input" value="wx277a269f3d736d67" />
<text class="tip">微信开放平台申请移动应用后给予的APPID</text>
</view>
<view class="form-item">
<text class="label">AppSecret：</text>
<input class="form-input" value="bd08741a055c2ecac5826ff1c048464b" />
<text class="tip">微信开放平台申请移动应用后给予的AppSecret</text>
</view>
<view class="form-btns">
<button class="btn primary">提交</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// APP配置逻辑
</script>
<style scoped>
.config-form {
padding: 40px 10%;
}
.form-item {
margin-bottom: 30px;
display: flex;
flex-direction: column;
}
.form-item .label {
font-weight: bold;
margin-bottom: 10px;
color: #303133;
}
.form-input {
border: 1px solid #dcdfe6;
padding: 10px 15px;
border-radius: 4px;
}
.tip {
font-size: 12px;
color: #909399;
margin-top: 8px;
}
.form-btns {
margin-top: 50px;
}
.btn.primary {
width: 80px;
background-color: #2d8cf0;
color: #fff;
}
</style>

38
pages/mall/admin/app/mobile/version.uvue Normal file
View File

@@ -0,0 +1,38 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<view class="title-row">
<text class="title">版本管理</text>
<button class="btn primary">添加版本</button>
</view>
</view>
<view class="admin-card content-card">
<view class="admin-table">
<view class="table-header">
<text class="cell">版本号</text>
<text class="cell">更新内容</text>
<text class="cell">强制更新</text>
<text class="cell">下载地址</text>
<text class="cell">创建时间</text>
<text class="cell actions">操作</text>
</view>
<view class="table-empty">
<text>暂无版本数据</text>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 版本管理逻辑
</script>
<style scoped>
.table-empty {
padding: 100px;
text-align: center;
color: #909399;
}
</style>

66
pages/mall/admin/app/pc/config.uvue Normal file
View File

@@ -0,0 +1,66 @@
<template>
<view class="admin-page">
<view class="admin-card content-card">
<view class="tabs-row">
<view class="tab-item active">PC端配置</view>
</view>
<view class="config-form">
<view class="form-item">
<text class="label">网站域名：</text>
<input class="form-input" placeholder="请输入PC端网站域名" />
<text class="tip">PC端访问的地址</text>
</view>
<view class="form-item">
<text class="label">ICP备案号：</text>
<input class="form-input" placeholder="请输入备案号" />
<text class="tip">展示在页面底部的备案信息</text>
</view>
<view class="form-btns">
<button class="btn primary">提交</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// PC配置逻辑
</script>
<style scoped>
.config-form {
padding: 40px 10%;
}
.form-item {
margin-bottom: 30px;
display: flex;
flex-direction: column;
}
.form-item .label {
font-weight: bold;
margin-bottom: 10px;
color: #303133;
}
.form-input {
border: 1px solid #dcdfe6;
padding: 10px 15px;
border-radius: 4px;
}
.tip {
font-size: 12px;
color: #909399;
margin-top: 8px;
}
.btn.primary {
width: 80px;
background-color: #2d8cf0;
color: #fff;
}
</style>

223
pages/mall/admin/app/pc/design.uvue Normal file
View File

@@ -0,0 +1,223 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<view class="title-row">
<view class="breadcrumb">
<text class="back">返回</text>
<text class="sep">/</text>
<text class="current">PC端装修</text>
</view>
<button class="btn primary">保存</button>
</view>
</view>
<view class="admin-card content-card pc-design-container">
<!-- 左侧二级菜单 -->
<view class="side-menu">
<view
v-for="item in menuItems"
:key="item.id"
class="menu-item"
:class="{ active: activeMenu === item.id }"
@click="activeMenu = item.id"
>
{{ item.title }}
</view>
</view>
<!-- 中间预览区 -->
<view class="preview-area">
<view class="preview-header">
<view class="dot-wrap">
<view class="dot"></view>
<view class="dot"></view>
<view class="dot"></view>
</view>
<view class="search-bar-sim"></view>
</view>
<view class="preview-body">
<image
class="mock-pc"
src="/static/placeholder.png"
mode="aspectFit"
></image>
</view>
</view>
<!-- 右侧设置区 -->
<view class="setting-area">
<view class="box-title">
<view class="line"></view>
<text class="text">页面设置</text>
</view>
<view class="setting-form">
<view class="setting-item">
<text class="label">建议尺寸：140px * 60px</text>
<text class="desc">除LOGO图标外，页面其他内容仅供参考</text>
</view>
<view class="logo-uploader">
<image class="logo-preview" src="/static/placeholder.png"></image>
<view class="upload-mask">更换图片</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref } from 'vue'
const activeMenu = ref('logo')
const menuItems = [
{ id: 'logo', title: '网站LOGO' },
{ id: 'banner', title: '首页轮播图' },
{ id: 'ad', title: '客服页面广告' },
{ id: 'menu', title: '顶部菜单配置' },
{ id: 'friend', title: '友情链接配置' },
{ id: 'about', title: '关于我们' }
]
</script>
<style scoped>
.pc-design-container {
display: flex;
flex-direction: row;
height: 700px;
padding: 0;
}
.side-menu {
width: 160px;
border-right: 1px solid #ebeef5;
padding: 20px 0;
}
.menu-item {
height: 50px;
line-height: 50px;
padding: 0 25px;
font-size: 14px;
color: #2d8cf0;
cursor: pointer;
transition: all 0.2s;
}
.menu-item.active {
background-color: #f0f7ff;
border-right: 2px solid #2d8cf0;
}
.preview-area {
flex: 1;
background-color: #f5f7fa;
padding: 40px;
display: flex;
flex-direction: column;
}
.preview-header {
height: 30px;
background-color: #fff;
border-radius: 4px 4px 0 0;
display: flex;
align-items: center;
padding: 0 10px;
gap: 15px;
}
.dot-wrap {
display: flex;
gap: 5px;
}
.dot {
width: 8px;
height: 8px;
border-radius: 50%;
background-color: #ddd;
}
.search-bar-sim {
width: 200px;
height: 14px;
background-color: #f5f5f5;
border-radius: 7px;
}
.mock-pc {
width: 100%;
flex: 1;
background-color: #fff;
}
.setting-area {
width: 300px;
border-left: 1px solid #ebeef5;
padding: 25px;
}
.box-title {
display: flex;
align-items: center;
margin-bottom: 25px;
}
.box-title .line {
width: 2px;
height: 14px;
background-color: #2d8cf0;
margin-right: 8px;
}
.box-title .text {
font-size: 14px;
font-weight: bold;
}
.setting-item {
margin-bottom: 20px;
}
.setting-item .label {
display: block;
font-size: 12px;
color: #909399;
margin-bottom: 5px;
}
.setting-item .desc {
display: block;
font-size: 12px;
color: #c0c4cc;
}
.logo-uploader {
width: 120px;
height: 80px;
border: 1px dashed #dcdfe6;
position: relative;
overflow: hidden;
border-radius: 4px;
}
.logo-preview {
width: 100%;
height: 100%;
}
.upload-mask {
position: absolute;
bottom: 0;
width: 100%;
height: 24px;
line-height: 24px;
background-color: rgba(0,0,0,0.5);
color: #fff;
font-size: 12px;
text-align: center;
}
</style>

66
pages/mall/admin/app/routine/config.uvue Normal file
View File

@@ -0,0 +1,66 @@
<template>
<view class="admin-page">
<view class="admin-card content-card">
<view class="tabs-row">
<view class="tab-item active">小程序配置</view>
</view>
<view class="config-form">
<view class="form-item">
<text class="label">AppID：</text>
<input class="form-input" placeholder="请输入小程序AppID" />
<text class="tip">微信小程序的AppID</text>
</view>
<view class="form-item">
<text class="label">AppSecret：</text>
<input class="form-input" placeholder="请输入小程序AppSecret" />
<text class="tip">微信小程序的AppSecret</text>
</view>
<view class="form-btns">
<button class="btn primary">提交</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 小程序配置逻辑
</script>
<style scoped>
.config-form {
padding: 40px 10%;
}
.form-item {
margin-bottom: 30px;
display: flex;
flex-direction: column;
}
.form-item .label {
font-weight: bold;
margin-bottom: 10px;
color: #303133;
}
.form-input {
border: 1px solid #dcdfe6;
padding: 10px 15px;
border-radius: 4px;
}
.tip {
font-size: 12px;
color: #909399;
margin-top: 8px;
}
.btn.primary {
width: 80px;
background-color: #2d8cf0;
color: #fff;
}
</style>

137
pages/mall/admin/app/routine/download.uvue Normal file
View File

@@ -0,0 +1,137 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<view class="title-row">
<text class="title">小程序下载</text>
</view>
</view>
<view class="admin-card content-card routine-download-container">
<view class="box-title">
<view class="line"></view>
<text class="text">小程序设置</text>
</view>
<view class="download-form">
<view class="form-item">
<text class="label">小程序名称：</text>
<text class="value">CRMEB标准版</text>
</view>
<view class="form-item">
<text class="label">小程序码：</text>
<button class="btn primary mid">下载小程序码</button>
</view>
<view class="form-item">
<text class="label">小程序包：</text>
<view class="radio-wrap">
<radio-group class="radio-group">
<label class="radio-label"><radio value="0" />未开通</label>
<label class="radio-label"><radio value="1" checked />已开通</label>
</radio-group>
<text class="desc">是否已开通小程序直播</text>
<text class="warning">请谨慎选择是否有开通小程序直播功能，否则将影响小程序的发布 可前往 <text class="link">帮助文档</text> 查看如何开通直播功能</text>
</view>
</view>
<view class="form-item no-label">
<button class="btn primary mid">下载小程序包</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 小程序下载逻辑
</script>
<style scoped>
.routine-download-container {
padding: 40px;
}
.box-title {
display: flex;
align-items: center;
margin-bottom: 40px;
}
.box-title .line {
width: 3px;
height: 16px;
background-color: #2d8cf0;
margin-right: 10px;
}
.box-title .text {
font-size: 16px;
font-weight: bold;
}
.download-form {
padding-left: 100px;
}
.form-item {
display: flex;
flex-direction: row;
margin-bottom: 30px;
align-items: center;
}
.form-item.no-label {
padding-left: 100px;
}
.form-item .label {
width: 100px;
color: #606266;
text-align: right;
margin-right: 20px;
}
.form-item .value {
color: #303133;
}
.radio-wrap {
display: flex;
flex-direction: column;
}
.radio-group {
margin-bottom: 5px;
}
.radio-label {
margin-right: 20px;
}
.desc {
font-size: 14px;
color: #c0c4cc;
}
.warning {
margin-top: 10px;
font-size: 13px;
color: #909399;
max-width: 400px;
line-height: 1.6;
}
.link {
color: #2d8cf0;
margin: 0 5px;
}
.btn.mid {
width: auto;
padding: 0 20px;
height: 36px;
line-height: 36px;
font-size: 14px;
}
</style>

136
pages/mall/admin/app/wechat/config.uvue Normal file
View File

@@ -0,0 +1,136 @@
<template>
<view class="admin-page">
<view class="admin-card content-card">
<view class="tabs-row">
<view
v-for="tab in tabs"
:key="tab.key"
class="tab-item"
:class="{ active: currentTab === tab.key }"
@click="currentTab = tab.key"
>
{{ tab.label }}
</view>
</view>
<view v-if="currentTab === 'basic'" class="config-form">
<view class="form-item">
<text class="label">AppID：</text>
<input class="form-input" value="wxa815e4f2ef7bdb0b" />
<text class="tip">微信公众号的AppID</text>
</view>
<view class="form-item">
<text class="label">AppSecret：</text>
<input class="form-input" value="2c9f1ef4cc695c05c4462fef4e081120" />
<text class="tip">微信公众号的AppSecret</text>
</view>
<view class="form-item">
<text class="label">关注二维码：</text>
<view class="upload-box">
<text class="plus">+</text>
</view>
<text class="tip">引导关注公众号显示的公众号关注二维码</text>
</view>
<view class="form-item">
<text class="label">微信校验文件：</text>
<view class="upload-btn">
<text class="icon">⤒</text>
<text>点击上传</text>
</view>
<text class="tip">配置微信网页授权域名时候下载的微信校验文件，在此处上传</text>
</view>
<view class="form-btns">
<button class="btn primary">提交</button>
</view>
</view>
<view v-else class="config-form">
<view class="form-item">
<text class="label">接口地址：</text>
<input class="form-input" readonly value="https://v5.crmeb.net/api/wechat/serve" />
<text class="tip">配置服务器域名使用的接口地址，直接复制输入框内容（此项系统生成，无法修改）</text>
</view>
<view class="form-item">
<text class="label">消息加解密方式：</text>
<radio-group class="radio-group">
<label><radio value="1" checked />明文模式</label>
<label><radio value="2" />兼容模式</label>
<label><radio value="3" />安全模式</label>
</radio-group>
<text class="tip">如需使用安全模式请在管理中心修改，仅限服务号和认证订阅号</text>
</view>
<view class="form-btns">
<button class="btn primary">提交</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref } from 'vue'
const currentTab = ref('basic')
const tabs = [
{ key: 'basic', label: '公众号配置' },
{ key: 'server', label: '服务器域名配置' }
]
</script>
<style scoped>
.config-form {
padding: 30px 10%;
}
.form-item {
margin-bottom: 30px;
display: flex;
flex-direction: column;
}
.form-item .label {
font-weight: bold;
margin-bottom: 10px;
color: #303133;
}
.form-input {
border: 1px solid #dcdfe6;
padding: 10px 15px;
border-radius: 4px;
width: 100%;
}
.tip {
font-size: 12px;
color: #909399;
margin-top: 8px;
}
.upload-box {
width: 80px;
height: 80px;
border: 1px dashed #dcdfe6;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
background-color: #fafafa;
}
.upload-btn {
width: 120px;
height: 40px;
border: 1px solid #dcdfe6;
display: flex;
justify-content: center;
align-items: center;
border-radius: 4px;
gap: 5px;
}
.radio-group label {
margin-right: 30px;
}
</style>

129
pages/mall/admin/app/wechat/menu.uvue Normal file
View File

@@ -0,0 +1,129 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<text class="title">微信菜单</text>
</view>
<view class="admin-card content-card menu-editor-wrap">
<!-- 微信菜单编辑器的模拟界面 -->
<view class="phone-preview">
<view class="phone-header">
<text class="status-bar">1:21 AM</text>
<view class="nav-bar">
<text class="back">返回</text>
<text class="user-icon">👤</text>
</view>
</view>
<view class="phone-body">
<!-- 菜单展示区域 -->
<view class="menu-display">
<view class="menu-bottom">
<view class="keyboard-icon">⌨️</view>
<view class="menu-items">
<view class="menu-item">手机111</view>
<view class="menu-item active">商品分类</view>
<view class="menu-item">+</view>
</view>
</view>
</view>
</view>
</view>
<view class="menu-settings">
<view class="tip-box">
<text>点击左侧菜单进行编辑</text>
</view>
<!-- 这里将来可以放菜单编辑表单 -->
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 微信菜单页面逻辑
</script>
<style scoped>
.menu-editor-wrap {
display: flex;
flex-direction: row;
padding: 40px;
gap: 40px;
min-height: 600px;
}
.phone-preview {
width: 320px;
height: 560px;
border: 1px solid #ddd;
border-radius: 30px;
overflow: hidden;
background-color: #f5f5f5;
display: flex;
flex-direction: column;
}
.phone-header {
background-color: #333;
color: #fff;
padding: 10px 15px;
}
.nav-bar {
display: flex;
justify-content: space-between;
margin-top: 10px;
}
.phone-body {
flex: 1;
position: relative;
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.menu-bottom {
height: 50px;
background-color: #fff;
border-top: 1px solid #eee;
display: flex;
align-items: center;
}
.keyboard-icon {
width: 50px;
text-align: center;
border-right: 1px solid #eee;
}
.menu-items {
flex: 1;
display: flex;
}
.menu-item {
flex: 1;
text-align: center;
line-height: 50px;
border-right: 1px solid #eee;
font-size: 14px;
}
.menu-item.active {
border: 2px solid #2d8cf0;
background-color: #f0f7ff;
}
.menu-settings {
flex: 1;
background-color: #fff;
}
.tip-box {
padding: 20px;
background-color: #f8f8f9;
border-radius: 4px;
color: #808695;
}
</style>

82
pages/mall/admin/app/wechat/news.uvue Normal file
View File

@@ -0,0 +1,82 @@
<template>
<view class="admin-page">
<view class="admin-card filter-card">
<view class="filter-row">
<view class="filter-item">
<text class="label">图文搜索：</text>
<input class="filter-input" placeholder="请输入图文名称" />
</view>
<view class="filter-btns">
<button class="btn primary">查询</button>
<button class="btn success">添加图文消息</button>
</view>
</view>
</view>
<view class="admin-card content-card">
<view class="news-list">
<!-- 模拟图文卡片 -->
<view class="news-item">
<image class="cover" src="/static/placeholder.png" mode="aspectFill"></image>
<view class="news-info">
<text class="title">hahah</text>
<text class="id">207</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 图文管理逻辑
</script>
<style scoped>
.news-list {
display: flex;
flex-wrap: wrap;
gap: 20px;
padding: 10px;
}
.news-item {
width: 240px;
border: 1px solid #ebeef5;
border-radius: 4px;
overflow: hidden;
transition: all 0.3s;
}
.news-item:hover {
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
}
.cover {
width: 100%;
height: 140px;
background-color: #f5f7fa;
}
.news-info {
padding: 10px;
display: flex;
flex-direction: column;
}
.title {
font-size: 16px;
color: #303133;
}
.id {
font-size: 12px;
color: #2d8cf0;
margin-top: 5px;
}
.btn.success {
background-color: #2d8cf0;
color: #fff;
}
</style>

144
pages/mall/admin/app/wechat/reply/follow.uvue Normal file
View File

@@ -0,0 +1,144 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<view class="breadcrumb">
<text class="back" @click="goBack">返回</text>
<text class="sep">/</text>
<text class="current">微信关注回复</text>
</view>
</view>
<view class="admin-card content-card reply-editor-wrap">
<view class="phone-preview">
<!-- 简化的手机预览 -->
<view class="phone-header">
<text class="time">9:36</text>
</view>
<view class="phone-body">
<view class="chat-item">
<view class="avatar">🐷</view>
<view class="bubble">{{ replyContent }}</view>
</view>
</view>
</view>
<view class="reply-form">
<view class="form-item">
<text class="label">消息状态：</text>
<radio-group class="radio-group">
<label><radio value="1" checked />启用</label>
<label><radio value="0" />禁用</label>
</radio-group>
</view>
<view class="form-item">
<text class="label">消息类型：</text>
<view class="filter-select">
<text>文字消息</text>
<text class="arrow">▼</text>
</view>
</view>
<view class="form-item">
<text class="label">消息内容：</text>
<textarea v-model="replyContent" class="reply-textarea" placeholder="请输入内容"></textarea>
</view>
<view class="form-btns">
<button class="btn primary">保存并发布</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref } from 'vue'
const replyContent = ref('567856875687')
const goBack = () => {
// 返回逻辑
}
</script>
<style scoped>
.reply-editor-wrap {
display: flex;
flex-direction: row;
padding: 40px;
gap: 60px;
}
.phone-preview {
width: 320px;
height: 560px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #f5f5f5;
display: flex;
flex-direction: column;
}
.phone-header {
height: 60px;
background-color: #333;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
}
.chat-item {
display: flex;
padding: 15px;
gap: 10px;
}
.avatar {
font-size: 24px;
}
.bubble {
background-color: #fff;
padding: 10px;
border-radius: 4px;
position: relative;
max-width: 200px;
word-break: break-all;
}
.reply-form {
flex: 1;
}
.form-item {
margin-bottom: 25px;
display: flex;
align-items: flex-start;
}
.form-item .label {
width: 100px;
padding-top: 5px;
color: #606266;
}
.radio-group label {
margin-right: 20px;
}
.reply-textarea {
flex: 1;
height: 120px;
border: 1px solid #dcdfe6;
padding: 10px;
border-radius: 4px;
}
.btn.primary {
margin-left: 100px;
background-color: #2d8cf0;
color: #fff;
}
</style>

63
pages/mall/admin/app/wechat/reply/invalid.uvue Normal file
View File

@@ -0,0 +1,63 @@
<template>
<view class="admin-page">
<view class="admin-card header-card">
<view class="breadcrumb">
<text class="back">返回</text>
<text class="sep">/</text>
<text class="current">无效关键词回复</text>
</view>
</view>
<view class="admin-card content-card reply-editor-wrap">
<view class="phone-preview">
<view class="phone-header">
<text class="time">9:36</text>
</view>
<view class="phone-body">
<view class="chat-item">
<view class="avatar">🐷</view>
<view class="bubble empty"></view>
</view>
</view>
</view>
<view class="reply-form">
<view class="form-item">
<text class="label">消息状态：</text>
<radio-group class="radio-group">
<label><radio value="1" />启用</label>
<label><radio value="0" checked />禁用</label>
</radio-group>
</view>
<view class="form-item">
<text class="label">消息类型：</text>
<view class="filter-select">
<text class="select-placeholder">请选择规则状态</text>
<text class="arrow">▼</text>
</view>
</view>
<view class="form-btns">
<button class="btn primary">保存并发布</button>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 无效关键词回复逻辑
</script>
<style scoped>
.bubble.empty {
width: 40px;
height: 40px;
background-color: #fff;
}
.select-placeholder {
color: #c0c4cc;
}
</style>

57
pages/mall/admin/app/wechat/reply/keyword.uvue Normal file
View File

@@ -0,0 +1,57 @@
<template>
<view class="admin-page">
<view class="admin-card filter-card">
<view class="filter-row">
<view class="filter-item">
<text class="label">回复类型：</text>
<view class="filter-select">
<text class="select-placeholder">请选择</text>
<text class="arrow">▼</text>
</view>
</view>
<view class="filter-item">
<text class="label">关键字：</text>
<input class="filter-input" placeholder="请输入关键字" />
</view>
<view class="filter-btns">
<button class="btn primary">查询</button>
</view>
</view>
</view>
<view class="admin-card content-card">
<view class="table-toolbar">
<button class="btn primary">添加关键字</button>
</view>
<view class="admin-table">
<view class="table-header">
<text class="cell id">ID</text>
<text class="cell">关键字</text>
<text class="cell">回复类型</text>
<text class="cell">是否显示</text>
<text class="cell actions">操作</text>
</view>
<view class="table-empty">
<text>暂无数据</text>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
// 关键字回复逻辑
</script>
<style scoped>
.table-toolbar {
margin-bottom: 20px;
}
.table-empty {
padding: 100px;
text-align: center;
color: #909399;
}
</style>