纪志凯提交

src/utils/api.js

@@ -0,0 +1,17 @@
+const api = {
+    // 积分订单
+    orderpage: 'orders/page',
+    orderdelete: 'orders/delete',
+    orderinfo: 'orders/info/',
+    ordersave: 'orders/save',
+    orderupdate: 'orders/update',
+    // 配置
+    configpage: 'config/page',
+    configdelete: 'config/delete',
+    configinfo: 'config/info/',
+    configsave: 'config/save',
+    configupdate: 'config/update'
+
+}
+
+export default api

src/utils/base.js

@@ -0,0 +1,16 @@
+const base = {
+    get() {
+                return {
+            url : "http://localhost:8080/springboot1mi5m/",
+            name: "springboot1mi5m",
+            // 退出到首页链接
+            indexUrl: 'http://localhost:8080/springboot1mi5m/front/index.html'
+        };
+            },
+    getProjectName(){
+        return {
+            projectName: "餐厅点餐系统"
+        } 
+    }
+}
+export default base

src/utils/http.js

@@ -0,0 +1,29 @@
+import axios from 'axios'
+import router from '@/router/router-static'
+import storage from '@/utils/storage'
+
+const http = axios.create({
+    timeout: 1000 * 86400,
+    withCredentials: true,
+    baseURL: '/springboot1mi5m',
+    headers: {
+        'Content-Type': 'application/json; charset=utf-8'
+    }
+})
+// 请求拦截
+http.interceptors.request.use(config => {
+    config.headers['Token'] = storage.get('Token') // 请求头带上token
+    return config
+}, error => {
+    return Promise.reject(error)
+})
+// 响应拦截
+http.interceptors.response.use(response => {
+    if (response.data && response.data.code === 401) { // 401, token失效
+        router.push({ name: 'login' })
+    }
+    return response
+}, error => {
+    return Promise.reject(error)
+})
+export default http

src/utils/i18n.js

@@ -0,0 +1,12 @@
+// translate router.meta.title, be used in breadcrumb sidebar tagsview
+export function generateTitle(title) {
+  const hasKey = this.$te('route.' + title)
+
+  if (hasKey) {
+    // $t :this method from vue-i18n, inject in @/lang/index.js
+    const translatedTitle = this.$t('route.' + title)
+
+    return translatedTitle
+  }
+  return title
+}

src/utils/menu.js

@@ -0,0 +1,6 @@
+const menu = {
+    list() {
+        return [{"backMenu":[{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"菜品分类","menuJump":"列表","tableName":"caipinfenlei"}],"menu":"菜品分类管理"},{"child":[{"buttons":["新增","查看","修改","删除","查看评论"],"menu":"菜品信息","menuJump":"列表","tableName":"caipinxinxi"}],"menu":"菜品信息管理"},{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"餐桌","menuJump":"列表","tableName":"canzhuo"}],"menu":"餐桌管理"},{"child":[{"buttons":["查看","修改","删除","审核"],"menu":"菜品订单","menuJump":"列表","tableName":"caipindingdan"}],"menu":"菜品订单管理"},{"child":[{"buttons":["查看","修改","删除","审核","报表"],"menu":"菜品评价","menuJump":"列表","tableName":"caipinpingjia"}],"menu":"菜品评价管理"}],"frontMenu":[{"child":[{"buttons":["查看","下单"],"menu":"菜品信息列表","menuJump":"列表","tableName":"caipinxinxi"}],"menu":"菜品信息模块"}],"hasBackLogin":"是","hasBackRegister":"否","hasFrontLogin":"否","hasFrontRegister":"否","roleName":"商家","tableName":"shangjia"},{"backMenu":[{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"用户","menuJump":"列表","tableName":"yonghu"},{"buttons":["新增","查看","修改","删除"],"menu":"商家","menuJump":"列表","tableName":"shangjia"}],"menu":"用户管理"},{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"菜品分类","menuJump":"列表","tableName":"caipinfenlei"}],"menu":"菜品分类管理"},{"child":[{"buttons":["新增","查看","修改","删除","查看评论"],"menu":"菜品信息","menuJump":"列表","tableName":"caipinxinxi"}],"menu":"菜品信息管理"},{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"餐桌","menuJump":"列表","tableName":"canzhuo"}],"menu":"餐桌管理"},{"child":[{"buttons":["查看","修改","删除","审核"],"menu":"菜品订单","menuJump":"列表","tableName":"caipindingdan"}],"menu":"菜品订单管理"},{"child":[{"buttons":["查看","修改","删除","审核","报表"],"menu":"菜品评价","menuJump":"列表","tableName":"caipinpingjia"}],"menu":"菜品评价管理"},{"child":[{"buttons":["新增","查看","修改","删除"],"menu":"菜品资讯","tableName":"news"},{"buttons":["新增","查看","修改","删除"],"menu":"轮播图管理","tableName":"config"}],"menu":"系统管理"}],"frontMenu":[{"child":[{"buttons":["查看","下单"],"menu":"菜品信息列表","menuJump":"列表","tableName":"caipinxinxi"}],"menu":"菜品信息模块"}],"hasBackLogin":"是","hasBackRegister":"否","hasFrontLogin":"否","hasFrontRegister":"否","roleName":"管理员","tableName":"users"},{"backMenu":[{"child":[{"buttons":["查看","删除","支付","评价"],"menu":"菜品订单","menuJump":"列表","tableName":"caipindingdan"}],"menu":"菜品订单管理"},{"child":[{"buttons":["查看","修改","删除"],"menu":"菜品评价","menuJump":"列表","tableName":"caipinpingjia"}],"menu":"菜品评价管理"},{"child":[{"buttons":["查看","删除"],"menu":"我的收藏管理","tableName":"storeup"}],"menu":"我的收藏管理"}],"frontMenu":[{"child":[{"buttons":["查看","下单"],"menu":"菜品信息列表","menuJump":"列表","tableName":"caipinxinxi"}],"menu":"菜品信息模块"}],"hasBackLogin":"是","hasBackRegister":"否","hasFrontLogin":"是","hasFrontRegister":"是","roleName":"用户","tableName":"yonghu"}]
+    }
+}
+export default menu;

src/utils/storage.js

@@ -0,0 +1,15 @@
+const storage = {
+    set(key, value) {
+        localStorage.setItem(key, JSON.stringify(value));
+    },
+    get(key) {
+        return localStorage.getItem(key)?localStorage.getItem(key).replace('"','').replace('"',''):"";
+    },
+    getObj(key) {
+        return localStorage.getItem(key)?JSON.parse(localStorage.getItem(key)):null;
+    },
+    remove(key) {
+        localStorage.removeItem(key);
+    }
+}
+export default storage;

src/utils/utils.js

@@ -0,0 +1,37 @@
+import storage from './storage';
+import menu from './menu';
+/**
+ * 是否有权限
+ * @param {*} key
+ */
+export function isAuth(tableName,key) {
+    let role = storage.get("role");
+    if(!role){
+        role = '管理员';
+    }
+    let menus = menu.list();
+    for(let i=0;i<menus.length;i++){
+        if(menus[i].roleName==role){
+            for(let j=0;j<menus[i].backMenu.length;j++){
+                for(let k=0;k<menus[i].backMenu[j].child.length;k++){
+                    if(tableName==menus[i].backMenu[j].child[k].tableName){
+                        let buttons = menus[i].backMenu[j].child[k].buttons.join(',');
+                        return buttons.indexOf(key) !== -1 || false
+                    }
+                }
+            }
+        }
+    }
+    // for(let i=0;i<menus.length;i++){
+    //     if(menus[i].roleName==role){
+    //         for(let j=0;j<menus[i].backMenu.length;j++){
+    //             if(menus[i].backMenu[j].tableName==tableName){
+    //                 let buttons = menus[i].backMenu[j].child[0].buttons.join(',');
+    //                 return buttons.indexOf(key) !== -1 || false
+    //             }
+    //         }
+    //     }
+    // }
+    return false;
+}
+

src/utils/validate.js

@@ -0,0 +1,57 @@
+/**
+ * 邮箱
+ * @param {*} s
+ */
+export function isEmail (s) {
+  return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)
+}
+
+/**
+ * 手机号码
+ * @param {*} s
+ */
+export function isMobile (s) {
+  return /^1[0-9]{10}$/.test(s)
+}
+
+/**
+ * 电话号码
+ * @param {*} s
+ */
+export function isPhone (s) {
+  return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(s)
+}
+
+/**
+ * URL地址
+ * @param {*} s
+ */
+export function isURL (s) {
+  return /^http[s]?:\/\/.*/.test(s)
+}
+
+/**
+ * 匹配数字，可以是小数，不可以是负数,可以为空
+ * @param {*} s 
+ */
+export function isNumber(s){
+  return  /(^-?[+-]?([0-9]*\.?[0-9]+|[0-9]+\.?[0-9]*)([eE][+-]?[0-9]+)?$)|(^$)/.test(s);
+}
+/**
+ * 匹配整数，可以为空
+ * @param {*} s 
+ */
+export function isIntNumer(s){
+  return  /(^-?\d+$)|(^$)/.test(s);
+}
+/**
+ * 身份证校验
+ */
+export function checkIdCard(idcard) {
+  const regIdCard = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
+  if (!regIdCard.test(idcard)) {
+      return false;
+  } else {
+      return true;
+  }
+}

src/views/modules/caipindingdan/add-or-update.vue

@@ -0,0 +1,661 @@
+<template>
+  <div class="addEdit-block">
+    <el-form
+      class="detail-form-content"
+      ref="ruleForm"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="80px"
+	  :style="{backgroundColor:addEditForm.addEditBoxColor}"
+    >
+      <el-row>
+                        <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'" label="订单编号" prop="dingdanbianhao">
+            <el-input v-model="ruleForm.dingdanbianhao" 
+                placeholder="订单编号" readonly></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" v-if="ruleForm.dingdanbianhao" label="订单编号" prop="dingdanbianhao">
+              <el-input v-model="ruleForm.dingdanbianhao" 
+                placeholder="订单编号" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="菜品名称" prop="caipinmingcheng">
+          <el-input v-model="ruleForm.caipinmingcheng" 
+              placeholder="菜品名称" clearable  :readonly="ro.caipinmingcheng"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="菜品名称" prop="caipinmingcheng">
+              <el-input v-model="ruleForm.caipinmingcheng" 
+                placeholder="菜品名称" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="菜品分类" prop="caipinfenlei">
+          <el-input v-model="ruleForm.caipinfenlei" 
+              placeholder="菜品分类" clearable  :readonly="ro.caipinfenlei"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="菜品分类" prop="caipinfenlei">
+              <el-input v-model="ruleForm.caipinfenlei" 
+                placeholder="菜品分类" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="24">  
+        <el-form-item class="upload" v-if="type!='info' && !ro.tupian" label="图片" prop="tupian">
+          <file-upload
+          tip="点击上传图片"
+          action="file/upload"
+          :limit="3"
+          :multiple="true"
+          :fileUrls="ruleForm.tupian?ruleForm.tupian:''"
+          @change="tupianUploadChange"
+          ></file-upload>
+        </el-form-item>
+        <div v-else>
+          <el-form-item v-if="ruleForm.tupian" label="图片" prop="tupian">
+            <img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in ruleForm.tupian.split(',')" :src="item" width="100" height="100">
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="菜品价格" prop="caipinjiage">
+          <el-input v-model="ruleForm.caipinjiage" 
+              placeholder="菜品价格" clearable  :readonly="ro.caipinjiage"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="菜品价格" prop="caipinjiage">
+              <el-input v-model="ruleForm.caipinjiage" 
+                placeholder="菜品价格" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="下单数量" prop="xiadanshuliang">
+          <el-input v-model="ruleForm.xiadanshuliang" 
+              placeholder="下单数量" clearable  :readonly="ro.xiadanshuliang"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="下单数量" prop="xiadanshuliang">
+              <el-input v-model="ruleForm.xiadanshuliang" 
+                placeholder="下单数量" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="总金额" prop="zongjine">
+            <el-input v-model="zongjine"
+                placeholder="总金额" readonly></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" v-if="ruleForm.zongjine" label="总金额" prop="zongjine">
+              <el-input v-model="ruleForm.zongjine" 
+                placeholder="总金额" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="date" v-if="type!='info'" label="下单时间" prop="xiadanshijian">
+            <el-date-picker
+                value-format="yyyy-MM-dd HH:mm:ss"
+                v-model="ruleForm.xiadanshijian" 
+                type="datetime"
+                placeholder="下单时间">
+            </el-date-picker>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" v-if="ruleForm.xiadanshijian" label="下单时间" prop="xiadanshijian">
+              <el-input v-model="ruleForm.xiadanshijian" 
+                placeholder="下单时间" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="select" v-if="type!='info'"  label="餐桌号" prop="canzhuohao">
+          <el-select v-model="ruleForm.canzhuohao" placeholder="请选择餐桌号">
+            <el-option
+                v-for="(item,index) in canzhuohaoOptions"
+                v-bind:key="index"
+                :label="item"
+                :value="item">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="餐桌号" prop="canzhuohao">
+	      <el-input v-model="ruleForm.canzhuohao"
+                placeholder="餐桌号" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="用户名" prop="yonghuming">
+          <el-input v-model="ruleForm.yonghuming" 
+              placeholder="用户名" clearable  :readonly="ro.yonghuming"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="用户名" prop="yonghuming">
+              <el-input v-model="ruleForm.yonghuming" 
+                placeholder="用户名" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="联系电话" prop="lianxidianhua">
+          <el-input v-model="ruleForm.lianxidianhua" 
+              placeholder="联系电话" clearable  :readonly="ro.lianxidianhua"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="联系电话" prop="lianxidianhua">
+              <el-input v-model="ruleForm.lianxidianhua" 
+                placeholder="联系电话" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                                                                                                        </el-row>
+                                                                                                                                                                                                                                                                                                                                                                                                                          <el-form-item class="btn">
+                <el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
+        <el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
+        <el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
+      </el-form-item>
+    </el-form>
+    
+    
+  </div>
+</template>
+<script>
+// 数字，邮件，手机，url，身份证校验
+import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
+export default {
+  data() {
+    let self = this
+    var validateIdCard = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!checkIdCard(value)) {
+        callback(new Error("请输入正确的身份证号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateUrl = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isURL(value)) {
+        callback(new Error("请输入正确的URL地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateMobile = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isMobile(value)) {
+        callback(new Error("请输入正确的手机号码"));
+      } else {
+        callback();
+      }
+    };
+    var validatePhone = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isPhone(value)) {
+        callback(new Error("请输入正确的电话号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateEmail = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isEmail(value)) {
+        callback(new Error("请输入正确的邮箱地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isNumber(value)) {
+        callback(new Error("请输入数字"));
+      } else {
+        callback();
+      }
+    };
+    var validateIntNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isIntNumer(value)) {
+        callback(new Error("请输入整数"));
+      } else {
+        callback();
+      }
+    };
+    return {
+	  addEditForm: {"btnSaveFontColor":"#fff","selectFontSize":"14px","btnCancelBorderColor":"rgba(152, 129, 129, 1)","inputBorderRadius":"22px","inputFontSize":"14px","textareaBgColor":"#fff","btnSaveFontSize":"14px","textareaBorderRadius":"22px","uploadBgColor":"#fff","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"#fff","btnSaveBorderRadius":"22px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"rgba(210, 194, 194, 0.29)","dateIconFontSize":"14px","btnSaveBgColor":"#409EFF","uploadIconFontColor":"#8c939d","textareaBorderColor":"rgba(152, 129, 129, 1)","btnCancelBgColor":"rgba(143, 222, 143, 1)","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"22px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"rgba(152, 129, 129, 1)","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"#606266","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"22px","inputBgColor":"rgba(252, 250, 250, 1)","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"22px","btnSaveHeight":"44px","selectBgColor":"#fff","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"rgba(152, 129, 129, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","uploadBorderColor":"rgba(152, 129, 129, 1)","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"22px","selectFontColor":"#606266","btnSaveBorderColor":"#409EFF","btnSaveBorderWidth":"1px"},
+      id: '',
+      type: '',
+      ro:{
+	dingdanbianhao : false,
+	caipinmingcheng : false,
+	caipinfenlei : false,
+	tupian : false,
+	caipinjiage : false,
+	xiadanshuliang : false,
+	zongjine : false,
+	xiadanshijian : false,
+	canzhuohao : false,
+	yonghuming : false,
+	lianxidianhua : false,
+	sfsh : false,
+	shhf : false,
+	ispay : false,
+      },
+            ruleForm: {
+                        dingdanbianhao: this.getUUID(),
+                        	        caipinmingcheng: '',
+	                        	        caipinfenlei: '',
+	                        	        tupian: '',
+	                        	        caipinjiage: '',
+	                        	        xiadanshuliang: '',
+	                        	        zongjine: '',
+	                        	        xiadanshijian: '',
+	                        	        canzhuohao: '',
+	                        	        yonghuming: '',
+	                        	        lianxidianhua: '',
+	                        	                        	        shhf: '',
+	                        	                      },
+                                                                                                                                        canzhuohaoOptions: [],
+                                                                                          rules: {
+                  dingdanbianhao: [
+                                    	                                                              ],
+                  caipinmingcheng: [
+                                    	                                                              ],
+                  caipinfenlei: [
+                                    	                                                              ],
+                  tupian: [
+                                    	                                                              ],
+                  caipinjiage: [
+                                        { validator: validateIntNumber, trigger: 'blur' },
+                        	                                                              ],
+                  xiadanshuliang: [
+                            { required: true, message: '下单数量不能为空', trigger: 'blur' },
+                                        { validator: validateIntNumber, trigger: 'blur' },
+                        	                                                              ],
+                  zongjine: [
+                                    	                                                              ],
+                  xiadanshijian: [
+                            { required: true, message: '下单时间不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  canzhuohao: [
+                                    	                                                              ],
+                  yonghuming: [
+                                    	                                                              ],
+                  lianxidianhua: [
+                                    	                                                              ],
+                  sfsh: [
+                                    	                                                              ],
+                  shhf: [
+                                    	                                                              ],
+                  ispay: [
+                                    	                                                              ],
+              }
+    };
+  },
+  props: ["parent"],
+  computed: {
+                                                                                    zongjine:{
+                                                                                                                                                                                                                                get: function () {
+        return 1*this.ruleForm.caipinjiage*this.ruleForm.xiadanshuliang
+      }
+    },
+                                                                                                  },
+  created() {
+	this.addEditStyleChange()
+	this.addEditUploadStyleChange()
+  },
+  methods: {
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 初始化
+    init(id,type) {
+      if (id) {
+        this.id = id;
+        this.type = type;
+      }
+      if(this.type=='info'||this.type=='else'){
+        this.info(id);
+      }else if(this.type=='cross'){
+        var obj = this.$storage.getObj('crossObj');
+        for (var o in obj){
+          	            if(o=='dingdanbianhao'){
+            this.ruleForm.dingdanbianhao = obj[o];
+	    this.ro.dingdanbianhao = true;
+            continue;
+          }
+	            	            if(o=='caipinmingcheng'){
+            this.ruleForm.caipinmingcheng = obj[o];
+	    this.ro.caipinmingcheng = true;
+            continue;
+          }
+	            	            if(o=='caipinfenlei'){
+            this.ruleForm.caipinfenlei = obj[o];
+	    this.ro.caipinfenlei = true;
+            continue;
+          }
+	            	            if(o=='tupian'){
+            this.ruleForm.tupian = obj[o];
+	    this.ro.tupian = true;
+            continue;
+          }
+	            	            if(o=='caipinjiage'){
+            this.ruleForm.caipinjiage = obj[o];
+	    this.ro.caipinjiage = true;
+            continue;
+          }
+	            	            if(o=='xiadanshuliang'){
+            this.ruleForm.xiadanshuliang = obj[o];
+	    this.ro.xiadanshuliang = true;
+            continue;
+          }
+	            	            if(o=='zongjine'){
+            this.ruleForm.zongjine = obj[o];
+	    this.ro.zongjine = true;
+            continue;
+          }
+	            	            if(o=='xiadanshijian'){
+            this.ruleForm.xiadanshijian = obj[o];
+	    this.ro.xiadanshijian = true;
+            continue;
+          }
+	            	            if(o=='canzhuohao'){
+            this.ruleForm.canzhuohao = obj[o];
+	    this.ro.canzhuohao = true;
+            continue;
+          }
+	            	            if(o=='yonghuming'){
+            this.ruleForm.yonghuming = obj[o];
+	    this.ro.yonghuming = true;
+            continue;
+          }
+	            	            if(o=='lianxidianhua'){
+            this.ruleForm.lianxidianhua = obj[o];
+	    this.ro.lianxidianhua = true;
+            continue;
+          }
+	            	            	            	                    }
+                                                                                                                                                                                                                                              }
+            // 获取用户信息
+      this.$http({
+        url: `${this.$storage.get('sessionTable')}/session`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          var json = data.data;
+                                                                                                                                                                                                                            		if(json.yonghuming!=''&&json.yonghuming){
+              		this.ruleForm.yonghuming = json.yonghuming
+		}
+                                  		if(json.lianxidianhua!=''&&json.lianxidianhua){
+              		this.ruleForm.lianxidianhua = json.lianxidianhua
+		}
+                                                                                                } else {
+          this.$message.error(data.msg);
+        }
+      });
+                                                                                                                                                                                          this.$http({
+              url: `option/canzhuo/canzhuohao`,
+              method: "get"
+            }).then(({ data }) => {
+              if (data && data.code === 0) {
+                this.canzhuohaoOptions = data.data;
+              } else {
+                this.$message.error(data.msg);
+              }
+            });
+         
+                                                                                                                      },
+                                                                                                                        // 多级联动参数
+                                                                                                                                                        info(id) {
+      this.$http({
+        url: `caipindingdan/info/${id}`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+        this.ruleForm = data.data;
+	//解决前台上传图片后台不显示的问题
+	let reg=new RegExp('../../../upload','g')//g代表全部
+        } else {
+          this.$message.error(data.msg);
+        }
+      });
+    },
+        // 提交
+    onSubmit() {
+                  // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+              this.ruleForm.zongjine = this.zongjine
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                                                                                                                                                                                                                                                                                                this.$refs["ruleForm"].validate(valid => {
+        if (valid) {
+          this.$http({
+            url: `caipindingdan/${!this.ruleForm.id ? "save" : "update"}`,
+            method: "post",
+            data: this.ruleForm
+          }).then(({ data }) => {
+            if (data && data.code === 0) {
+              this.$message({
+                message: "操作成功",
+                type: "success",
+                duration: 1500,
+                onClose: () => {
+                  this.parent.showFlag = true;
+                  this.parent.addOrUpdateFlag = false;
+                  this.parent.caipindingdanCrossAddOrUpdateFlag = false;
+                  this.parent.search();
+                  this.parent.contentStyleChange();
+                }
+              });
+            } else {
+              this.$message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    // 获取uuid
+    getUUID () {
+      return new Date().getTime();
+    },
+    // 返回
+    back() {
+      this.parent.showFlag = true;
+      this.parent.addOrUpdateFlag = false;
+      this.parent.caipindingdanCrossAddOrUpdateFlag = false;
+      this.parent.contentStyleChange();
+    },
+                                                            tupianUploadChange(fileUrls) {
+                this.ruleForm.tupian = fileUrls;
+				this.addEditUploadStyleChange()
+            },
+                                                                                                                                    	addEditStyleChange() {
+	  this.$nextTick(()=>{
+	    // input
+	    document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputFontColor
+	      el.style.fontSize = this.addEditForm.inputFontSize
+	      el.style.borderWidth = this.addEditForm.inputBorderWidth
+	      el.style.borderStyle = this.addEditForm.inputBorderStyle
+	      el.style.borderColor = this.addEditForm.inputBorderColor
+	      el.style.borderRadius = this.addEditForm.inputBorderRadius
+	      el.style.backgroundColor = this.addEditForm.inputBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputLableColor
+	      el.style.fontSize = this.addEditForm.inputLableFontSize
+	    })
+	    // select
+	    document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectFontColor
+	      el.style.fontSize = this.addEditForm.selectFontSize
+	      el.style.borderWidth = this.addEditForm.selectBorderWidth
+	      el.style.borderStyle = this.addEditForm.selectBorderStyle
+	      el.style.borderColor = this.addEditForm.selectBorderColor
+	      el.style.borderRadius = this.addEditForm.selectBorderRadius
+	      el.style.backgroundColor = this.addEditForm.selectBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectLableColor
+	      el.style.fontSize = this.addEditForm.selectLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
+	      el.style.color = this.addEditForm.selectIconFontColor
+	      el.style.fontSize = this.addEditForm.selectIconFontSize
+	    })
+	    // date
+	    document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateFontColor
+	      el.style.fontSize = this.addEditForm.dateFontSize
+	      el.style.borderWidth = this.addEditForm.dateBorderWidth
+	      el.style.borderStyle = this.addEditForm.dateBorderStyle
+	      el.style.borderColor = this.addEditForm.dateBorderColor
+	      el.style.borderRadius = this.addEditForm.dateBorderRadius
+	      el.style.backgroundColor = this.addEditForm.dateBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateLableColor
+	      el.style.fontSize = this.addEditForm.dateLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
+	      el.style.color = this.addEditForm.dateIconFontColor
+	      el.style.fontSize = this.addEditForm.dateIconFontSize
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	    })
+	    // upload
+	    let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
+	    document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
+	      el.style.width = this.addEditForm.uploadHeight
+	      el.style.height = this.addEditForm.uploadHeight
+	      el.style.borderWidth = this.addEditForm.uploadBorderWidth
+	      el.style.borderStyle = this.addEditForm.uploadBorderStyle
+	      el.style.borderColor = this.addEditForm.uploadBorderColor
+	      el.style.borderRadius = this.addEditForm.uploadBorderRadius
+	      el.style.backgroundColor = this.addEditForm.uploadBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.uploadHeight
+	      el.style.color = this.addEditForm.uploadLableColor
+	      el.style.fontSize = this.addEditForm.uploadLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
+	      el.style.color = this.addEditForm.uploadIconFontColor
+	      el.style.fontSize = this.addEditForm.uploadIconFontSize
+	      el.style.lineHeight = iconLineHeight
+	      el.style.display = 'block'
+	    })
+	    // 多文本输入框
+	    document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaFontColor
+	      el.style.fontSize = this.addEditForm.textareaFontSize
+	      el.style.borderWidth = this.addEditForm.textareaBorderWidth
+	      el.style.borderStyle = this.addEditForm.textareaBorderStyle
+	      el.style.borderColor = this.addEditForm.textareaBorderColor
+	      el.style.borderRadius = this.addEditForm.textareaBorderRadius
+	      el.style.backgroundColor = this.addEditForm.textareaBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
+	      // el.style.lineHeight = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaLableColor
+	      el.style.fontSize = this.addEditForm.textareaLableFontSize
+	    })
+	    // 保存
+	    document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
+	      el.style.width = this.addEditForm.btnSaveWidth
+	      el.style.height = this.addEditForm.btnSaveHeight
+	      el.style.color = this.addEditForm.btnSaveFontColor
+	      el.style.fontSize = this.addEditForm.btnSaveFontSize
+	      el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
+	      el.style.borderColor = this.addEditForm.btnSaveBorderColor
+	      el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnSaveBgColor
+	    })
+	    // 返回
+	    document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
+	      el.style.width = this.addEditForm.btnCancelWidth
+	      el.style.height = this.addEditForm.btnCancelHeight
+	      el.style.color = this.addEditForm.btnCancelFontColor
+	      el.style.fontSize = this.addEditForm.btnCancelFontSize
+	      el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
+	      el.style.borderColor = this.addEditForm.btnCancelBorderColor
+	      el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnCancelBgColor
+	    })
+	  })
+	},
+	addEditUploadStyleChange() {
+		this.$nextTick(()=>{
+		  document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
+			el.style.width = this.addEditForm.uploadHeight
+			el.style.height = this.addEditForm.uploadHeight
+			el.style.borderWidth = this.addEditForm.uploadBorderWidth
+			el.style.borderStyle = this.addEditForm.uploadBorderStyle
+			el.style.borderColor = this.addEditForm.uploadBorderColor
+			el.style.borderRadius = this.addEditForm.uploadBorderRadius
+			el.style.backgroundColor = this.addEditForm.uploadBgColor
+		  })
+	  })
+	},
+  }
+};
+</script>
+<style lang="scss">
+.editor{
+  height: 500px;
+  
+  & /deep/ .ql-container {
+	  height: 310px;
+  }
+}
+.amap-wrapper {
+  width: 100%;
+  height: 500px;
+}
+.search-box {
+  position: absolute;
+}
+.addEdit-block {
+	margin: -10px;
+}
+.detail-form-content {
+	padding: 12px;
+}
+.btn .el-button {
+  padding: 0;
+}
+</style>

src/views/modules/caipindingdan/list.vue

@@ -0,0 +1,749 @@
+<template>
+  <div class="main-content">
+    <!-- 列表页 -->
+    <div v-if="showFlag">
+      <el-form :inline="true" :model="searchForm" class="form-content">
+        <el-row :gutter="20" class="slt" :style="{justifyContent:contents.searchBoxPosition=='1'?'flex-start':contents.searchBoxPosition=='2'?'center':'flex-end'}">
+                                                                          <el-form-item :label="contents.inputTitle == 1 ? '菜品名称' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.caipinmingcheng" placeholder="菜品名称" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.caipinmingcheng" placeholder="菜品名称" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.caipinmingcheng" placeholder="菜品名称" clearable></el-input>
+                </el-form-item>
+                                                                                                                                                                                                                  <el-form-item :label="contents.inputTitle == 1 ? '餐桌号' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                </el-form-item>
+                                                                              <el-form-item :label="contents.inputTitle == 1 ? '用户名' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.yonghuming" placeholder="用户名" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.yonghuming" placeholder="用户名" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.yonghuming" placeholder="用户名" clearable></el-input>
+                </el-form-item>
+                                                                                                                                      <el-form-item>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 1" icon="el-icon-search" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 2" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}<i class="el-icon-search el-icon--right"/></el-button>
+            <el-button v-if="contents.searchBtnIcon == 0" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+          </el-form-item>
+        </el-row>
+        <el-row class="ad" :style="{justifyContent:contents.btnAdAllBoxPosition=='1'?'flex-start':contents.btnAdAllBoxPosition=='2'?'center':'flex-end'}">
+          <el-form-item>
+            <el-button
+              v-if="isAuth('caipindingdan','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1"
+              type="success"
+              icon="el-icon-plus"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('caipindingdan','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}<i class="el-icon-plus el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('caipindingdan','新增') && contents.btnAdAllIcon == 0"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('caipindingdan','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              icon="el-icon-delete"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+            <el-button
+              v-if="isAuth('caipindingdan','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('caipindingdan','删除') && contents.btnAdAllIcon == 0 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+
+
+                      </el-form-item>
+        </el-row>
+      </el-form>
+      <div class="table-content">
+        <el-table class="tables" :size="contents.tableSize" :show-header="contents.tableShowHeader"
+            :header-row-style="headerRowStyle" :header-cell-style="headerCellStyle"
+            :border="contents.tableBorder"
+            :fit="contents.tableFit"
+            :stripe="contents.tableStripe"
+            :row-style="rowStyle"
+            :cell-style="cellStyle"
+            :style="{width: '100%',fontSize:contents.tableContentFontSize,color:contents.tableContentFontColor}"
+            v-if="isAuth('caipindingdan','查看')"
+            :data="dataList"
+            v-loading="dataListLoading"
+            @selection-change="selectionChangeHandler">
+            <el-table-column  v-if="contents.tableSelection"
+                type="selection"
+                header-align="center"
+                align="center"
+                width="50">
+            </el-table-column>
+            <el-table-column label="索引" v-if="contents.tableIndex" type="index" width="50" />
+            	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="dingdanbianhao"
+                    header-align="center"
+		    label="订单编号">
+		     <template slot-scope="scope">
+                       {{scope.row.dingdanbianhao}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="caipinmingcheng"
+                    header-align="center"
+		    label="菜品名称">
+		     <template slot-scope="scope">
+                       {{scope.row.caipinmingcheng}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="caipinfenlei"
+                    header-align="center"
+		    label="菜品分类">
+		     <template slot-scope="scope">
+                       {{scope.row.caipinfenlei}}
+                     </template>
+                </el-table-column>
+                	                	                                      <el-table-column :sortable="contents.tableSortable" :align="contents.tableAlign" prop="tupian"
+                    header-align="center"
+                    width="200"
+                    label="图片">
+                    <template slot-scope="scope">
+                      <div v-if="scope.row.tupian">
+                        <img :src="scope.row.tupian.split(',')[0]" width="100" height="100">
+                      </div>
+                      <div v-else>无图片</div>
+                    </template>
+                  </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="caipinjiage"
+                    header-align="center"
+		    label="菜品价格">
+		     <template slot-scope="scope">
+                       {{scope.row.caipinjiage}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="xiadanshuliang"
+                    header-align="center"
+		    label="下单数量">
+		     <template slot-scope="scope">
+                       {{scope.row.xiadanshuliang}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="zongjine"
+                    header-align="center"
+		    label="总金额">
+		     <template slot-scope="scope">
+                       {{scope.row.zongjine}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="xiadanshijian"
+                    header-align="center"
+		    label="下单时间">
+		     <template slot-scope="scope">
+                       {{scope.row.xiadanshijian}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="canzhuohao"
+                    header-align="center"
+		    label="餐桌号">
+		     <template slot-scope="scope">
+                       {{scope.row.canzhuohao}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="yonghuming"
+                    header-align="center"
+		    label="用户名">
+		     <template slot-scope="scope">
+                       {{scope.row.yonghuming}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="lianxidianhua"
+                    header-align="center"
+		    label="联系电话">
+		     <template slot-scope="scope">
+                       {{scope.row.lianxidianhua}}
+                     </template>
+                </el-table-column>
+                	                	                                    	                	                                    	                	                                    <el-table-column
+                  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                  prop="ispay"
+                  header-align="center"
+                  label="是否支付">
+                  <template slot-scope="scope">
+                    <span style="margin-right:10px">{{scope.row.ispay=='已支付'?'已支付':'未支付'}}</span>
+                    <el-button v-if="scope.row.ispay!='已支付' && isAuth('caipindingdan','支付') " type="text" icon="el-icon-edit" size="small" @click="payHandler(scope.row)">支付</el-button>
+                  </template>
+                </el-table-column>
+                	                                          <el-table-column :sortable="contents.tableSortable" :align="contents.tableAlign"
+                  prop="shhf"
+                  header-align="center"
+                  label="审核回复">
+              </el-table-column>
+              <el-table-column :sortable="contents.tableSortable" :align="contents.tableAlign"
+                  prop="sfsh"
+                  header-align="center"
+                  label="审核状态">
+                  <template slot-scope="scope">
+                    <span style="margin-right:10px">{{scope.row.sfsh=='是'?'通过':'未通过'}}</span>
+                  </template>
+              </el-table-column>
+              <el-table-column :sortable="contents.tableSortable" :align="contents.tableAlign"
+                  v-if="isAuth('caipindingdan','审核')"
+                  prop="sfsh"
+                  header-align="center"
+                  label="审核">
+                  <template slot-scope="scope">
+                    <el-button  type="text" icon="el-icon-edit" size="small" @click="shDialog(scope.row)">审核</el-button>
+                  </template>
+              </el-table-column>
+                        <el-table-column width="300" :align="contents.tableAlign"
+                header-align="center"
+                label="操作">
+                <template slot-scope="scope">
+                                <el-button v-if="isAuth('caipindingdan','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="success" icon="el-icon-tickets" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                <el-button v-if="isAuth('caipindingdan','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}<i class="el-icon-tickets el-icon--right" /></el-button>
+                <el-button v-if="isAuth('caipindingdan','查看') && contents.tableBtnIcon == 0" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                                                                <el-button v-if="isAuth('caipindingdan','评价') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="success" icon="el-icon-tickets" size="mini" @click="caipinpingjiaCrossAddOrUpdateHandler(scope.row,'cross')">{{ contents.tableBtnFont == 1?'评价':'' }}</el-button>
+                <el-button v-if="isAuth('caipindingdan','评价') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="success" size="mini" @click="caipinpingjiaCrossAddOrUpdateHandler(scope.row,'cross')">{{ contents.tableBtnFont == 1?'评价':'' }}<i class="el-icon-tickets el-icon--right" /></el-button>
+                <el-button v-if="isAuth('caipindingdan','评价') && contents.tableBtnIcon == 0" type="success" size="mini" @click="caipinpingjiaCrossAddOrUpdateHandler(scope.row,'cross')">{{ contents.tableBtnFont == 1?'评价':'' }}</el-button>
+                                                                <el-button v-if="isAuth('caipindingdan','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+                <el-button v-if="isAuth('caipindingdan','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}<i class="el-icon-edit el-icon--right" /></el-button>
+                <el-button v-if="isAuth('caipindingdan','修改') && contents.tableBtnIcon == 0" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+
+
+
+
+                <el-button v-if="isAuth('caipindingdan','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="danger" icon="el-icon-delete" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                <el-button v-if="isAuth('caipindingdan','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+                <el-button v-if="isAuth('caipindingdan','删除') && contents.tableBtnIcon == 0" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+                                                                                                                                                                                                                                                <el-pagination
+          clsss="pages"
+          :layout="layouts"
+          @size-change="sizeChangeHandle"
+          @current-change="currentChangeHandle"
+          :current-page="pageIndex"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="Number(contents.pageEachNum)"
+          :total="totalPage"
+          :small="contents.pageStyle"
+          class="pagination-content"
+          :background="contents.pageBtnBG"
+          :style="{textAlign:contents.pagePosition==1?'left':contents.pagePosition==2?'center':'right'}"
+        ></el-pagination>
+      </div>
+    </div>
+    <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
+    <add-or-update v-if="addOrUpdateFlag" :parent="this" ref="addOrUpdate"></add-or-update>
+
+            <caipinpingjia-cross-add-or-update v-if="caipinpingjiaCrossAddOrUpdateFlag" :parent="this" ref="caipinpingjiaCrossaddOrUpdate"></caipinpingjia-cross-add-or-update>
+        
+        <el-dialog
+      title="审核"
+      :visible.sync="sfshVisiable"
+      width="50%">
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="审核状态">
+          <el-select v-model="shForm.sfsh" placeholder="审核状态">
+            <el-option label="通过" value="是"></el-option>
+            <el-option label="不通过" value="否"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="内容">
+          <el-input type="textarea" :rows="8" v-model="shForm.shhf"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="shDialog">取 消</el-button>
+        <el-button type="primary" @click="shHandler">确 定</el-button>
+      </span>
+    </el-dialog>
+    
+      </div>
+</template>
+<script>
+import AddOrUpdate from "./add-or-update";
+import caipinpingjiaCrossAddOrUpdate from "../caipinpingjia/add-or-update";
+export default {
+  data() {
+    return {
+                                                                                                                                                                                          canzhuohaoOptions: [],
+                                                                                                                              searchForm: {
+        key: ""
+      },
+      form:{},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      showFlag: true,
+      sfshVisiable: false,
+      shForm: {},
+      chartVisiable: false,
+      addOrUpdateFlag:false,
+                  caipinpingjiaCrossAddOrUpdateFlag: false,
+                  contents:{"searchBtnFontColor":"#333","pagePosition":"1","inputFontSize":"14px","inputBorderRadius":"22px","tableBtnDelFontColor":"#333","tableBtnIconPosition":"1","searchBtnHeight":"40px","inputIconColor":"rgba(66, 130, 129, 1)","searchBtnBorderRadius":"22px","tableStripe":false,"btnAdAllWarnFontColor":"#333","tableBtnDelBgColor":"rgba(244, 150, 150, 1)","searchBtnIcon":"1","tableSize":"medium","searchBtnBorderStyle":"solid","tableSelection":true,"searchBtnBorderWidth":"1px","tableContentFontSize":"14px","searchBtnBgColor":"rgba(153, 239, 237, 1)","inputTitleSize":"14px","btnAdAllBorderColor":"#DCDFE6","pageJumper":true,"btnAdAllIconPosition":"1","searchBoxPosition":"1","tableBtnDetailFontColor":"#333","tableBtnHeight":"40px","pagePager":true,"searchBtnBorderColor":"#DCDFE6","tableHeaderFontColor":"rgba(33, 34, 35, 1)","inputTitle":"1","tableBtnBorderRadius":"22px","btnAdAllFont":"1","btnAdAllDelFontColor":"rgba(21, 20, 20, 1)","tableBtnIcon":"1","btnAdAllHeight":"40px","btnAdAllWarnBgColor":"rgba(238, 236, 126, 1)","btnAdAllBorderWidth":"1px","tableStripeFontColor":"#606266","tableBtnBorderStyle":"solid","inputHeight":"40px","btnAdAllBorderRadius":"22px","btnAdAllDelBgColor":"rgba(234, 93, 93, 0.69)","pagePrevNext":true,"btnAdAllAddBgColor":"rgba(153, 239, 237, 1)","searchBtnFont":"1","tableIndex":true,"btnAdAllIcon":"1","tableSortable":true,"pageSizes":true,"tableFit":true,"pageBtnBG":true,"searchBtnFontSize":"14px","tableBtnEditBgColor":"rgba(240, 242, 124, 1)","inputBorderWidth":"1px","inputFontPosition":"1","inputFontColor":"#333","pageEachNum":10,"tableHeaderBgColor":"rgba(152, 129, 129, 1)","inputTitleColor":"#333","btnAdAllBoxPosition":"1","tableBtnDetailBgColor":"rgba(171, 239, 239, 1)","inputIcon":"0","searchBtnIconPosition":"1","btnAdAllFontSize":"14px","inputBorderStyle":"solid","inputBgColor":"rgba(197, 174, 174, 0.32)","pageStyle":false,"pageTotal":true,"btnAdAllAddFontColor":"#333","tableBtnFont":"1","tableContentFontColor":"rgba(22, 22, 23, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","tableShowHeader":true,"tableBtnFontSize":"14px","tableBtnBorderColor":"rgba(196, 210, 244, 1)","inputIconPosition":"1","tableBorder":true,"btnAdAllBorderStyle":"solid","tableBtnBorderWidth":"1px","tableStripeBgColor":"rgba(213, 197, 197, 1)","tableBtnEditFontColor":"#333","tableAlign":"center"},
+      layouts: '',
+
+
+    };
+  },
+  created() {
+    this.init();
+    this.getDataList();
+    this.contentStyleChange()
+  },
+  mounted() {
+
+  },
+  filters: {
+    htmlfilter: function (val) {
+      return val.replace(/<[^>]*>/g).replace(/undefined/g,'');
+    }
+  },
+  components: {
+    AddOrUpdate,
+            caipinpingjiaCrossAddOrUpdate,
+          },
+  methods: {
+    contentStyleChange() {
+      this.contentSearchStyleChange()
+      this.contentBtnAdAllStyleChange()
+      this.contentSearchBtnStyleChange()
+      this.contentTableBtnStyleChange()
+      this.contentPageStyleChange()
+    },
+    contentSearchStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-input__inner').forEach(el=>{
+          let textAlign = 'left'
+          if(this.contents.inputFontPosition == 2) textAlign = 'center'
+          if(this.contents.inputFontPosition == 3) textAlign = 'right'
+          el.style.textAlign = textAlign
+          el.style.height = this.contents.inputHeight
+          el.style.lineHeight = this.contents.inputHeight
+          el.style.color = this.contents.inputFontColor
+          el.style.fontSize = this.contents.inputFontSize
+          el.style.borderWidth = this.contents.inputBorderWidth
+          el.style.borderStyle = this.contents.inputBorderStyle
+          el.style.borderColor = this.contents.inputBorderColor
+          el.style.borderRadius = this.contents.inputBorderRadius
+          el.style.backgroundColor = this.contents.inputBgColor
+        })
+        if(this.contents.inputTitle) {
+          document.querySelectorAll('.form-content .slt .el-form-item__label').forEach(el=>{
+            el.style.color = this.contents.inputTitleColor
+            el.style.fontSize = this.contents.inputTitleSize
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        }
+        setTimeout(()=>{
+          document.querySelectorAll('.form-content .slt .el-input__prefix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__suffix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__icon').forEach(el=>{
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        },10)
+
+      })
+    },
+    // 搜索按钮
+    contentSearchBtnStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-button--success').forEach(el=>{
+          el.style.height = this.contents.searchBtnHeight
+          el.style.color = this.contents.searchBtnFontColor
+          el.style.fontSize = this.contents.searchBtnFontSize
+          el.style.borderWidth = this.contents.searchBtnBorderWidth
+          el.style.borderStyle = this.contents.searchBtnBorderStyle
+          el.style.borderColor = this.contents.searchBtnBorderColor
+          el.style.borderRadius = this.contents.searchBtnBorderRadius
+          el.style.backgroundColor = this.contents.searchBtnBgColor
+        })
+      })
+    },
+    // 新增、批量删除
+    contentBtnAdAllStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .ad .el-button--success').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllAddFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllAddBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--danger').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllDelFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllDelBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--warning').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllWarnFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllWarnBgColor
+        })
+      })
+    },
+    // 表格
+    rowStyle({ row, rowIndex}) {
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {color:this.contents.tableStripeFontColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    cellStyle({ row, rowIndex}){
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {backgroundColor:this.contents.tableStripeBgColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    headerRowStyle({ row, rowIndex}){
+      return {color: this.contents.tableHeaderFontColor}
+    },
+    headerCellStyle({ row, rowIndex}){
+      return {backgroundColor: this.contents.tableHeaderBgColor}
+    },
+    // 表格按钮
+    contentTableBtnStyleChange(){
+      // this.$nextTick(()=>{
+      //   setTimeout(()=>{
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--success').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDetailFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDetailBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--primary').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnEditFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnEditBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--danger').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDelFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDelBgColor
+      //     })
+
+      //   }, 50)
+      // })
+    },
+    // 分页
+    contentPageStyleChange(){
+      let arr = []
+
+      if(this.contents.pageTotal) arr.push('total')
+      if(this.contents.pageSizes) arr.push('sizes')
+      if(this.contents.pagePrevNext){
+        arr.push('prev')
+        if(this.contents.pagePager) arr.push('pager')
+        arr.push('next')
+      }
+      if(this.contents.pageJumper) arr.push('jumper')
+      this.layouts = arr.join()
+      this.contents.pageEachNum = 10
+    },
+
+            caipinpingjiaCrossAddOrUpdateHandler(row,type){
+      this.showFlag = false;
+      this.addOrUpdateFlag = false;
+      this.caipinpingjiaCrossAddOrUpdateFlag = true;
+      this.$storage.set('crossObj',row);
+      this.$storage.set('crossTable','caipindingdan');
+      this.$nextTick(() => {
+        this.$refs.caipinpingjiaCrossaddOrUpdate.init(row.id,type);
+      });
+    },
+                payHandler(row){
+      this.$storage.set('paytable','caipindingdan');
+      this.$storage.set('payObject',row);
+      this.$router.push('pay');
+    },
+            init () {
+                                                                                                                                            this.$http({
+            url: `option/canzhuo/canzhuohao`,
+            method: "get"
+          }).then(({ data }) => {
+            if (data && data.code === 0) {
+              this.canzhuohaoOptions = data.data;
+            } else {
+              this.$message.error(data.msg);
+            }
+          });
+                                                                                                                                                                                                                                                                                                            },
+    search() {
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      let params = {
+        page: this.pageIndex,
+        limit: this.pageSize,
+        sort: 'id',
+      }
+                                                                if(this.searchForm.caipinmingcheng!='' && this.searchForm.caipinmingcheng!=undefined){
+            params['caipinmingcheng'] = '%' + this.searchForm.caipinmingcheng + '%'
+          }
+                                                                                                                                                                                                if(this.searchForm.canzhuohao!='' && this.searchForm.canzhuohao!=undefined){
+            params['canzhuohao'] = '%' + this.searchForm.canzhuohao + '%'
+          }
+                                                            if(this.searchForm.yonghuming!='' && this.searchForm.yonghuming!=undefined){
+            params['yonghuming'] = '%' + this.searchForm.yonghuming + '%'
+          }
+                                                                                                                      this.$http({
+        url: "caipindingdan/page",
+        method: "get",
+        params: params
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.dataList = data.data.list;
+          this.totalPage = data.data.total;
+        } else {
+          this.dataList = [];
+          this.totalPage = 0;
+        }
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val;
+      this.getDataList();
+    },
+    // 多选
+    selectionChangeHandler(val) {
+      this.dataListSelections = val;
+    },
+    // 添加/修改
+    addOrUpdateHandler(id,type) {
+      this.showFlag = false;
+      this.addOrUpdateFlag = true;
+      this.crossAddOrUpdateFlag = false;
+      if(type!='info'){
+        type = 'else';
+      }
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id,type);
+      });
+    },
+    // 查看评论
+        // 审核窗口
+    shDialog(row){
+      this.sfshVisiable = !this.sfshVisiable;
+      if(row){
+        this.shForm = {
+                    dingdanbianhao: row.dingdanbianhao,
+                    caipinmingcheng: row.caipinmingcheng,
+                    caipinfenlei: row.caipinfenlei,
+                    tupian: row.tupian,
+                    caipinjiage: row.caipinjiage,
+                    xiadanshuliang: row.xiadanshuliang,
+                    zongjine: row.zongjine,
+                    xiadanshijian: row.xiadanshijian,
+                    canzhuohao: row.canzhuohao,
+                    yonghuming: row.yonghuming,
+                    lianxidianhua: row.lianxidianhua,
+                    sfsh: row.sfsh,
+                    shhf: row.shhf,
+                    ispay: row.ispay,
+                    id: row.id
+        }
+      }
+    },
+    // 审核
+    shHandler(){
+      this.$confirm(`确定操作?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.$http({
+          url: "caipindingdan/update",
+          method: "post",
+          data: this.shForm
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.getDataList();
+                this.shDialog()
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    },
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 删除
+    deleteHandler(id) {
+      var ids = id
+        ? [Number(id)]
+        : this.dataListSelections.map(item => {
+            return Number(item.id);
+          });
+      this.$confirm(`确定进行[${id ? "删除" : "批量删除"}]操作?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.$http({
+          url: "caipindingdan/delete",
+          method: "post",
+          data: ids
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.search();
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    },
+  }
+
+};
+</script>
+<style lang="scss" scoped>
+  .slt {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .ad {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .pages {
+    & /deep/ el-pagination__sizes{
+      & /deep/ el-input__inner {
+        height: 22px;
+        line-height: 22px;
+      }
+    }
+  }
+  
+
+  .el-button+.el-button {
+    margin:0;
+  } 
+
+  .tables {
+	& /deep/ .el-button--success {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(171, 239, 239, 1);
+	}
+	
+	& /deep/ .el-button--primary {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(240, 242, 124, 1);
+	}
+	
+	& /deep/ .el-button--danger {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(244, 150, 150, 1);
+	}
+
+    & /deep/ .el-button {
+      margin: 4px;
+    }
+  }
+
+</style>

src/views/modules/canzhuo/add-or-update.vue

@@ -0,0 +1,427 @@
+<template>
+  <div class="addEdit-block">
+    <el-form
+      class="detail-form-content"
+      ref="ruleForm"
+      :model="ruleForm"
+      :rules="rules"
+      label-width="80px"
+	  :style="{backgroundColor:addEditForm.addEditBoxColor}"
+    >
+      <el-row>
+                        <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="餐桌号" prop="canzhuohao">
+          <el-input v-model="ruleForm.canzhuohao" 
+              placeholder="餐桌号" clearable  :readonly="ro.canzhuohao"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="餐桌号" prop="canzhuohao">
+              <el-input v-model="ruleForm.canzhuohao" 
+                placeholder="餐桌号" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="位置" prop="weizhi">
+          <el-input v-model="ruleForm.weizhi" 
+              placeholder="位置" clearable  :readonly="ro.weizhi"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="位置" prop="weizhi">
+              <el-input v-model="ruleForm.weizhi" 
+                placeholder="位置" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                                    <el-col :span="12">
+        <el-form-item class="input" v-if="type!='info'"  label="座位数" prop="zuoweishu">
+          <el-input v-model="ruleForm.zuoweishu" 
+              placeholder="座位数" clearable  :readonly="ro.zuoweishu"></el-input>
+        </el-form-item>
+        <div v-else>
+          <el-form-item class="input" label="座位数" prop="zuoweishu">
+              <el-input v-model="ruleForm.zuoweishu" 
+                placeholder="座位数" readonly></el-input>
+          </el-form-item>
+        </div>
+      </el-col>
+                              </el-row>
+                                                                                                      <el-form-item class="btn">
+                <el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
+        <el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
+        <el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
+      </el-form-item>
+    </el-form>
+    
+    
+  </div>
+</template>
+<script>
+// 数字，邮件，手机，url，身份证校验
+import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
+export default {
+  data() {
+    let self = this
+    var validateIdCard = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!checkIdCard(value)) {
+        callback(new Error("请输入正确的身份证号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateUrl = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isURL(value)) {
+        callback(new Error("请输入正确的URL地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateMobile = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isMobile(value)) {
+        callback(new Error("请输入正确的手机号码"));
+      } else {
+        callback();
+      }
+    };
+    var validatePhone = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isPhone(value)) {
+        callback(new Error("请输入正确的电话号码"));
+      } else {
+        callback();
+      }
+    };
+    var validateEmail = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isEmail(value)) {
+        callback(new Error("请输入正确的邮箱地址"));
+      } else {
+        callback();
+      }
+    };
+    var validateNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isNumber(value)) {
+        callback(new Error("请输入数字"));
+      } else {
+        callback();
+      }
+    };
+    var validateIntNumber = (rule, value, callback) => {
+      if(!value){
+        callback();
+      } else if (!isIntNumer(value)) {
+        callback(new Error("请输入整数"));
+      } else {
+        callback();
+      }
+    };
+    return {
+	  addEditForm: {"btnSaveFontColor":"#fff","selectFontSize":"14px","btnCancelBorderColor":"rgba(152, 129, 129, 1)","inputBorderRadius":"22px","inputFontSize":"14px","textareaBgColor":"#fff","btnSaveFontSize":"14px","textareaBorderRadius":"22px","uploadBgColor":"#fff","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"#fff","btnSaveBorderRadius":"22px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"rgba(210, 194, 194, 0.29)","dateIconFontSize":"14px","btnSaveBgColor":"#409EFF","uploadIconFontColor":"#8c939d","textareaBorderColor":"rgba(152, 129, 129, 1)","btnCancelBgColor":"rgba(143, 222, 143, 1)","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"22px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"rgba(152, 129, 129, 1)","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"#606266","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"22px","inputBgColor":"rgba(252, 250, 250, 1)","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"22px","btnSaveHeight":"44px","selectBgColor":"#fff","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"rgba(152, 129, 129, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","uploadBorderColor":"rgba(152, 129, 129, 1)","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"22px","selectFontColor":"#606266","btnSaveBorderColor":"#409EFF","btnSaveBorderWidth":"1px"},
+      id: '',
+      type: '',
+      ro:{
+	canzhuohao : false,
+	weizhi : false,
+	zuoweishu : false,
+      },
+            ruleForm: {
+                	        canzhuohao: '',
+	                        	        weizhi: '',
+	                        	        zuoweishu: '',
+	                      },
+                                                      rules: {
+                  canzhuohao: [
+                            { required: true, message: '餐桌号不能为空', trigger: 'blur' },
+                                    	                                                              ],
+                  weizhi: [
+                                    	                                                              ],
+                  zuoweishu: [
+                                        { validator: validateIntNumber, trigger: 'blur' },
+                        	                                                              ],
+              }
+    };
+  },
+  props: ["parent"],
+  computed: {
+                                          },
+  created() {
+	this.addEditStyleChange()
+	this.addEditUploadStyleChange()
+  },
+  methods: {
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 初始化
+    init(id,type) {
+      if (id) {
+        this.id = id;
+        this.type = type;
+      }
+      if(this.type=='info'||this.type=='else'){
+        this.info(id);
+      }else if(this.type=='cross'){
+        var obj = this.$storage.getObj('crossObj');
+        for (var o in obj){
+          	            if(o=='canzhuohao'){
+            this.ruleForm.canzhuohao = obj[o];
+	    this.ro.canzhuohao = true;
+            continue;
+          }
+	            	            if(o=='weizhi'){
+            this.ruleForm.weizhi = obj[o];
+	    this.ro.weizhi = true;
+            continue;
+          }
+	            	            if(o=='zuoweishu'){
+            this.ruleForm.zuoweishu = obj[o];
+	    this.ro.zuoweishu = true;
+            continue;
+          }
+	                    }
+                                                              }
+            // 获取用户信息
+      this.$http({
+        url: `${this.$storage.get('sessionTable')}/session`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          var json = data.data;
+                                                                                    } else {
+          this.$message.error(data.msg);
+        }
+      });
+                                                                                    },
+                                // 多级联动参数
+                                          info(id) {
+      this.$http({
+        url: `canzhuo/info/${id}`,
+        method: "get"
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+        this.ruleForm = data.data;
+	//解决前台上传图片后台不显示的问题
+	let reg=new RegExp('../../../upload','g')//g代表全部
+        } else {
+          this.$message.error(data.msg);
+        }
+      });
+    },
+        // 提交
+    onSubmit() {
+                  // ${column.compare}
+                              // ${column.compare}
+                              // ${column.compare}
+                                                                                          this.$refs["ruleForm"].validate(valid => {
+        if (valid) {
+          this.$http({
+            url: `canzhuo/${!this.ruleForm.id ? "save" : "update"}`,
+            method: "post",
+            data: this.ruleForm
+          }).then(({ data }) => {
+            if (data && data.code === 0) {
+              this.$message({
+                message: "操作成功",
+                type: "success",
+                duration: 1500,
+                onClose: () => {
+                  this.parent.showFlag = true;
+                  this.parent.addOrUpdateFlag = false;
+                  this.parent.canzhuoCrossAddOrUpdateFlag = false;
+                  this.parent.search();
+                  this.parent.contentStyleChange();
+                }
+              });
+            } else {
+              this.$message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    // 获取uuid
+    getUUID () {
+      return new Date().getTime();
+    },
+    // 返回
+    back() {
+      this.parent.showFlag = true;
+      this.parent.addOrUpdateFlag = false;
+      this.parent.canzhuoCrossAddOrUpdateFlag = false;
+      this.parent.contentStyleChange();
+    },
+                                        	addEditStyleChange() {
+	  this.$nextTick(()=>{
+	    // input
+	    document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputFontColor
+	      el.style.fontSize = this.addEditForm.inputFontSize
+	      el.style.borderWidth = this.addEditForm.inputBorderWidth
+	      el.style.borderStyle = this.addEditForm.inputBorderStyle
+	      el.style.borderColor = this.addEditForm.inputBorderColor
+	      el.style.borderRadius = this.addEditForm.inputBorderRadius
+	      el.style.backgroundColor = this.addEditForm.inputBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.inputHeight
+	      el.style.color = this.addEditForm.inputLableColor
+	      el.style.fontSize = this.addEditForm.inputLableFontSize
+	    })
+	    // select
+	    document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectFontColor
+	      el.style.fontSize = this.addEditForm.selectFontSize
+	      el.style.borderWidth = this.addEditForm.selectBorderWidth
+	      el.style.borderStyle = this.addEditForm.selectBorderStyle
+	      el.style.borderColor = this.addEditForm.selectBorderColor
+	      el.style.borderRadius = this.addEditForm.selectBorderRadius
+	      el.style.backgroundColor = this.addEditForm.selectBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.selectHeight
+	      el.style.color = this.addEditForm.selectLableColor
+	      el.style.fontSize = this.addEditForm.selectLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
+	      el.style.color = this.addEditForm.selectIconFontColor
+	      el.style.fontSize = this.addEditForm.selectIconFontSize
+	    })
+	    // date
+	    document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateFontColor
+	      el.style.fontSize = this.addEditForm.dateFontSize
+	      el.style.borderWidth = this.addEditForm.dateBorderWidth
+	      el.style.borderStyle = this.addEditForm.dateBorderStyle
+	      el.style.borderColor = this.addEditForm.dateBorderColor
+	      el.style.borderRadius = this.addEditForm.dateBorderRadius
+	      el.style.backgroundColor = this.addEditForm.dateBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	      el.style.color = this.addEditForm.dateLableColor
+	      el.style.fontSize = this.addEditForm.dateLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
+	      el.style.color = this.addEditForm.dateIconFontColor
+	      el.style.fontSize = this.addEditForm.dateIconFontSize
+	      el.style.lineHeight = this.addEditForm.dateHeight
+	    })
+	    // upload
+	    let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
+	    document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
+	      el.style.width = this.addEditForm.uploadHeight
+	      el.style.height = this.addEditForm.uploadHeight
+	      el.style.borderWidth = this.addEditForm.uploadBorderWidth
+	      el.style.borderStyle = this.addEditForm.uploadBorderStyle
+	      el.style.borderColor = this.addEditForm.uploadBorderColor
+	      el.style.borderRadius = this.addEditForm.uploadBorderRadius
+	      el.style.backgroundColor = this.addEditForm.uploadBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
+	      el.style.lineHeight = this.addEditForm.uploadHeight
+	      el.style.color = this.addEditForm.uploadLableColor
+	      el.style.fontSize = this.addEditForm.uploadLableFontSize
+	    })
+	    document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
+	      el.style.color = this.addEditForm.uploadIconFontColor
+	      el.style.fontSize = this.addEditForm.uploadIconFontSize
+	      el.style.lineHeight = iconLineHeight
+	      el.style.display = 'block'
+	    })
+	    // 多文本输入框
+	    document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
+	      el.style.height = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaFontColor
+	      el.style.fontSize = this.addEditForm.textareaFontSize
+	      el.style.borderWidth = this.addEditForm.textareaBorderWidth
+	      el.style.borderStyle = this.addEditForm.textareaBorderStyle
+	      el.style.borderColor = this.addEditForm.textareaBorderColor
+	      el.style.borderRadius = this.addEditForm.textareaBorderRadius
+	      el.style.backgroundColor = this.addEditForm.textareaBgColor
+	    })
+	    document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
+	      // el.style.lineHeight = this.addEditForm.textareaHeight
+	      el.style.color = this.addEditForm.textareaLableColor
+	      el.style.fontSize = this.addEditForm.textareaLableFontSize
+	    })
+	    // 保存
+	    document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
+	      el.style.width = this.addEditForm.btnSaveWidth
+	      el.style.height = this.addEditForm.btnSaveHeight
+	      el.style.color = this.addEditForm.btnSaveFontColor
+	      el.style.fontSize = this.addEditForm.btnSaveFontSize
+	      el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
+	      el.style.borderColor = this.addEditForm.btnSaveBorderColor
+	      el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnSaveBgColor
+	    })
+	    // 返回
+	    document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
+	      el.style.width = this.addEditForm.btnCancelWidth
+	      el.style.height = this.addEditForm.btnCancelHeight
+	      el.style.color = this.addEditForm.btnCancelFontColor
+	      el.style.fontSize = this.addEditForm.btnCancelFontSize
+	      el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
+	      el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
+	      el.style.borderColor = this.addEditForm.btnCancelBorderColor
+	      el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
+	      el.style.backgroundColor = this.addEditForm.btnCancelBgColor
+	    })
+	  })
+	},
+	addEditUploadStyleChange() {
+		this.$nextTick(()=>{
+		  document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
+			el.style.width = this.addEditForm.uploadHeight
+			el.style.height = this.addEditForm.uploadHeight
+			el.style.borderWidth = this.addEditForm.uploadBorderWidth
+			el.style.borderStyle = this.addEditForm.uploadBorderStyle
+			el.style.borderColor = this.addEditForm.uploadBorderColor
+			el.style.borderRadius = this.addEditForm.uploadBorderRadius
+			el.style.backgroundColor = this.addEditForm.uploadBgColor
+		  })
+	  })
+	},
+  }
+};
+</script>
+<style lang="scss">
+.editor{
+  height: 500px;
+  
+  & /deep/ .ql-container {
+	  height: 310px;
+  }
+}
+.amap-wrapper {
+  width: 100%;
+  height: 500px;
+}
+.search-box {
+  position: absolute;
+}
+.addEdit-block {
+	margin: -10px;
+}
+.detail-form-content {
+	padding: 12px;
+}
+.btn .el-button {
+  padding: 0;
+}
+</style>

src/views/modules/canzhuo/list.vue

@@ -0,0 +1,530 @@
+<template>
+  <div class="main-content">
+    <!-- 列表页 -->
+    <div v-if="showFlag">
+      <el-form :inline="true" :model="searchForm" class="form-content">
+        <el-row :gutter="20" class="slt" :style="{justifyContent:contents.searchBoxPosition=='1'?'flex-start':contents.searchBoxPosition=='2'?'center':'flex-end'}">
+                                                    <el-form-item :label="contents.inputTitle == 1 ? '餐桌号' : ''">
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 1" prefix-icon="el-icon-search" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 1 && contents.inputIconPosition == 2" suffix-icon="el-icon-search" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                  <el-input v-if="contents.inputIcon == 0" v-model="searchForm.canzhuohao" placeholder="餐桌号" clearable></el-input>
+                </el-form-item>
+                                                                                          <el-form-item>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 1" icon="el-icon-search" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+            <el-button v-if="contents.searchBtnIcon == 1 && contents.searchBtnIconPosition == 2" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}<i class="el-icon-search el-icon--right"/></el-button>
+            <el-button v-if="contents.searchBtnIcon == 0" type="success" @click="search()">{{ contents.searchBtnFont == 1?'查询':'' }}</el-button>
+          </el-form-item>
+        </el-row>
+        <el-row class="ad" :style="{justifyContent:contents.btnAdAllBoxPosition=='1'?'flex-start':contents.btnAdAllBoxPosition=='2'?'center':'flex-end'}">
+          <el-form-item>
+            <el-button
+              v-if="isAuth('canzhuo','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1"
+              type="success"
+              icon="el-icon-plus"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('canzhuo','新增') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}<i class="el-icon-plus el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('canzhuo','新增') && contents.btnAdAllIcon == 0"
+              type="success"
+              @click="addOrUpdateHandler()"
+            >{{ contents.btnAdAllFont == 1?'新增':'' }}</el-button>
+            <el-button
+              v-if="isAuth('canzhuo','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 1 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              icon="el-icon-delete"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+            <el-button
+              v-if="isAuth('canzhuo','删除') && contents.btnAdAllIcon == 1 && contents.btnAdAllIconPosition == 2 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+            <el-button
+              v-if="isAuth('canzhuo','删除') && contents.btnAdAllIcon == 0 && contents.tableSelection"
+              :disabled="dataListSelections.length <= 0"
+              type="danger"
+              @click="deleteHandler()"
+            >{{ contents.btnAdAllFont == 1?'删除':'' }}</el-button>
+
+
+                      </el-form-item>
+        </el-row>
+      </el-form>
+      <div class="table-content">
+        <el-table class="tables" :size="contents.tableSize" :show-header="contents.tableShowHeader"
+            :header-row-style="headerRowStyle" :header-cell-style="headerCellStyle"
+            :border="contents.tableBorder"
+            :fit="contents.tableFit"
+            :stripe="contents.tableStripe"
+            :row-style="rowStyle"
+            :cell-style="cellStyle"
+            :style="{width: '100%',fontSize:contents.tableContentFontSize,color:contents.tableContentFontColor}"
+            v-if="isAuth('canzhuo','查看')"
+            :data="dataList"
+            v-loading="dataListLoading"
+            @selection-change="selectionChangeHandler">
+            <el-table-column  v-if="contents.tableSelection"
+                type="selection"
+                header-align="center"
+                align="center"
+                width="50">
+            </el-table-column>
+            <el-table-column label="索引" v-if="contents.tableIndex" type="index" width="50" />
+            	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="canzhuohao"
+                    header-align="center"
+		    label="餐桌号">
+		     <template slot-scope="scope">
+                       {{scope.row.canzhuohao}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="weizhi"
+                    header-align="center"
+		    label="位置">
+		     <template slot-scope="scope">
+                       {{scope.row.weizhi}}
+                     </template>
+                </el-table-column>
+                	                	                                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
+                    prop="zuoweishu"
+                    header-align="center"
+		    label="座位数">
+		     <template slot-scope="scope">
+                       {{scope.row.zuoweishu}}
+                     </template>
+                </el-table-column>
+                	                                        <el-table-column width="300" :align="contents.tableAlign"
+                header-align="center"
+                label="操作">
+                <template slot-scope="scope">
+                                <el-button v-if="isAuth('canzhuo','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="success" icon="el-icon-tickets" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                <el-button v-if="isAuth('canzhuo','查看') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}<i class="el-icon-tickets el-icon--right" /></el-button>
+                <el-button v-if="isAuth('canzhuo','查看') && contents.tableBtnIcon == 0" type="success" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">{{ contents.tableBtnFont == 1?'详情':'' }}</el-button>
+                                                <el-button v-if="isAuth('canzhuo','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+                <el-button v-if="isAuth('canzhuo','修改') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}<i class="el-icon-edit el-icon--right" /></el-button>
+                <el-button v-if="isAuth('canzhuo','修改') && contents.tableBtnIcon == 0" type="primary" size="mini" @click="addOrUpdateHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'修改':'' }}</el-button>
+
+
+
+
+                <el-button v-if="isAuth('canzhuo','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 1" type="danger" icon="el-icon-delete" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                <el-button v-if="isAuth('canzhuo','删除') && contents.tableBtnIcon == 1 && contents.tableBtnIconPosition == 2" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}<i class="el-icon-delete el-icon--right" /></el-button>
+                <el-button v-if="isAuth('canzhuo','删除') && contents.tableBtnIcon == 0" type="danger" size="mini" @click="deleteHandler(scope.row.id)">{{ contents.tableBtnFont == 1?'删除':'' }}</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+                                                                <el-pagination
+          clsss="pages"
+          :layout="layouts"
+          @size-change="sizeChangeHandle"
+          @current-change="currentChangeHandle"
+          :current-page="pageIndex"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="Number(contents.pageEachNum)"
+          :total="totalPage"
+          :small="contents.pageStyle"
+          class="pagination-content"
+          :background="contents.pageBtnBG"
+          :style="{textAlign:contents.pagePosition==1?'left':contents.pagePosition==2?'center':'right'}"
+        ></el-pagination>
+      </div>
+    </div>
+    <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
+    <add-or-update v-if="addOrUpdateFlag" :parent="this" ref="addOrUpdate"></add-or-update>
+
+    
+    
+      </div>
+</template>
+<script>
+import AddOrUpdate from "./add-or-update";
+export default {
+  data() {
+    return {
+                                                                              searchForm: {
+        key: ""
+      },
+      form:{},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      showFlag: true,
+      sfshVisiable: false,
+      shForm: {},
+      chartVisiable: false,
+      addOrUpdateFlag:false,
+            contents:{"searchBtnFontColor":"#333","pagePosition":"1","inputFontSize":"14px","inputBorderRadius":"22px","tableBtnDelFontColor":"#333","tableBtnIconPosition":"1","searchBtnHeight":"40px","inputIconColor":"rgba(66, 130, 129, 1)","searchBtnBorderRadius":"22px","tableStripe":false,"btnAdAllWarnFontColor":"#333","tableBtnDelBgColor":"rgba(244, 150, 150, 1)","searchBtnIcon":"1","tableSize":"medium","searchBtnBorderStyle":"solid","tableSelection":true,"searchBtnBorderWidth":"1px","tableContentFontSize":"14px","searchBtnBgColor":"rgba(153, 239, 237, 1)","inputTitleSize":"14px","btnAdAllBorderColor":"#DCDFE6","pageJumper":true,"btnAdAllIconPosition":"1","searchBoxPosition":"1","tableBtnDetailFontColor":"#333","tableBtnHeight":"40px","pagePager":true,"searchBtnBorderColor":"#DCDFE6","tableHeaderFontColor":"rgba(33, 34, 35, 1)","inputTitle":"1","tableBtnBorderRadius":"22px","btnAdAllFont":"1","btnAdAllDelFontColor":"rgba(21, 20, 20, 1)","tableBtnIcon":"1","btnAdAllHeight":"40px","btnAdAllWarnBgColor":"rgba(238, 236, 126, 1)","btnAdAllBorderWidth":"1px","tableStripeFontColor":"#606266","tableBtnBorderStyle":"solid","inputHeight":"40px","btnAdAllBorderRadius":"22px","btnAdAllDelBgColor":"rgba(234, 93, 93, 0.69)","pagePrevNext":true,"btnAdAllAddBgColor":"rgba(153, 239, 237, 1)","searchBtnFont":"1","tableIndex":true,"btnAdAllIcon":"1","tableSortable":true,"pageSizes":true,"tableFit":true,"pageBtnBG":true,"searchBtnFontSize":"14px","tableBtnEditBgColor":"rgba(240, 242, 124, 1)","inputBorderWidth":"1px","inputFontPosition":"1","inputFontColor":"#333","pageEachNum":10,"tableHeaderBgColor":"rgba(152, 129, 129, 1)","inputTitleColor":"#333","btnAdAllBoxPosition":"1","tableBtnDetailBgColor":"rgba(171, 239, 239, 1)","inputIcon":"0","searchBtnIconPosition":"1","btnAdAllFontSize":"14px","inputBorderStyle":"solid","inputBgColor":"rgba(197, 174, 174, 0.32)","pageStyle":false,"pageTotal":true,"btnAdAllAddFontColor":"#333","tableBtnFont":"1","tableContentFontColor":"rgba(22, 22, 23, 1)","inputBorderColor":"rgba(152, 129, 129, 1)","tableShowHeader":true,"tableBtnFontSize":"14px","tableBtnBorderColor":"rgba(196, 210, 244, 1)","inputIconPosition":"1","tableBorder":true,"btnAdAllBorderStyle":"solid","tableBtnBorderWidth":"1px","tableStripeBgColor":"rgba(213, 197, 197, 1)","tableBtnEditFontColor":"#333","tableAlign":"center"},
+      layouts: '',
+
+
+    };
+  },
+  created() {
+    this.init();
+    this.getDataList();
+    this.contentStyleChange()
+  },
+  mounted() {
+
+  },
+  filters: {
+    htmlfilter: function (val) {
+      return val.replace(/<[^>]*>/g).replace(/undefined/g,'');
+    }
+  },
+  components: {
+    AddOrUpdate,
+      },
+  methods: {
+    contentStyleChange() {
+      this.contentSearchStyleChange()
+      this.contentBtnAdAllStyleChange()
+      this.contentSearchBtnStyleChange()
+      this.contentTableBtnStyleChange()
+      this.contentPageStyleChange()
+    },
+    contentSearchStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-input__inner').forEach(el=>{
+          let textAlign = 'left'
+          if(this.contents.inputFontPosition == 2) textAlign = 'center'
+          if(this.contents.inputFontPosition == 3) textAlign = 'right'
+          el.style.textAlign = textAlign
+          el.style.height = this.contents.inputHeight
+          el.style.lineHeight = this.contents.inputHeight
+          el.style.color = this.contents.inputFontColor
+          el.style.fontSize = this.contents.inputFontSize
+          el.style.borderWidth = this.contents.inputBorderWidth
+          el.style.borderStyle = this.contents.inputBorderStyle
+          el.style.borderColor = this.contents.inputBorderColor
+          el.style.borderRadius = this.contents.inputBorderRadius
+          el.style.backgroundColor = this.contents.inputBgColor
+        })
+        if(this.contents.inputTitle) {
+          document.querySelectorAll('.form-content .slt .el-form-item__label').forEach(el=>{
+            el.style.color = this.contents.inputTitleColor
+            el.style.fontSize = this.contents.inputTitleSize
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        }
+        setTimeout(()=>{
+          document.querySelectorAll('.form-content .slt .el-input__prefix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__suffix').forEach(el=>{
+            el.style.color = this.contents.inputIconColor
+            el.style.lineHeight = this.contents.inputHeight
+          })
+          document.querySelectorAll('.form-content .slt .el-input__icon').forEach(el=>{
+            el.style.lineHeight = this.contents.inputHeight
+          })
+        },10)
+
+      })
+    },
+    // 搜索按钮
+    contentSearchBtnStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .slt .el-button--success').forEach(el=>{
+          el.style.height = this.contents.searchBtnHeight
+          el.style.color = this.contents.searchBtnFontColor
+          el.style.fontSize = this.contents.searchBtnFontSize
+          el.style.borderWidth = this.contents.searchBtnBorderWidth
+          el.style.borderStyle = this.contents.searchBtnBorderStyle
+          el.style.borderColor = this.contents.searchBtnBorderColor
+          el.style.borderRadius = this.contents.searchBtnBorderRadius
+          el.style.backgroundColor = this.contents.searchBtnBgColor
+        })
+      })
+    },
+    // 新增、批量删除
+    contentBtnAdAllStyleChange() {
+      this.$nextTick(()=>{
+        document.querySelectorAll('.form-content .ad .el-button--success').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllAddFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllAddBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--danger').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllDelFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllDelBgColor
+        })
+        document.querySelectorAll('.form-content .ad .el-button--warning').forEach(el=>{
+          el.style.height = this.contents.btnAdAllHeight
+          el.style.color = this.contents.btnAdAllWarnFontColor
+          el.style.fontSize = this.contents.btnAdAllFontSize
+          el.style.borderWidth = this.contents.btnAdAllBorderWidth
+          el.style.borderStyle = this.contents.btnAdAllBorderStyle
+          el.style.borderColor = this.contents.btnAdAllBorderColor
+          el.style.borderRadius = this.contents.btnAdAllBorderRadius
+          el.style.backgroundColor = this.contents.btnAdAllWarnBgColor
+        })
+      })
+    },
+    // 表格
+    rowStyle({ row, rowIndex}) {
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {color:this.contents.tableStripeFontColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    cellStyle({ row, rowIndex}){
+      if (rowIndex % 2 == 1) {
+        if(this.contents.tableStripe) {
+          return {backgroundColor:this.contents.tableStripeBgColor}
+        }
+      } else {
+        return ''
+      }
+    },
+    headerRowStyle({ row, rowIndex}){
+      return {color: this.contents.tableHeaderFontColor}
+    },
+    headerCellStyle({ row, rowIndex}){
+      return {backgroundColor: this.contents.tableHeaderBgColor}
+    },
+    // 表格按钮
+    contentTableBtnStyleChange(){
+      // this.$nextTick(()=>{
+      //   setTimeout(()=>{
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--success').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDetailFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDetailBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--primary').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnEditFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnEditBgColor
+      //     })
+      //     document.querySelectorAll('.table-content .tables .el-table__body .el-button--danger').forEach(el=>{
+      //       el.style.height = this.contents.tableBtnHeight
+      //       el.style.color = this.contents.tableBtnDelFontColor
+      //       el.style.fontSize = this.contents.tableBtnFontSize
+      //       el.style.borderWidth = this.contents.tableBtnBorderWidth
+      //       el.style.borderStyle = this.contents.tableBtnBorderStyle
+      //       el.style.borderColor = this.contents.tableBtnBorderColor
+      //       el.style.borderRadius = this.contents.tableBtnBorderRadius
+      //       el.style.backgroundColor = this.contents.tableBtnDelBgColor
+      //     })
+
+      //   }, 50)
+      // })
+    },
+    // 分页
+    contentPageStyleChange(){
+      let arr = []
+
+      if(this.contents.pageTotal) arr.push('total')
+      if(this.contents.pageSizes) arr.push('sizes')
+      if(this.contents.pagePrevNext){
+        arr.push('prev')
+        if(this.contents.pagePager) arr.push('pager')
+        arr.push('next')
+      }
+      if(this.contents.pageJumper) arr.push('jumper')
+      this.layouts = arr.join()
+      this.contents.pageEachNum = 10
+    },
+
+                init () {
+                                                                                                            },
+    search() {
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      let params = {
+        page: this.pageIndex,
+        limit: this.pageSize,
+        sort: 'id',
+      }
+                                          if(this.searchForm.canzhuohao!='' && this.searchForm.canzhuohao!=undefined){
+            params['canzhuohao'] = '%' + this.searchForm.canzhuohao + '%'
+          }
+                                                                          this.$http({
+        url: "canzhuo/page",
+        method: "get",
+        params: params
+      }).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.dataList = data.data.list;
+          this.totalPage = data.data.total;
+        } else {
+          this.dataList = [];
+          this.totalPage = 0;
+        }
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val;
+      this.pageIndex = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val;
+      this.getDataList();
+    },
+    // 多选
+    selectionChangeHandler(val) {
+      this.dataListSelections = val;
+    },
+    // 添加/修改
+    addOrUpdateHandler(id,type) {
+      this.showFlag = false;
+      this.addOrUpdateFlag = true;
+      this.crossAddOrUpdateFlag = false;
+      if(type!='info'){
+        type = 'else';
+      }
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id,type);
+      });
+    },
+    // 查看评论
+        // 下载
+    download(file){
+      window.open(`${file}`)
+    },
+    // 删除
+    deleteHandler(id) {
+      var ids = id
+        ? [Number(id)]
+        : this.dataListSelections.map(item => {
+            return Number(item.id);
+          });
+      this.$confirm(`确定进行[${id ? "删除" : "批量删除"}]操作?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        this.$http({
+          url: "canzhuo/delete",
+          method: "post",
+          data: ids
+        }).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.search();
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    },
+  }
+
+};
+</script>
+<style lang="scss" scoped>
+  .slt {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .ad {
+    margin: 0 !important;
+    display: flex;
+  }
+
+  .pages {
+    & /deep/ el-pagination__sizes{
+      & /deep/ el-input__inner {
+        height: 22px;
+        line-height: 22px;
+      }
+    }
+  }
+  
+
+  .el-button+.el-button {
+    margin:0;
+  } 
+
+  .tables {
+	& /deep/ .el-button--success {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(171, 239, 239, 1);
+	}
+	
+	& /deep/ .el-button--primary {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(240, 242, 124, 1);
+	}
+	
+	& /deep/ .el-button--danger {
+		height: 40px;
+		color: #333;
+		font-size: 14px;
+		border-width: 1px;
+		border-style: solid;
+		border-color: rgba(196, 210, 244, 1);
+		border-radius: 22px;
+		background-color: rgba(244, 150, 150, 1);
+	}
+
+    & /deep/ .el-button {
+      margin: 4px;
+    }
+  }
+
+</style>