|
@@ -1,245 +0,0 @@
|
|
|
-<template>
|
|
|
- <div id="index">
|
|
|
- <el-row>
|
|
|
- <el-col :span="24" class="main">
|
|
|
- <el-col :span="24" class="crumbs">
|
|
|
- <el-breadcrumb separator="/">
|
|
|
- <el-breadcrumb-item> <i class="el-icon-lx-cascades"></i> 商家用户管理 </el-breadcrumb-item>
|
|
|
- </el-breadcrumb>
|
|
|
- </el-col>
|
|
|
- <el-col :span="24" class="container down">
|
|
|
- <el-col :span="24" class="downTop">
|
|
|
- <el-col :span="12" class="left">
|
|
|
- <el-input v-model="searchInput" placeholder="名字"></el-input>
|
|
|
- <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12" class="right">
|
|
|
- <el-button type="primary" size="small" @click="dialog = true">添加</el-button>
|
|
|
- </el-col>
|
|
|
- </el-col>
|
|
|
- <el-col :span="24" class="downList">
|
|
|
- <data-table
|
|
|
- :fields="fields"
|
|
|
- :opera="opera"
|
|
|
- :data="list"
|
|
|
- :total="total"
|
|
|
- @view="toView"
|
|
|
- @edit="toEdit"
|
|
|
- @delete="toDelete"
|
|
|
- @query="search"
|
|
|
- ></data-table>
|
|
|
- </el-col>
|
|
|
- </el-col>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-dialog :visible.sync="dialog" title="商家用户信息" @close="toClose" :destroy-on-close="true" width="50%">
|
|
|
- <data-form :data="form" :fields="formFields" :rules="rules" @save="turnSave">
|
|
|
- <template #radios="{item}">
|
|
|
- <template v-if="item.model == 'srpt'">
|
|
|
- <el-radio :label="0">不可以</el-radio>
|
|
|
- <el-radio :label="1">可以</el-radio>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- <template #custom="{item}">
|
|
|
- <template v-if="item.model == 'logo'">
|
|
|
- <el-col :span="24">
|
|
|
- <upload :limit="1" :data="form.logo" type="logo" :url="'/files/ccb/upload'" @upload="uploadSuccess"></upload>
|
|
|
- </el-col>
|
|
|
- </template>
|
|
|
- <template v-if="item.model == 'advertpic'">
|
|
|
- <el-col :span="24">
|
|
|
- <upload :limit="1" :data="form.advertpic" type="advertpic" :url="'/files/ccb/upload'" @upload="uploadSuccess"></upload>
|
|
|
- </el-col>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- </data-form>
|
|
|
- </el-dialog>
|
|
|
- <el-dialog :visible.sync="qrdialog" title="商家二维码" @close="toqrClose" width="20%">
|
|
|
- <div style="text-align:center">
|
|
|
- <img :src="qc" />
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import Vue from 'vue';
|
|
|
-import dataTable from '@/components/frame/filter-page-table.vue';
|
|
|
-import dataForm from '@/components/frame/form.vue';
|
|
|
-import upload from '@/components/frame/uploadone.vue';
|
|
|
-import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
-const { mapActions: sj } = createNamespacedHelpers('sj');
|
|
|
-import QRCode from 'qrcode';
|
|
|
-export default {
|
|
|
- metaInfo: { title: '商家用户管理' },
|
|
|
- name: 'index',
|
|
|
- props: {},
|
|
|
- components: {
|
|
|
- dataTable, //列表组件
|
|
|
- dataForm, //表单组件
|
|
|
- upload, //图片组件
|
|
|
- },
|
|
|
- data: function() {
|
|
|
- return {
|
|
|
- // 搜索
|
|
|
- searchInput: '',
|
|
|
- // 商家用户功能操作+列表
|
|
|
- opera: [
|
|
|
- {
|
|
|
- label: '查看二维码',
|
|
|
- icon: 'el-icon-view',
|
|
|
- method: 'view',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '修改',
|
|
|
- icon: 'el-icon-edit',
|
|
|
- method: 'edit',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '删除',
|
|
|
- icon: 'el-icon-delete',
|
|
|
- method: 'delete',
|
|
|
- },
|
|
|
- ],
|
|
|
- fields: [
|
|
|
- { label: '名字', prop: 'name' },
|
|
|
- { label: '地址', prop: 'addr' },
|
|
|
- { label: '电话', prop: 'tel' },
|
|
|
- { label: '是否可登录系统', prop: 'srpt', format: i => (i == 0 ? '不可以' : '可以') },
|
|
|
- ],
|
|
|
- list: [],
|
|
|
- total: 0,
|
|
|
- // 添加用户
|
|
|
- dialog: false,
|
|
|
- form: {
|
|
|
- srpt: 0,
|
|
|
- },
|
|
|
- formFields: [
|
|
|
- { label: '名字', required: true, model: 'name' },
|
|
|
- { label: '地址', required: false, model: 'addr' },
|
|
|
- { label: '手机号', required: true, model: 'tel', placeholder: '系统登录用户名', options: { maxlength: 11, minlength: 11 } },
|
|
|
- { label: '系统登录密码', required: true, model: 'pwd', type: 'password' },
|
|
|
- { label: '是否可登录系统', required: true, model: 'srpt', type: 'radio' },
|
|
|
- { label: '商家LOGO', required: false, model: 'logo', custom: true },
|
|
|
- { label: '广告图', required: false, model: 'advertpic', custom: true },
|
|
|
- { label: '商家说明', required: false, model: 'explain', type: 'textarea', options: { maxlength: 200 } },
|
|
|
- ],
|
|
|
- // 验证
|
|
|
- rules: {
|
|
|
- name: [{ required: true, message: '请输入名字', trigger: 'blur' }],
|
|
|
- tel: [{ required: true, message: '请输入电话', trigger: 'blur' }],
|
|
|
- pwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
|
|
|
- },
|
|
|
- // 查看二维码
|
|
|
- qrdialog: false,
|
|
|
- qc: '',
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.search();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 搜索数据
|
|
|
- ...sj(['query', 'fetch', 'create', 'update', 'delete']),
|
|
|
- // 搜索数据
|
|
|
- async search({ skip = 0, limit = 10, ...info } = {}) {
|
|
|
- if (this.searchInput) {
|
|
|
- info = {
|
|
|
- name: this.searchInput,
|
|
|
- };
|
|
|
- }
|
|
|
- const res = await this.query({ skip, limit, js: '2', ...info });
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- this.$set(this, `list`, res.data);
|
|
|
- this.$set(this, `total`, res.total);
|
|
|
- }
|
|
|
- },
|
|
|
- // 查看二维码
|
|
|
- // 商家二维码,扫码注册商家销售员,ssid:存储为商家id
|
|
|
- async toView({ data }) {
|
|
|
- this.qrdialog = true;
|
|
|
- let url = `${process.env.NODE_ENV === 'development' ? 'http://jh.tgoodsoft.net' : Vue.config.weixin.baseUrl}/ccbmobile/saleRegister?ssid=${
|
|
|
- data.tableid
|
|
|
- }&ssjs=2`; // 需要转换为二维码的内容
|
|
|
- let el = document.getElementById('qrCodeUrl');
|
|
|
- this.qc = await QRCode.toDataURL(url, { height: 300, width: 300 });
|
|
|
- },
|
|
|
- // 修改
|
|
|
- toEdit({ data }) {
|
|
|
- this.$set(this, `form`, data);
|
|
|
- this.dialog = true;
|
|
|
- },
|
|
|
- // 删除
|
|
|
- async toDelete({ data }) {
|
|
|
- const res = await this.delete(data.tableid);
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- this.$message({
|
|
|
- message: '删除信息成功',
|
|
|
- type: 'success',
|
|
|
- });
|
|
|
- this.search();
|
|
|
- }
|
|
|
- },
|
|
|
- // 保存用户
|
|
|
- async turnSave({ data }) {
|
|
|
- if (data.id) {
|
|
|
- const res = await this.update({ ...data, id: data.tableid });
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- this.$message({
|
|
|
- message: '修改信息成功',
|
|
|
- type: 'success',
|
|
|
- });
|
|
|
- this.toClose();
|
|
|
- this.search();
|
|
|
- }
|
|
|
- } else {
|
|
|
- data.ssjs = '1';
|
|
|
- data.ssid = this.user.tableid;
|
|
|
- data.js = '2';
|
|
|
- const res = await this.create(data);
|
|
|
- if (this.$checkRes(res)) {
|
|
|
- this.$message({
|
|
|
- message: '创建信息成功',
|
|
|
- type: 'success',
|
|
|
- });
|
|
|
- this.toClose();
|
|
|
- this.search();
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- // 取消添加
|
|
|
- toClose() {
|
|
|
- this.form = {};
|
|
|
- this.dialog = false;
|
|
|
- },
|
|
|
- // 关闭二维码
|
|
|
- toqrClose() {
|
|
|
- this.qrdialog = false;
|
|
|
- },
|
|
|
- // 图片
|
|
|
- uploadSuccess({ type, data }) {
|
|
|
- this.$set(this.form, `${type}`, data.uri);
|
|
|
- },
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapState(['user']),
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.down {
|
|
|
- .downTop {
|
|
|
- margin-bottom: 20px;
|
|
|
- .left {
|
|
|
- .el-input {
|
|
|
- width: 89%;
|
|
|
- margin: 0 10px 0 0;
|
|
|
- }
|
|
|
- }
|
|
|
- .right {
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|