init
- 框架初始化 - 安装插件 - 修复PHP8.4报错
This commit is contained in:
80
application/admin/view/shopro/wechat/config/index.html
Normal file
80
application/admin/view/shopro/wechat/config/index.html
Normal file
@@ -0,0 +1,80 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
<style>
|
||||
.tip {
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: var(--sa-subfont);
|
||||
margin-left: 100px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
.tip a {
|
||||
color: var(--sa-subfont);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.tip {
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="index" class="config-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-header class="sa-header">
|
||||
<el-tabs class="sa-tabs">
|
||||
<el-tab-pane label="公众号配置"></el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<div class="tip">配置说明：<a href="https://kf.qq.com/faq/170104AJ3y26170104Yj673y.html"
|
||||
target="_blank">公众平台接口权限列表说明</a></div>
|
||||
<el-form ref="formRef" :model="form.model" :rules="form.rules" label-width="160px">
|
||||
<el-form-item label="公众号名称" prop="name">
|
||||
<el-input class="sa-w-360" placeholder="请输入公众号名称" v-model="form.model.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="公众号类型">
|
||||
<el-radio-group v-model="form.model.type">
|
||||
<el-radio :label="1">订阅号</el-radio>
|
||||
<el-radio :label="2">认证订阅号</el-radio>
|
||||
<el-radio :label="3">服务号</el-radio>
|
||||
<el-radio :label="4">认证服务号</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="公众号Logo" prop="logo">
|
||||
<sa-uploader v-model="form.model.logo"></sa-uploader>
|
||||
</el-form-item>
|
||||
<el-form-item label="公众号二维码" prop="qrcode">
|
||||
<sa-uploader v-model="form.model.qrcode"></sa-uploader>
|
||||
</el-form-item>
|
||||
<el-form-item label="开发者AppId" prop="app_id">
|
||||
<el-input class="sa-w-360" placeholder="请输入开发者AppId" v-model="form.model.app_id"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="开发者AppSecret" prop="secret">
|
||||
<el-input class="sa-w-360" placeholder="请输入开发者AppSecret" v-model="form.model.secret"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="服务器地址">
|
||||
<el-input class="sa-w-360" v-model="form.model.server_url" disabled>
|
||||
<template #append>
|
||||
<span class="cursor-pointer" @click="onClipboard(form.model.server_url)">复制</span>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="令牌(Token)" prop="token">
|
||||
<el-input class="sa-w-360" placeholder="请输入令牌(Token)" v-model="form.model.token"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="消息加解密密钥" prop="aes_key">
|
||||
<el-input class="sa-w-360" placeholder="请输入消息加解密密钥" v-model="form.model.aes_key"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" @click="onConfirm">确定</el-button>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
57
application/admin/view/shopro/wechat/material/add.html
Normal file
57
application/admin/view/shopro/wechat/material/add.html
Normal file
@@ -0,0 +1,57 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<div id="addEdit" class="material-form" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<el-form :model="form.model" :rules="form.rules" ref="formRef" label-width="100px">
|
||||
<template v-if="form.model.type == 'text'">
|
||||
<el-form-item label="内容" prop="content">
|
||||
<el-input v-model="form.model.content" placeholder="请输入内容" type="textarea"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="超链接">
|
||||
<el-popover v-model:visible="linkPopover.flag" placement="bottom" trigger="click"
|
||||
:width="300">
|
||||
<el-form ref="linkFormRef" :model="linkPopover.form.model"
|
||||
:rules="linkPopover.form.rules" label-width="80px">
|
||||
<el-form-item label="文本内容" prop="text">
|
||||
<el-input v-model="linkPopover.form.model.text" placeholder="请输入文本内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址" prop="href">
|
||||
<el-input v-model="linkPopover.form.model.href" placeholder="请输入链接地址" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="sa-flex sa-row-right">
|
||||
<el-button type="info" link @click="onCancelLinkPopover">取消</el-button>
|
||||
<el-button type="primary" link @click="onConfirmLinkPopover">确定
|
||||
</el-button>
|
||||
</div>
|
||||
<template #reference>
|
||||
<el-button type="primary" link>插入超链接</el-button>
|
||||
</template>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-if="form.model.type == 'link' && form.model.content">
|
||||
<el-form-item label="标题" prop="content.title">
|
||||
<el-input v-model="form.model.content.title" placeholder="请输入标题"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="content.description">
|
||||
<el-input v-model="form.model.content.description" placeholder="请输入描述" type="textarea">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="图片" prop="content.image">
|
||||
<sa-uploader v-model="form.model.content.image"></sa-uploader>
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址" prop="content.url">
|
||||
<el-input v-model="form.model.content.url" placeholder="请输入链接地址"></el-input>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" @click="onConfirm">确定</el-button>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
304
application/admin/view/shopro/wechat/material/index.html
Normal file
304
application/admin/view/shopro/wechat/material/index.html
Normal file
@@ -0,0 +1,304 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.voice-content .item {
|
||||
background: var(--sa-background-assist);
|
||||
}
|
||||
|
||||
.item {
|
||||
padding: 12px;
|
||||
line-height: 1;
|
||||
margin-bottom: 24px;
|
||||
box-shadow: 0 1px 6px rgb(89 89 89 / 12%);
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--sa-space);
|
||||
}
|
||||
|
||||
.item:hover {
|
||||
box-shadow: 0 3px 12px rgb(89 89 89 / 20%);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
.news-content .item {
|
||||
min-height: 144px;
|
||||
}
|
||||
|
||||
.news-content .item .frist-news>div {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.news-content .item .frist-news .sa-image {
|
||||
width: 100%;
|
||||
height: 144px;
|
||||
}
|
||||
|
||||
.news-content .item .frist-news .title {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
padding: 0 12px;
|
||||
background: rgba(38, 38, 38, 0.5);
|
||||
backdrop-filter: blur(1px);
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.news-content .item .other-news {
|
||||
height: 40px;
|
||||
padding: 0 12px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.news-content .item .other-news>div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.news-content .item .other-news .title {
|
||||
flex: 1;
|
||||
font-size: 12px;
|
||||
color: var(--sa-subtitle);
|
||||
}
|
||||
|
||||
.news-content .item .other-news .sa-image {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.image-content .sa-image {
|
||||
width: 100%;
|
||||
height: 144px;
|
||||
border-radius: 0;
|
||||
border: 1px solid var(--sa-space);
|
||||
}
|
||||
|
||||
.image-content .name {
|
||||
padding: 10px 12px;
|
||||
font-size: 12px;
|
||||
color: var(--sa-title);
|
||||
}
|
||||
|
||||
.video-content .cover-url {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.video-content .cover-url .sa-image {
|
||||
width: 64px;
|
||||
height: 48px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.video-content .cover-url .mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: rgba(38, 38, 38, 0.5);
|
||||
color: var(--sa-background-assist);
|
||||
backdrop-filter: blur(1px);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.video-content .name {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 14px;
|
||||
color: var(--sa-title);
|
||||
}
|
||||
|
||||
.video-content .description {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 14px;
|
||||
color: var(--sa-font);
|
||||
}
|
||||
|
||||
.voice-content .item .voice-svg {
|
||||
flex-shrink: 0;
|
||||
width: 64px;
|
||||
height: 48px;
|
||||
background: var(--el-color-primary-light-9);
|
||||
backdrop-filter: blur(2px);
|
||||
border-radius: 2px;
|
||||
color: var(--el-color-primary);
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.voice-content .name {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 14px;
|
||||
color: var(--sa-title);
|
||||
}
|
||||
|
||||
.voice-content .description {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 12px;
|
||||
color: var(--sa-font);
|
||||
}
|
||||
|
||||
.text-content .item-content {
|
||||
font-size: 12px;
|
||||
color: var(--sa-title);
|
||||
line-height: 20px;
|
||||
height: 40px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.link-content .title {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 14px;
|
||||
color: var(--sa-title);
|
||||
}
|
||||
|
||||
.link-content .description {
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 12px;
|
||||
color: var(--sa-font);
|
||||
}
|
||||
|
||||
.material-index .name {
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="index" class="material-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-header class="sa-header">
|
||||
<el-alert class="mt-4 mb-4" type="warning">
|
||||
<template #title>
|
||||
素材管理中图文消息、图片、视频、音频，需要您在公众号平台进行上传。
|
||||
<a href="https://mp.weixin.qq.com" target="_blank">微信公众号管理</a>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-tabs class="sa-tabs" v-model="state.type" @tab-change="onChangeTab">
|
||||
<el-tab-pane label="图文消息" name="news"> </el-tab-pane>
|
||||
<el-tab-pane label="图片" name="image"> </el-tab-pane>
|
||||
<el-tab-pane label="视频" name="video"> </el-tab-pane>
|
||||
<el-tab-pane label="语音" name="voice"> </el-tab-pane>
|
||||
<el-tab-pane label="文本" name="text"> </el-tab-pane>
|
||||
<el-tab-pane label="链接" name="link"> </el-tab-pane>
|
||||
</el-tabs>
|
||||
<div v-if="state.type == 'text' || state.type == 'link'" class="sa-title sa-flex sa-row-between">
|
||||
<div class="sa-title-left">
|
||||
<div class="left-name"></div>
|
||||
</div>
|
||||
<div class="sa-title-right">
|
||||
<el-button class="sa-button-refresh" icon="RefreshRight" @click="getData"></el-button>
|
||||
{if $auth->check('shopro/wechat/material/add')}
|
||||
<el-button icon="Plus" type="primary" @click="onAdd">添加</el-button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<el-row :gutter="20">
|
||||
<el-col v-for="item in state.data" :key="item" :xs="12" :sm="8" :md="6" :lg="4" :xl="4">
|
||||
<div :class="`${state.type}-content`">
|
||||
<template v-if="state.type == 'news'">
|
||||
<div class="item">
|
||||
<a v-for="(it, index) in item.content.news_item" :key="it"
|
||||
:class="index == 0 ? 'frist-news' : 'other-news'" :href="it.url"
|
||||
target="_blank">
|
||||
<div class="sa-flex sa-row-between sa-line-1">
|
||||
<div class="title sa-line-1">{{ it.title }}</div>
|
||||
<sa-image :url="it.thumb_url" fit="cover"></sa-image>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="state.type == 'image'">
|
||||
<div class="item">
|
||||
<sa-image :url="item.url" fit="cover"></sa-image>
|
||||
<div class="name sa-line-1">{{ item.name }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="state.type == 'video'">
|
||||
<div class="item sa-flex">
|
||||
<div class="cover-url">
|
||||
<sa-image :url="item.cover_url"></sa-image>
|
||||
<div class="mask sa-flex sa-row-center">
|
||||
<sa-svg name="sa-play" size="20"></sa-svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ml-2">
|
||||
<div class="name mb-1 sa-table-line-1">{{ item.name }}</div>
|
||||
<div class="description sa-table-line-1">{{ item.description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="state.type == 'voice'">
|
||||
<div class="item sa-flex">
|
||||
<div class="voice-svg sa-flex sa-row-center">
|
||||
<sa-svg name="sa-play" size="20"></sa-svg>
|
||||
</div>
|
||||
<div class="ml-2">
|
||||
<div class="name mb-1 sa-table-line-1">{{ item.name }}</div>
|
||||
<div class="description sa-table-line-1">{{ item.description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="state.type == 'text'">
|
||||
<div class="item">
|
||||
<div class="item-content sa-line-2 mb-2" v-html="item.content"></div>
|
||||
<div class="sa-flex sa-row-right">
|
||||
{if $auth->check('shopro/wechat/material/edit')}
|
||||
<el-button type="primary" link @click="onEdit(item.id)">编辑</el-button>
|
||||
{/if}
|
||||
<el-popconfirm width="fit-content" confirm-button-text="确认"
|
||||
cancel-button-text="取消" title="确认删除这条记录?" @confirm="onDelete(item.id)">
|
||||
<template #reference>
|
||||
{if $auth->check('shopro/wechat/material/delete')}
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
{/if}
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="state.type == 'link'">
|
||||
<div class="item">
|
||||
<div v-if="item.content" class="sa-flex mb-2">
|
||||
<sa-image :url="item.content.image" size="40"></sa-image>
|
||||
<div class="ml-2">
|
||||
<div class="title mb-1 sa-table-line-1">{{ item.content.title }}</div>
|
||||
<div class="description sa-table-line-1">
|
||||
{{ item.content.description }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sa-flex sa-row-right">
|
||||
{if $auth->check('shopro/wechat/material/edit')}
|
||||
<el-button type="primary" link @click="onEdit(item.id)">编辑</el-button>
|
||||
{/if}
|
||||
<el-popconfirm width="fit-content" confirm-button-text="确认"
|
||||
cancel-button-text="取消" title="确认删除这条记录?" @confirm="onDelete(item.id)">
|
||||
<template #reference>
|
||||
{if $auth->check('shopro/wechat/material/delete')}
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
{/if}
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer sa-flex sa-row-right">
|
||||
<sa-pagination v-model="pagination" @pagination-change="getData"></sa-pagination>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
293
application/admin/view/shopro/wechat/menu/add.html
Normal file
293
application/admin/view/shopro/wechat/menu/add.html
Normal file
@@ -0,0 +1,293 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.menu-left {
|
||||
width: 100%;
|
||||
max-width: 268px;
|
||||
height: 420px;
|
||||
border: 1px solid var(--sa-border);
|
||||
margin-right: 30px;
|
||||
padding-top: 382px;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.menu-left .title {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
background: var(--sa-table-header-bg);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom {
|
||||
position: relative;
|
||||
height: 36px;
|
||||
border-top: 1px solid var(--sa-border);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .left-icon {
|
||||
width: 36px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .left-add {
|
||||
height: 36px;
|
||||
flex: 1;
|
||||
color: var(--sa-font);
|
||||
border-left: 1px solid var(--sa-border);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .menu-item {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
padding: 0 4px;
|
||||
border: 1px solid var(--sa-border);
|
||||
border-bottom: none;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
color: var(--sa-font);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .menu-item.is-active {
|
||||
border: 1px solid var(--el-color-primary);
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item {
|
||||
position: relative;
|
||||
border: none;
|
||||
border-left: 1px solid var(--sa-border);
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item .menu-level2-body {
|
||||
display: none;
|
||||
position: absolute;
|
||||
bottom: 48px;
|
||||
width: calc(100% + 2px);
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item .menu-level2-body .menu-level2-add {
|
||||
width: 100%;
|
||||
border: 1px solid var(--sa-border);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item .menu-level2-body .menu-level2-add::before {
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 8px solid;
|
||||
position: absolute;
|
||||
bottom: -16px;
|
||||
border-color: var(--sa-border) transparent transparent;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item .menu-level2-body .menu-level2-add::after {
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 7px solid;
|
||||
position: absolute;
|
||||
bottom: -14px;
|
||||
left: 50%;
|
||||
margin-left: -5px;
|
||||
border-color: var(--sa-background-assist) transparent transparent;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-bottom .draggable-item .menu-level2-body.menu-level2-body-show {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-left .menu-left-tip {
|
||||
text-align: center;
|
||||
height: 12px;
|
||||
line-height: 12px;
|
||||
font-size: 12px;
|
||||
margin: 8px 0 0 0;
|
||||
color: var(--el-color-warning);
|
||||
}
|
||||
|
||||
.menu-right-tip {
|
||||
width: 100%;
|
||||
height: 420px;
|
||||
}
|
||||
|
||||
.menu-right {
|
||||
width: 100%;
|
||||
max-width: 858px;
|
||||
min-height: 320px;
|
||||
padding: 20px;
|
||||
border: 1px solid var(--sa-border);
|
||||
border-radius: 8px;
|
||||
background: var(--sa-table-header-bg);
|
||||
}
|
||||
|
||||
.menu-right .title {
|
||||
font-size: 14px;
|
||||
color: var(--sa-title);
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="addEdit" class="menu-form" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<el-form class="mb-4" :model="form.model" :rules="form.rules" ref="formRef" label-width="90px">
|
||||
<el-form-item label="菜单名称" prop="name">
|
||||
<el-input v-model="form.model.name" placeholder="请输入菜单名称"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="menu-content sa-flex sa-col-top">
|
||||
<div class="menu-left">
|
||||
<div class="title">公众号菜单</div>
|
||||
<div class="menu-left-bottom sa-flex">
|
||||
<div class="left-icon sa-flex sa-row-center">
|
||||
<i class="iconfont iconkeyboard"></i>
|
||||
</div>
|
||||
<draggable :list="form.model.rules" class="sa-flex sa-flex-1" animation="100"
|
||||
item-key="event">
|
||||
<template #item="{ element, index }">
|
||||
<div class="draggable-item menu-item sa-flex sa-row-center cursor-pointer"
|
||||
:class="element.selected ? 'is-active' : ''"
|
||||
@click.stop="onEditMenu(index, null)">
|
||||
<span v-if="element.sub_button && element.sub_button.length > 0"
|
||||
class="mr-1">≡</span>
|
||||
<span class="sa-line-1">{{ element.name }}</span>
|
||||
<div v-if="element.sub_button" class="menu-level2-body"
|
||||
:class="element.show ? 'menu-level2-body-show' : ''" :style="{
|
||||
'border-bottom':
|
||||
element.sub_button.length >= 5 ? '1px solid #E7E7EB' : 'none',
|
||||
}">
|
||||
<draggable :list="element.sub_button" animation="500" item-key="event">
|
||||
<template #item="scope">
|
||||
<div>
|
||||
<div class="menu-item sa-line-1"
|
||||
:class="scope.element.selected ? 'is-active' : ''"
|
||||
@click.stop="onEditMenu(index, scope.index)">
|
||||
{{scope.element.name }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</draggable>
|
||||
<div class="menu-item menu-level2-add cursor-pointer"
|
||||
v-if="element.sub_button.length < 5" @click.stop="onAddMenu(index, 2)">
|
||||
<el-icon>
|
||||
<Plus />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #footer>
|
||||
<div class="left-add sa-flex sa-row-center cursor-pointer"
|
||||
v-if="form.model.rules.length < 3" @click.stop="onAddMenu(null, 1)">
|
||||
<el-icon>
|
||||
<Plus />
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</draggable>
|
||||
</div>
|
||||
<div class="menu-left-tip mt-2">可直接拖动菜单排序</div>
|
||||
</div>
|
||||
<div class="menu-right-tip sa-flex sa-row-center" v-if="!state.rightShow">您尚未添加自定义菜单</div>
|
||||
<div class="menu-right" v-if="state.rightShow">
|
||||
<div class="sa-flex sa-row-between mb-4">
|
||||
<div class="title">菜单名称</div>
|
||||
<el-button type="danger" link @click="onDeleteMenu">删除菜单</el-button>
|
||||
</div>
|
||||
<el-form :model="state.right" label-width="86px">
|
||||
<el-form-item :label="state.selectLevel == 2 ? '子菜单名称' : '菜单名称'" prop="name">
|
||||
<el-input v-model="state.right.name"></el-input>
|
||||
<div class="tip">菜单名称字数不多于4个汉字或8个字母</div>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="
|
||||
(state.selectLevel == 1 &&
|
||||
(!state.right.sub_button || state.right.sub_button.length == 0)) ||
|
||||
state.selectLevel == 2
|
||||
" :label="state.selectLevel == 2 ? '子页面内容' : '页面内容'">
|
||||
<el-radio-group v-model="state.right.type" @change="onChangeType">
|
||||
<el-radio label="view">跳转网页</el-radio>
|
||||
<el-radio label="miniprogram">跳转小程序</el-radio>
|
||||
<el-radio label="click">回复素材</el-radio>
|
||||
</el-radio-group>
|
||||
<!-- <div class="tip">点击该菜单会跳到页面链接</div> -->
|
||||
</el-form-item>
|
||||
<template v-if="!state.right.sub_button || state.right.sub_button.length == 0">
|
||||
<template v-if="state.right.type == 'miniprogram'">
|
||||
<el-form-item label="AppId">
|
||||
<el-input v-model="state.right.appid"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="小程序路径">
|
||||
<el-input v-model="state.right.pagepath"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-top: -20px">
|
||||
<div class="tip" v-if="state.right.type == 'view'">点击该菜单会跳到页面链接</div>
|
||||
<div class="tip" v-if="state.right.type == 'miniprogram'">小程序路径不可用时将跳转备用页面链接
|
||||
</div>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-if="state.right.type == 'view' || state.right.type == 'miniprogram'">
|
||||
<el-form-item label="备用页面链接">
|
||||
<el-input v-model="state.right.url"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click.stop="onSelectUrl">选择路径</el-button>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<!-- 回复素材 -->
|
||||
<template v-if="state.right.type == 'click'">
|
||||
<el-form-item label="消息类型">
|
||||
<el-radio-group v-model="state.right.media_type" @change="onChangeMediaType">
|
||||
<el-radio label="news">图文消息</el-radio>
|
||||
<el-radio label="image">图片</el-radio>
|
||||
<el-radio label="video">视频</el-radio>
|
||||
<el-radio label="voice">语音</el-radio>
|
||||
<el-radio label="text">文本</el-radio>
|
||||
<el-radio label="link">链接</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="state.right.media_type" label="消息内容">
|
||||
<el-select popper-class="material-select" v-model="state.right.media_id">
|
||||
<el-option v-for="item in material.select" :key="item.media_id"
|
||||
:label="item.title" :value="item.media_id + ''">
|
||||
<div class="sa-flex">
|
||||
<sa-image v-if="
|
||||
item.type == 'news' ||
|
||||
item.type == 'image' ||
|
||||
item.type == 'video' ||
|
||||
item.type == 'link'
|
||||
" :url="item.thumb_url" size="30"></sa-image>
|
||||
<div class="title ml-2 sa-line-1">
|
||||
{{ item.title }}
|
||||
</div>
|
||||
<div class="media_id ml-2 sa-line-1">
|
||||
{{ item.media_id }}
|
||||
</div>
|
||||
</div>
|
||||
</el-option>
|
||||
<sa-pagination class="is-ellipsis" v-model="material.pagination"
|
||||
@pagination-change="getMaterialSelect">
|
||||
</sa-pagination>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</template>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" plain @click="onConfirm">确定</el-button>
|
||||
{if $auth->check('shopro/wechat/menu/publish')}
|
||||
<el-button type="primary" @click="onPublish">确定&发布</el-button>
|
||||
{/if}
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
122
application/admin/view/shopro/wechat/menu/index.html
Normal file
122
application/admin/view/shopro/wechat/menu/index.html
Normal file
@@ -0,0 +1,122 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.menu-index .menu-current {
|
||||
border-bottom: 1px solid var(--sa-space);
|
||||
}
|
||||
|
||||
.menu-index .menu-current .left {
|
||||
flex-shrink: 0;
|
||||
font-size: 14px;
|
||||
color: var(--sa-subtitle);
|
||||
}
|
||||
|
||||
.menu-index .menu-current .right {
|
||||
flex: 1;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
border: 1px solid var(--sa-border);
|
||||
box-sizing: border-box;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.menu-index .menu-current .right .menu-current-tag {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.menu-index .menu-current .right .el-button {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="index" class="menu-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-header class="sa-header">
|
||||
<div class="menu-current sa-title sa-flex sa-row-between">
|
||||
<div class="left mr-4">当前菜单</div>
|
||||
<div class="right">
|
||||
<el-scrollbar>
|
||||
<div class="menu-current-tag sa-flex ml-1">
|
||||
<el-tag class="mr-1" v-for="item in state.current" :key="item">{{ item.name }}</el-tag>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
{if $auth->check('shopro/wechat/menu/copy')}
|
||||
<el-button type="primary" @click="onCopy(0)">复制</el-button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="sa-title sa-flex sa-row-between">
|
||||
<div class="sa-title-left">
|
||||
<div class="left-name">自定义菜单</div>
|
||||
</div>
|
||||
<div class="sa-title-right">
|
||||
<el-button class="sa-button-refresh" icon="RefreshRight" @click="getData"></el-button>
|
||||
{if $auth->check('shopro/wechat/menu/add')}
|
||||
<el-button icon="Plus" type="primary" @click="onAdd">添加</el-button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="sa-main">
|
||||
<el-table class="sa-table" height="100%" stripe :data="state.data" @sort-change="onChangeSort">
|
||||
<el-table-column sortable="custom" prop="id" label="ID" min-width="90"> </el-table-column>
|
||||
<el-table-column label="名称" min-width="160">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">
|
||||
{{ scope.row.name || '-' }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单名称" min-width="260">
|
||||
<template #default="scope">
|
||||
<el-scrollbar>
|
||||
<div class="sa-flex">
|
||||
<el-tag class="mr-1" v-for="item in scope.row.rules" :key="item.id">{{ item.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column sortable="custom" prop="updatetime" label="更新时间" width="172">
|
||||
<template #default="scope">
|
||||
{{ scope.row.updatetime || '-' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="菜单状态" width="100">
|
||||
<template #default="scope">
|
||||
<div :class="scope.row.status == 0 ? 'sa-color--info' : 'sa-color--success'">
|
||||
{{ scope.row.status_text}}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" min-width="200">
|
||||
<template #default="scope">
|
||||
{if $auth->check('shopro/wechat/menu/publish')}
|
||||
<el-button type="primary" link @click="onPublish(scope.row.id)">发布</el-button>
|
||||
{/if}
|
||||
{if $auth->check('shopro/wechat/menu/edit')}
|
||||
<el-button type="primary" link @click="onEdit(scope.row.id)">编辑</el-button>
|
||||
{/if}
|
||||
{if $auth->check('shopro/wechat/menu/copy')}
|
||||
<el-button type="primary" link @click="onCopy(scope.row.id)">复制</el-button>
|
||||
{/if}
|
||||
<el-popconfirm width="fit-content" confirm-button-text="确认" cancel-button-text="取消"
|
||||
title="确认删除这条记录?" @confirm="onDelete(scope.row.id)">
|
||||
<template #reference>
|
||||
{if $auth->check('shopro/wechat/menu/delete')}
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
{/if}
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer sa-flex sa-row-right">
|
||||
<sa-pagination v-model="pagination" @pagination-change="getData"></sa-pagination>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
91
application/admin/view/shopro/wechat/reply/add.html
Normal file
91
application/admin/view/shopro/wechat/reply/add.html
Normal file
@@ -0,0 +1,91 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.reply-form .keywords {
|
||||
border: none;
|
||||
border-radius: 12px;
|
||||
margin-right: 12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.reply-form .keywords:last-of-type {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.material-select .title {
|
||||
width: 100px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.material-select .media_id {
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="addEdit" class="reply-form" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<el-form :model="form.model" :rules="form.rules" ref="formRef" label-width="100px">
|
||||
<el-form-item v-if="form.model.group == 'keywords'" label="关键字" prop="keywords">
|
||||
<div>
|
||||
<el-input class="sa-w-360" v-model="keywords" placeholder="请输入关键字、空格确认"
|
||||
@keyup.space="onAddKeywords(keywords)">
|
||||
</el-input>
|
||||
<el-scrollbar>
|
||||
<div class="sa-flex">
|
||||
<el-tag class="keywords" v-for="(tag,index) in form.model.keywords" :key="tag"
|
||||
closable :disable-transitions="false" @close="onDeleteKeywords(index)">{{ tag }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="类型" required>
|
||||
<el-radio-group v-model="form.model.type" @change="onChangeType">
|
||||
<el-radio label="news">图文消息</el-radio>
|
||||
<el-radio label="image">图片</el-radio>
|
||||
<el-radio label="video">视频</el-radio>
|
||||
<el-radio label="voice">语音</el-radio>
|
||||
<el-radio label="text">文本</el-radio>
|
||||
<el-radio label="link">链接</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="回复内容" prop="content">
|
||||
<el-select popper-class="material-select" v-model="form.model.content">
|
||||
<el-option v-for="item in material.select" :key="item.media_id" :label="item.title"
|
||||
:value="item.media_id + ''">
|
||||
<div class="sa-flex">
|
||||
<sa-image v-if="
|
||||
item.type == 'news' ||
|
||||
item.type == 'image' ||
|
||||
item.type == 'video' ||
|
||||
item.type == 'link'
|
||||
" :url="item.thumb_url" size="30"></sa-image>
|
||||
<div class="title ml-2 sa-table-line-1">
|
||||
{{ item.title }}
|
||||
</div>
|
||||
<div class="media_id ml-2 sa-table-line-1">
|
||||
{{ item.media_id }}
|
||||
</div>
|
||||
</div>
|
||||
</el-option>
|
||||
<sa-pagination class="is-ellipsis" v-model="material.pagination"
|
||||
@pagination-change="getMaterialSelect">
|
||||
</sa-pagination>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" required>
|
||||
<el-radio-group v-model="form.model.status">
|
||||
<el-radio label="enable">启用</el-radio>
|
||||
<el-radio label="disabled">禁用</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" @click="onConfirm">确定</el-button>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
106
application/admin/view/shopro/wechat/reply/index.html
Normal file
106
application/admin/view/shopro/wechat/reply/index.html
Normal file
@@ -0,0 +1,106 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.reply-index .reply-main {
|
||||
--el-main-padding: 0 20px;
|
||||
}
|
||||
|
||||
.reply-index .card-wrap {
|
||||
padding: 12px;
|
||||
line-height: 1;
|
||||
box-shadow: 0 1px 6px #5959591f;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--sa-space);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.reply-index .card-wrap:hover {
|
||||
box-shadow: 0 3px 12px #59595933;
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
.reply-index .card-wrap .item-type-text {
|
||||
font-size: 12px;
|
||||
color: var(--sa-subfont);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.reply-index .card-wrap .item-content {
|
||||
height: 40px;
|
||||
line-height: 20px;
|
||||
word-break: break-all;
|
||||
font-size: 12px;
|
||||
color: var(--sa-subfont);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.reply-index .card-wrap .item-keywords {
|
||||
border: none;
|
||||
border-radius: 12px;
|
||||
margin-right: 4px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.reply-index .card-wrap .item-keywords:last-of-type {
|
||||
margin-right: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="index" class="reply-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-header class="sa-header">
|
||||
<el-tabs class="sa-tabs" v-model="state.group" @tab-change="getData">
|
||||
<el-tab-pane label="关键字回复" name="keywords"></el-tab-pane>
|
||||
<el-tab-pane label="关注回复" name="subscribe"></el-tab-pane>
|
||||
<el-tab-pane label="默认回复" name="default"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="sa-title sa-flex sa-row-between">
|
||||
<div class="sa-title-left">
|
||||
<div class="left-name">自动回复</div>
|
||||
</div>
|
||||
<div class="sa-title-right">
|
||||
<el-button class="sa-button-refresh" icon="RefreshRight" @click="getData"></el-button>
|
||||
{if $auth->check('shopro/wechat/reply/add')}
|
||||
<el-button icon="Plus" type="primary" @click="onAdd">添加</el-button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="reply-main">
|
||||
<el-row :gutter="16">
|
||||
<el-col v-for="item in state.data" :key="item" :xs="12" :sm="8" :md="6" :lg="4" :xl="4">
|
||||
<div class="card-wrap">
|
||||
<div class="item-type-text">{{ item.type_text }}</div>
|
||||
<div class="item-content sa-line-2">{{ item.content }}</div>
|
||||
<el-scrollbar v-if="state.group=='keywords'">
|
||||
<div class="sa-flex">
|
||||
<el-tag class="item-keywords" v-for="keyword in item.keywords">{{keyword}}</el-tag>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
<div class="sa-flex sa-row-between">
|
||||
<el-tooltip effect="dark" :content="item.status_text" placement="top-start">
|
||||
{if $auth->check('shopro/wechat/reply/edit')}
|
||||
<el-switch v-model="item.status" active-value="enable" inactive-value="disabled"
|
||||
@change="onChangeStatus(item)"></el-switch>
|
||||
{/if}
|
||||
</el-tooltip>
|
||||
<div class="sa-flex">
|
||||
{if $auth->check('shopro/wechat/reply/edit')}
|
||||
<el-button type="primary" link @click="onEdit(item.id)">编辑</el-button>
|
||||
{/if}
|
||||
<el-popconfirm width="fit-content" confirm-button-text="确认" cancel-button-text="取消"
|
||||
title="确认删除这条记录?" @confirm="onDelete(item.id)">
|
||||
<template #reference>
|
||||
{if $auth->check('shopro/wechat/reply/delete')}
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
{/if}
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</div>
|
||||
Reference in New Issue
Block a user