|
|
@@ -0,0 +1,172 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-page-header :content="isEdit?'编辑菜单':'添加菜单'" @back="goBack" />
|
|
|
+ <el-card class="form-container" shadow="never">
|
|
|
+ <el-form ref="weChatMenuFrom" :model="menu" :rules="rules" label-width="150px">
|
|
|
+ <el-form-item label="上级菜单:" prop="parentId">
|
|
|
+ <el-input v-model="parentTitle" readonly />
|
|
|
+ <input v-model="menu.parentId" type="hidden">
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="菜单标题:" prop="name">
|
|
|
+ <el-input v-model="menu.name" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="响应动作类型:" prop="type">
|
|
|
+ <el-select v-model="menu.type" placeholder="请选择">
|
|
|
+ <el-option value="" label="请选择" />
|
|
|
+ <el-option value="view" label="跳转URL" />
|
|
|
+ <el-option value="miniprogram" label="跳转小程序" />
|
|
|
+ <el-option value="view_limited" label="跳转图文消息URL" />
|
|
|
+ <el-option value="media_id" label="下发消息（除文本消息）" />
|
|
|
+ <el-option value="click" label="点击推事件" />
|
|
|
+ <el-option value="scancode_push" label="扫码推事件" />
|
|
|
+ <el-option value="scancode_waitmsg" label="扫码推事件且弹出“消息接收中”提示框" />
|
|
|
+ <el-option value="pic_sysphoto" label="弹出系统拍照发图" />
|
|
|
+ <el-option value="pic_photo_or_album" label="弹出拍照或者相册发图" />
|
|
|
+ <el-option value="pic_weixin" label="弹出微信相册发图器" />
|
|
|
+ <el-option value="location_select" label="弹出地理位置选择器" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-show="menu.type=='view'" label="网页链接:" prop="url">
|
|
|
+ <el-input v-model="menu.url" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-show="menu.type=='miniprogram'" label="小程序APPID:" prop="appid">
|
|
|
+ <el-input v-model="menu.appid" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-show="menu.type=='miniprogram'" label="小程序页面链接:" prop="pagePath">
|
|
|
+ <el-input v-model="menu.pagePath" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-show="menu.type=='view_limited' || menu.type=='media_id'" label="mediaId:" prop="mediaId">
|
|
|
+ <el-input v-model="menu.mediaId" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-show="['click','scancode_push','scancode_waitmsg','pic_sysphoto','pic_photo_or_album','pic_weixin','location_select'].indexOf(menu.type)>=0" label="KEY:" prop="key">
|
|
|
+ <el-input v-model="menu.key" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="排序:">
|
|
|
+ <el-input v-model="menu.sort" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="onSubmit('weChatMenuFrom')">提交</el-button>
|
|
|
+ <el-button v-if="!isEdit" @click="resetForm('weChatMenuFrom')">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { getMenu, updateMenu, createMenu } from '@/api/wechat/menu'
|
|
|
+const defaultMenu = {
|
|
|
+ id: '',
|
|
|
+ name: '',
|
|
|
+ type: '',
|
|
|
+ url: '',
|
|
|
+ key: '',
|
|
|
+ mediaId: '',
|
|
|
+ appid: '',
|
|
|
+ pagePath: '',
|
|
|
+ sort: 0,
|
|
|
+ parentId: 0
|
|
|
+}
|
|
|
+export default {
|
|
|
+ name: 'WeChatMenuForm',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ rules: {
|
|
|
+ name: [{ required: true, message: '菜单标题不能为空', trigger: 'blur' }]
|
|
|
+ },
|
|
|
+ parentTitle: '',
|
|
|
+ menu: Object.assign({}, defaultMenu),
|
|
|
+ isEdit: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ $route(route) {
|
|
|
+ this.getFormData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getFormData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ goBack() {
|
|
|
+ window.history.go(-1)
|
|
|
+ },
|
|
|
+ getFormData() {
|
|
|
+ if (this.$route.query.id) {
|
|
|
+ this.menu.id = this.$route.query.id
|
|
|
+ this.isEdit = true
|
|
|
+ getMenu(this.menu.id).then(response => {
|
|
|
+ this.menu.name = response.data.name
|
|
|
+ this.menu.type = response.data.type
|
|
|
+ this.menu.url = response.data.url
|
|
|
+ this.menu.key = response.data.key
|
|
|
+ this.menu.mediaId = response.data.mediaId
|
|
|
+ this.menu.appid = response.data.appid
|
|
|
+ this.menu.pagePath = response.data.pagePath
|
|
|
+ this.menu.sort = response.data.sort
|
|
|
+ this.menu.parentId = response.data.parentId
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.menu.id = ''
|
|
|
+ this.isEdit = false
|
|
|
+ this.menu = Object.assign({}, defaultMenu)
|
|
|
+ }
|
|
|
+ if (this.$route.query.parentId) {
|
|
|
+ this.menu.parentId = this.$route.query.parentId
|
|
|
+ this.parentTitle = this.$route.query.title
|
|
|
+ } else {
|
|
|
+ this.menu.parentId = 0
|
|
|
+ this.parentTitle = '无'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ resetForm(formName) {
|
|
|
+ this.$refs[formName].resetFields()
|
|
|
+ this.menu = Object.assign({}, defaultMenu)
|
|
|
+ this.getFormData()
|
|
|
+ },
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ console.log(this.menu)
|
|
|
+ if (valid) {
|
|
|
+ this.$confirm('是否提交数据', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ if (this.isEdit) {
|
|
|
+ updateMenu(this.$route.query.id, this.menu).then(response => {
|
|
|
+ this.$message({
|
|
|
+ message: '修改成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 1000
|
|
|
+ })
|
|
|
+ this.$router.back()
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ createMenu(this.menu).then(response => {
|
|
|
+ this.$refs[formName].resetFields()
|
|
|
+ this.resetForm(formName)
|
|
|
+ this.$message({
|
|
|
+ message: '提交成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 1000
|
|
|
+ })
|
|
|
+ this.$router.back()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: '验证失败',
|
|
|
+ type: 'error',
|
|
|
+ duration: 1000
|
|
|
+ })
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+</style>
|
chao