|
|
@@ -1,320 +1,21 @@
|
|
|
<template>
|
|
|
- <div class="app-list-content">
|
|
|
- <div class="content-wrap">
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="app-list-content">
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { mapGetters } from 'vuex';
|
|
|
- import operateLineModule from '@/components/module/operate-line';
|
|
|
- export default {
|
|
|
- name: 'order-add',
|
|
|
- components: {
|
|
|
- operateLineModule
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- form: {
|
|
|
- name: '',
|
|
|
- menuOption: '0',
|
|
|
- replyUrl: '',
|
|
|
- targetId: 0
|
|
|
- },
|
|
|
- rule: {},
|
|
|
- isModifyParents: false,
|
|
|
- // isAdd: false,
|
|
|
- addDialog: false,
|
|
|
- activeIndex: null,
|
|
|
- subActiveIndex: null,
|
|
|
- menuData: [],
|
|
|
- // 常用链接
|
|
|
- urlIndex: null,
|
|
|
- commonUrlData: [],
|
|
|
- // 操作菜单
|
|
|
- operateShow: [],
|
|
|
- operateData: null,
|
|
|
- // 按钮列表
|
|
|
- btnData: []
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters(['shopInfo', 'userInfo'])
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.init();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- init() {
|
|
|
- this._getDet();
|
|
|
- this._getUrl();
|
|
|
- },
|
|
|
- _getDet() {
|
|
|
- this.$service.setting.getMenu().then(res => {
|
|
|
- this.menuData = res.map(e => {
|
|
|
- if (!e.children) {
|
|
|
- e.children = [];
|
|
|
- }
|
|
|
-
|
|
|
- return e;
|
|
|
- });
|
|
|
- res.map(() => {
|
|
|
- this.operateShow.push(false);
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- _getUrl() {
|
|
|
- this.$service.single.commonUrl().then(res => {
|
|
|
- this.commonUrlData = res;
|
|
|
- });
|
|
|
- },
|
|
|
- async submitFn() {
|
|
|
- console.log(this.menuData);
|
|
|
- // return false;
|
|
|
- await this.$service.setting.updateMenu(this.menuData).then(res => {
|
|
|
- this.$message.success(res.msg || '提交');
|
|
|
- // this.closeOperate();
|
|
|
- this.resetForm();
|
|
|
- });
|
|
|
- },
|
|
|
- // operate
|
|
|
- menuClickFn(item, index) {
|
|
|
- this.isModifyParents = true;
|
|
|
- // this.isAdd = false;
|
|
|
-
|
|
|
- this.closeOperate();
|
|
|
- this.activeIndex = index;
|
|
|
- this.operateShow[index] = true;
|
|
|
- this.operateData = item.children || [];
|
|
|
- // 修改
|
|
|
- // this.dialogData = item;
|
|
|
- // this.form.name = JSON.parse(JSON.stringify(item.name));
|
|
|
- console.log('江总', item);
|
|
|
- console.log('江总11', this.commonUrlData);
|
|
|
- Object.keys(this.form).forEach(i => {
|
|
|
- this.form[i] = item[i];
|
|
|
- });
|
|
|
-
|
|
|
- this.addDialog = true;
|
|
|
- },
|
|
|
- // operate
|
|
|
- operateClickFn(item) {
|
|
|
- this.isModifyParents = false;
|
|
|
- // this.isAdd = false;
|
|
|
- this.subActiveIndex = item.index;
|
|
|
- console.log('item', item);
|
|
|
- // this.dialogData = item;
|
|
|
- item.targetId = item.targetId ? parseInt(item.targetId) : 0;
|
|
|
-
|
|
|
- Object.keys(this.form).forEach(i => {
|
|
|
- this.form[i] = item[i];
|
|
|
- });
|
|
|
- this.addDialog = true;
|
|
|
- },
|
|
|
- operateAddFn(index) {
|
|
|
- if (this.operateData.length > 4) {
|
|
|
- this.$message.warning('亲,最多只能设置五个子菜单!')
|
|
|
- return false
|
|
|
- }
|
|
|
- // this.isModifyParents = false;
|
|
|
-
|
|
|
- let form = {
|
|
|
- name: '子菜单名',
|
|
|
- menuOption: '0',
|
|
|
- replyUrl: '',
|
|
|
- targetId: 0
|
|
|
- };
|
|
|
-
|
|
|
- this.$set(this.operateShow, this.activeIndex, false);
|
|
|
- this.operateData.push(form);
|
|
|
- this.menuData[this.activeIndex].children = JSON.parse(JSON.stringify(this.operateData));
|
|
|
-
|
|
|
- setTimeout(() => {
|
|
|
- this.$set(this.operateShow, this.activeIndex, true);
|
|
|
- });
|
|
|
- // this.isAdd = true;
|
|
|
- // this.dialogData = this.menuData[3].children[index];
|
|
|
- // this.addDialog = true;
|
|
|
- // if (this.$refs['form']) {
|
|
|
- // console.log('asdf');
|
|
|
- // this.resetForm()
|
|
|
- // }
|
|
|
- },
|
|
|
- operateDelFn(index) {
|
|
|
- console.log('我点击了删除按钮!', index)
|
|
|
- // this.closeOperate();
|
|
|
- this.$set(this.operateShow, this.activeIndex, false);
|
|
|
- this.operateData.splice(index, 1);
|
|
|
-
|
|
|
- this.menuData[this.activeIndex].children = JSON.parse(JSON.stringify(this.operateData));
|
|
|
-
|
|
|
- setTimeout(() => {
|
|
|
- this.$set(this.operateShow, this.activeIndex, true);
|
|
|
- });
|
|
|
- },
|
|
|
- closeOperate() {
|
|
|
- this.activeIndex = null;
|
|
|
- this.operateShow = this.operateShow.map(e => (e = false));
|
|
|
- this.addDialog = false;
|
|
|
- // if (this.addDialog) {
|
|
|
- // this.resetForm();
|
|
|
- // }
|
|
|
- },
|
|
|
- closeOptionFn() {
|
|
|
- this.closeOperate();
|
|
|
- this.resetForm();
|
|
|
- },
|
|
|
- // modal
|
|
|
- confirmForm() {
|
|
|
- let form = JSON.parse(JSON.stringify(this.form));
|
|
|
-
|
|
|
- if (this.isModifyParents) {
|
|
|
- Object.keys(form).forEach(i => {
|
|
|
- this.menuData[this.activeIndex][i] = form[i];
|
|
|
- });
|
|
|
- console.log('江总22', this.menuData);
|
|
|
- // 如果是父菜单操作时
|
|
|
- // this.menuData[this.activeIndex].name = form.name;
|
|
|
- } else {
|
|
|
- // 如果是子菜单操作时
|
|
|
- // if (this.isAdd) {
|
|
|
- // } else {
|
|
|
- this.operateData[this.subActiveIndex] = form;
|
|
|
- // }
|
|
|
-
|
|
|
- console.log('this.operateData', this.operateData)
|
|
|
-
|
|
|
- this.menuData[this.activeIndex].children = JSON.parse(JSON.stringify(this.operateData));
|
|
|
- }
|
|
|
- this.submitFn().then(res => {
|
|
|
- console.log('this.activeIndex', this.activeIndex);
|
|
|
-
|
|
|
- this.addDialog = false;
|
|
|
- // if (this.isAdd) {
|
|
|
- // }
|
|
|
- });
|
|
|
- },
|
|
|
- resetForm() {
|
|
|
- this.form = {
|
|
|
- name: '',
|
|
|
- menuOption: '0',
|
|
|
- replyUrl: '',
|
|
|
- targetId: 0
|
|
|
- };
|
|
|
- this.$refs['form'].resetFields();
|
|
|
- // this.addDialog = false;
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
+export default {
|
|
|
+ name: 'order-add',
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ }
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .app-list-content {
|
|
|
- background-color: #fff;
|
|
|
- }
|
|
|
- .content-wrap {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- // wx 容器
|
|
|
- .wx-wrap {
|
|
|
- width: 375px;
|
|
|
- margin: 0 15px;
|
|
|
- padding-top: 20px;
|
|
|
- flex-shrink: 0;
|
|
|
- // 头部
|
|
|
- .wx-bar {
|
|
|
- position: relative;
|
|
|
- .bar-text {
|
|
|
- position: absolute;
|
|
|
- top: 30px;
|
|
|
- font-size: 17px;
|
|
|
- font-weight: 500;
|
|
|
- color: #fff;
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- }
|
|
|
- .wx-content {
|
|
|
- width: 100%;
|
|
|
- height: 555px;
|
|
|
- background-color: #ededed;
|
|
|
- }
|
|
|
- // 按钮
|
|
|
- .wx-btn {
|
|
|
- @include disFlex(center, space-between);
|
|
|
- background-color: #f7f7f7;
|
|
|
- padding: 10px;
|
|
|
- height: 45px;
|
|
|
- .key-btn {
|
|
|
- width: 13%;
|
|
|
- .key-btn-img {
|
|
|
- width: 40px;
|
|
|
- }
|
|
|
- }
|
|
|
- .menu-btn {
|
|
|
- width: 29%;
|
|
|
- height: calc(100% - 30px);
|
|
|
- @include disFlex(center, center);
|
|
|
- border-left: 2px solid $borderColor;
|
|
|
- &.active {
|
|
|
- /deep/.operate-module-line {
|
|
|
- .operate-btn {
|
|
|
- color: $mainColor;
|
|
|
- .iconfont {
|
|
|
- color: #09bb07;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .iconfont-blo {
|
|
|
- margin-right: 6px;
|
|
|
- }
|
|
|
- .iconfont {
|
|
|
- color: $fontColor3;
|
|
|
- font-size: 24px;
|
|
|
- transform: scale(0.6);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- // 编辑块
|
|
|
- .ad-modal-content {
|
|
|
- width: 640px;
|
|
|
- min-width: 640px;
|
|
|
- height: 640px;
|
|
|
- border: 20px solid #f7f7f7;
|
|
|
- // border-top: 0;
|
|
|
- margin-top: 20px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- // padding: 20px;
|
|
|
- background-color: #f7f7f7;
|
|
|
-
|
|
|
- .ad-modal-wrap {
|
|
|
- width: 100%;
|
|
|
- .content-j-wrap {
|
|
|
- width: 100%;
|
|
|
- height: 460px;
|
|
|
- background-color: #fff;
|
|
|
- padding-top: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .dialog-footer {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- // justify-content: center;
|
|
|
- // padding-left: 100px;
|
|
|
- margin-top: 10px;
|
|
|
- .el-button {
|
|
|
- margin: 0 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .prompt-text {
|
|
|
- padding: 30px 30px 60px 30px;
|
|
|
- color: $fontColor3;
|
|
|
- }
|
|
|
</style>
|