123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213 |
- <template>
- <div id="index">
- <el-col :span="24" class="main" v-loading="loadings" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
- <data-form :span="24" :fields="fields" :rules="rules" v-model="form" labelWidth="150px" @save="toSave">
- <template #buyPoint>
- <el-input v-model="form.buyPoint" type="number" placeholder="请输入购物赠送积分"></el-input>
- <p style="color: #999">金额:积分=10:1</p>
- </template>
- <template #autoCloseOrder>
- <el-input v-model="form.autoCloseOrder" type="number" placeholder="请输入自动关闭订单时间"></el-input>
- <p style="color: #999">关闭订单时间小于等于0时不自动关闭</p>
- </template>
- <template #agree>
- <editor v-model="form.agree" url="/files/point/config/upload" />
- </template>
- <template #bottom_menu>
- <data-form :span="24" :fields="testfields" v-model="form.bottom_menu" labelWidth="auto" :isSave="false">
- <template #list>
- <el-col :span="24" style="margin: 0 0 10px 0">
- <el-button type="primary" size="mini" @click="toAdd()">添加</el-button>
- </el-col>
- <data-table :usePage="false" :fields="fieldsList" :opera="opera" :data="list" @edit="toEdit" @del="toDel"> </data-table>
- </template>
- </data-form>
- </template>
- </data-form>
- </el-col>
- <e-dialog :dialog="dialog" @toClose="toClose">
- <template v-slot:info>
- <data-form :span="24" :fields="fieldsForm" :rules="fieldRules" v-model="fieldform" labelWidth="150px" @save="onSubmit">
- <template #is_use>
- <el-option v-for="i in useList" :key="i.model" :label="i.label" :value="i.value"></el-option>
- </template>
- <template #type>
- <el-option v-for="i in typeList" :key="i.model" :label="i.label" :value="i.value"></el-option>
- </template>
- </data-form>
- </template>
- </e-dialog>
- </div>
- </template>
- <script>
- import { mapState, createNamespacedHelpers } from 'vuex';
- const { mapActions: config } = createNamespacedHelpers('config');
- const { mapActions: dictData } = createNamespacedHelpers('dictData');
- export default {
- name: 'index',
- props: {},
- components: { editor: () => import('@/components/editor.vue') },
- data: function () {
- return {
- loadings: true,
- fields: [
- { label: '系统名称', model: 'title' },
- { label: 'logo', model: 'logo', type: 'upload', limit: 1, url: '/files/point/config/upload' },
- { label: '购物赠送积分', model: 'buyPoint', custom: true },
- { label: '自动关闭订单时间', model: 'autoCloseOrder', custom: true },
- { label: '提现日期', model: 'reward_day', type: 'Number' },
- { label: '底部文字', model: 'bottom_title' },
- { label: '底部菜单', model: 'bottom_menu', custom: true },
- { label: '分享图片', model: 'share', type: 'upload', limit: 1, url: '/files/point/config/upload' },
- { label: '用户协议', model: 'agree', custom: true },
- ],
- rules: {},
- form: { bottom_menu: {} },
- testfields: [{ label: '菜单列表', model: 'list', custom: true }],
- // 底部菜单
- opera: [
- { label: '修改', method: 'edit' },
- { label: '删除', method: 'del', confirm: true, type: 'danger' },
- ],
- list: [],
- fieldsList: [
- { label: '名称', model: 'name' },
- { label: '跳转路径', model: 'route' },
- { label: '未选中', model: 'normal[0].name' },
- { label: '选中', model: 'active[0].name' },
- {
- label: '跳转类型',
- model: 'type',
- format: (i) => {
- let data = this.typeList.find((f) => f.value == i);
- if (data) return data.label;
- else return '暂无';
- },
- },
- {
- label: '是否正在使用',
- model: 'is_use',
- format: (i) => {
- let data = this.useList.find((f) => f.value == i);
- if (data) return data.label;
- else return '暂无';
- },
- },
- { label: '排序', model: 'sort' },
- ],
- // 底部菜单表单
- fieldRules: {
- name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
- route: [{ required: true, message: '请输入跳转路径', trigger: 'blur' }],
- normal: [{ required: true, message: '请选择未选中', trigger: 'change' }],
- active: [{ required: true, message: '请选择选中', trigger: 'change' }],
- type: [{ required: true, message: '请选择跳转类型', trigger: 'change' }],
- is_use: [{ required: true, message: '请选择是否使用', trigger: 'change' }],
- sort: [{ required: true, message: '请输入排序', trigger: 'blur' }],
- },
- fieldform: {},
- fieldsForm: [
- { label: '名称', model: 'name' },
- { label: '跳转路径', model: 'route' },
- { label: '未选中', model: 'normal', type: 'upload', limit: 1, url: '/files/point/config/upload' },
- { label: '选中', model: 'active', type: 'upload', limit: 1, url: '/files/point/config/upload' },
- { label: '跳转类型', model: 'type', type: 'select' },
- { label: '是否使用', model: 'is_use', type: 'select' },
- { label: '排序', model: 'sort', type: 'number' },
- ],
- // 是否使用
- useList: [],
- // 跳转类型
- typeList: [
- { label: 'redirectTo', value: '0' },
- { label: 'navigateTo', value: '1' },
- ],
- // 弹框
- dialog: { title: '信息管理', show: false, type: '1' },
- };
- },
- computed: {
- ...mapState(['user']),
- },
- async created() {
- await this.searchOther();
- await this.search();
- },
- methods: {
- ...config(['query', 'fetch', 'update']),
- ...dictData({ dictQuery: 'query' }),
- //执行查询
- async search() {
- const res = await this.fetch();
- if (this.$checkRes(res)) {
- let data = res.data;
- if (data.config) {
- data = {
- ...data,
- logo: data.config.logo,
- buyPoint: Number(data.config.buyPoint),
- pointPlan: data.config.pointPlan,
- share: data.config.share,
- autoCloseOrder: data.config.autoCloseOrder,
- };
- }
- if (!data.bottom_menu) data.bottom_menu = {};
- else {
- let list = _.sortBy(data.bottom_menu.list, function (item) {
- return item.sort;
- });
- this.$set(this, `list`, list);
- }
- this.$set(this, `form`, data);
- }
- this.loadings = false;
- },
- async toAdd() {
- this.dialog = { title: '信息管理', show: true, type: '1' };
- },
- // 关闭
- toClose() {
- this.fieldform = {};
- this.dialog = { title: '信息管理', show: false, type: '1' };
- },
- // 修改
- toEdit(index, data) {
- this.$set(this, `fieldform`, index.data);
- this.dialog = { title: '信息管理', show: true, type: '1' };
- },
- // 删除
- toDel(index, data) {
- let list = this.list;
- let num = index.index;
- list.splice(num, 1);
- },
- // 底部菜单提交
- onSubmit({ data }) {
- let info = this.list.find((f) => f.route == data.route);
- if (info == '' || info == undefined) this.list.push(data);
- this.toClose();
- },
- // 保存
- async toSave({ data }) {
- data.bottom_menu.list = this.list;
- let config = { logo: data.logo, buyPoint: Number(data.buyPoint), pointPlan: data.pointPlan, share: data.share, autoCloseOrder: data.autoCloseOrder };
- data.config = config;
- const res = await this.update(data);
- this.$checkRes(res, '操作成功', '操作失败');
- },
- // 查询其他信息
- async searchOther() {
- let res;
- // 是否使用
- res = await this.dictQuery({ code: 'use' });
- if (this.$checkRes(res)) this.$set(this, `useList`, res.data);
- },
- },
- metaInfo() {
- return { title: this.$route.meta.title };
- },
- };
- </script>
- <style lang="less" scoped></style>
|