修改前端页面

kongdeqiang

2023-06-05 3342e77756618c7b6ee47dbb309401696d4d72d1

修改前端页面

 package-lock.json

@@ -2636,6 +2636,11 @@
        "@xtuc/long": "4.2.2"
      }
    },
    "@xmldom/xmldom": {
      "version": "0.8.8",
      "resolved": "https://mirrors.cloud.tencent.com/npm/@xmldom/xmldom/-/xmldom-0.8.8.tgz",
      "integrity": "sha512-0LNz4EY8B/8xXY86wMrQ4tz6zEHZv9ehFMJPm8u2gq5lQ71cfRKdaKyxfJAx5aUoyzx0qzgURblTisPGgz3d+Q=="
    },
    "@xtuc/ieee754": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@@ -5495,6 +5500,37 @@
        "buffer-indexof": "^1.0.0"
      }
    },
    "docx-preview": {
      "version": "0.1.15",
      "resolved": "https://mirrors.cloud.tencent.com/npm/docx-preview/-/docx-preview-0.1.15.tgz",
      "integrity": "sha512-qeYNwA+HF0e+GLxH/yltGdaBVQHoQrscfCwR2p7fRGCMjPBohdd36L7xDi1wdErS3ZnV/uh4kx5+tXOXgzq/dQ==",
      "requires": {
        "jszip": ">=3.0.0"
      }
    },
    "docxtemplater": {
      "version": "3.37.9",
      "resolved": "https://mirrors.cloud.tencent.com/npm/docxtemplater/-/docxtemplater-3.37.9.tgz",
      "integrity": "sha512-0FYopqsEe8dpN2mILn8qINzXXXZ25qnbXYVJtgjxar3VI0IfUd7nPfZGRffWvAKgLQupPs2dGJDzjRI60TmD8A==",
      "requires": {
        "@xmldom/xmldom": "^0.8.7"
      }
    },
    "docxtemplater-image-module-free": {
      "version": "1.1.1",
      "resolved": "https://mirrors.cloud.tencent.com/npm/docxtemplater-image-module-free/-/docxtemplater-image-module-free-1.1.1.tgz",
      "integrity": "sha512-aWOzVQN7ggDYjfoy3pTTNrcrZ7/CJrQcI9cT+hmyHE6nRLR67nt5yPFPe9hm9VWbfYIED2fi+3itOnF0TE/RWQ==",
      "requires": {
        "xmldom": "^0.1.27"
      },
      "dependencies": {
        "xmldom": {
          "version": "0.1.31",
          "resolved": "https://mirrors.cloud.tencent.com/npm/xmldom/-/xmldom-0.1.31.tgz",
          "integrity": "sha512-yS2uJflVQs6n+CyjHoaBmVSqIDevTAWrzMmjG1Gc7h1qQ7uVozNhEPJAwZXWyGQ/Gafo3fCwrcaokezLPupVyQ=="
        }
      }
    },
    "dom-converter": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz",
@@ -6197,6 +6233,11 @@
          }
        }
      }
    },
    "file-saver": {
      "version": "2.0.5",
      "resolved": "https://mirrors.cloud.tencent.com/npm/file-saver/-/file-saver-2.0.5.tgz",
      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
    },
    "file-type": {
      "version": "9.0.0",
@@ -7215,6 +7256,11 @@
      "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==",
      "dev": true
    },
    "immediate": {
      "version": "3.0.6",
      "resolved": "https://mirrors.cloud.tencent.com/npm/immediate/-/immediate-3.0.6.tgz",
      "integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
    },
    "import-cwd": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
@@ -7822,6 +7868,22 @@
        "verror": "1.10.0"
      }
    },
    "jszip": {
      "version": "3.10.1",
      "resolved": "https://mirrors.cloud.tencent.com/npm/jszip/-/jszip-3.10.1.tgz",
      "integrity": "sha512-xXDvecyTpGLrqFrvkrUSoxxfJI5AH7U8zxxtVclpsUtMCq4JQ290LY8AW5c7Ggnr/Y/oK+bQMbqK2qmtk3pN4g==",
      "requires": {
        "lie": "~3.3.0",
        "pako": "~1.0.2",
        "readable-stream": "~2.3.6",
        "setimmediate": "^1.0.5"
      }
    },
    "jszip-utils": {
      "version": "0.1.0",
      "resolved": "https://mirrors.cloud.tencent.com/npm/jszip-utils/-/jszip-utils-0.1.0.tgz",
      "integrity": "sha512-tBNe0o3HAf8vo0BrOYnLPnXNo5A3KsRMnkBFYjh20Y3GPYGfgyoclEMgvVchx0nnL+mherPi74yLPIusHUQpZg=="
    },
    "keyv": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.0.1.tgz",
@@ -7893,6 +7955,14 @@
      "resolved": "https://mirrors.cloud.tencent.com/npm/lib-flexible/-/lib-flexible-0.3.2.tgz",
      "integrity": "sha1-BvWnSDIxSi01wSA5vJw8otrqpCY=",
      "dev": true
    },
    "lie": {
      "version": "3.3.0",
      "resolved": "https://mirrors.cloud.tencent.com/npm/lie/-/lie-3.3.0.tgz",
      "integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
      "requires": {
        "immediate": "~3.0.5"
      }
    },
    "lighthouse-logger": {
      "version": "1.2.0",
@@ -9412,6 +9482,21 @@
          "version": "3.4.0",
          "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-3.4.0.tgz",
          "integrity": "sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w=="
        }
      }
    },
    "pizzip": {
      "version": "3.1.4",
      "resolved": "https://mirrors.cloud.tencent.com/npm/pizzip/-/pizzip-3.1.4.tgz",
      "integrity": "sha512-08yol1Of5Og1E0a1R56c+Z1jVkvfTEBUouwG9WYwCqpj8BjdcpEpLgZsrdLFNQYRgtxK0OOe0JpmBWJdrPr6Dg==",
      "requires": {
        "pako": "^2.1.0"
      },
      "dependencies": {
        "pako": {
          "version": "2.1.0",
          "resolved": "https://mirrors.cloud.tencent.com/npm/pako/-/pako-2.1.0.tgz",
          "integrity": "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug=="
        }
      }
    },
@@ -11405,8 +11490,7 @@
    "setimmediate": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=",
      "dev": true
      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
    },
    "setprototypeof": {
      "version": "1.1.1",

 package.json

@@ -11,12 +11,18 @@
    "appium-chromedriver": "^4.11.0",
    "axios": "^0.18.0",
    "babel-polyfill": "^6.26.0",
    "docx-preview": "^0.1.15",
    "docxtemplater": "^3.37.9",
    "docxtemplater-image-module-free": "^1.1.1",
    "echarts": "^4.9.0",
    "element-ui": "^2.13.1",
    "file-saver": "^2.0.5",
    "jquery": "^3.5.1",
    "jszip-utils": "^0.1.0",
    "mavon-editor": "^2.6.17",
    "moment": "^2.29.4",
    "node-sass": "^4.14.1",
    "pizzip": "^3.1.4",
    "qs": "^6.9.4",
    "sass-loader": "^10.0.4",
    "v-distpicker": "^1.2.1",

 src/assets/js/ByUtils.js

@@ -111,8 +111,17 @@
                    vm.$router.push({'path': '/login'});
                    vm.$alert('会话结束，请重新登录', {'title': '提示', 'type': 'warning', 'center': true, 'showClose': false});
                }else{
                    vm.$alert('操作失败：' + data.message, {'title': '提示', 'type': 'warning', 'center': true, 'showClose': false});
                }
                    let a = '';
                    if(response.data){
                        if(response.data.msg){
                            a=response.data.msg
                        }else {
                            a='服务器故障'
                        }
                    }else {
                        a="数据错误"
                    }
                    vm.$alert(a , {'title': '提示', 'type': 'warning', 'center': true, 'showClose': false});                }
            }
        }).catch((e) => {
            vm.$loading().close();
@@ -265,6 +274,7 @@
        }).then((response) => {
            //vm.$loading().close();
            let data = response.data;
            console.log(response)
        if (data && data.code==0) {
                callBackFunction(data);
            } else {

 src/components/common/Sidebar.vue

@@ -46,80 +46,103 @@
            return {
                collapse: false,
                items: [
                    {
                  {
                    id:1,
                    icon: 'el-icon-folder-opened',
                    indexUrl: '1',
                    name: '系统管理',
                    children:[
                      {
                        id:1,
                        icon: 'el-icon-user-solid',
                        name: '人员管理',
                        parentId: 1,
                        indexUrl: 'user'
                    },
                    {
                        id:2,
                        icon: 'el-icon-place',
                        name: '停车场管理',
                        indexUrl: 'park'
                    },
                    {
                        id:3,
                      }
                    ]
                  },
                  {
                      id:2,
                      icon: 'el-icon-folder-opened',
                      indexUrl: '2',
                      name: '智慧泊车管理',
                      children:[
                          {
                              icon: 'el-icon-document',
                              name: '停车场管理',
                              parentId: 2,
                              indexUrl: "park"
                          },
                          {
                              icon: 'el-icon-document',
                              name: '收费规则管理',
                              parentId: 2,
                              indexUrl: "costRule"
                          },
                          {
                            icon: 'el-icon-document',
                            name: '车辆入场管理',
                            parentId: 2,
                            indexUrl: "enterPark"
                          },
                          {
                            icon: 'el-icon-document',
                            name: '车辆出场管理',
                            parentId: 2,
                            indexUrl: "outPark"
                          },
                          {
                            icon: 'el-icon-document',
                            name: '白名单管理',
                            parentId: 2,
                            indexUrl: "whiteList"
                          },
                          {
                            icon: 'el-icon-document',
                            name: '泊车发票管理',
                            parentId: 2,
                            indexUrl: "parkticket"
                          },
                          {
                            icon: 'el-icon-document',
                            name: '订单统计',
                            parentId: 2,
                            indexUrl: "orderRecord"
                          },
                      ]
                  },
                  {
                    id:3,
                    icon: 'el-icon-folder-opened',
                    indexUrl: '3',
                    name: '智慧罚没管理',
                    children:[
                      {
                        icon: 'el-icon-document',
                        name: '违章类型管理',
                        indexUrl: 'violationType'
                    },
                    // {
                    //     id:4,
                    //     icon: 'el-icon-document',
                    //     name: '订单管理',
                    //     indexUrl: 'outPark'
                    // },
                    // {
                    //     id:5,
                    //     icon: 'el-icon-document',
                    //     name: '罚单管理',
                    //     indexUrl: 'ticket'
                    // },
                    {
                        id:6,
                        icon: 'el-icon-document-checked',
                        name: '白名单',
                        indexUrl: 'whiteList'
                    },
                    {
                        id:7,
                        icon: 'el-icon-s-fold',
                        parentId: 3,
                        indexUrl: "violationType"
                      },
                      {
                        icon: 'el-icon-document',
                        name: '街道管理',
                        indexUrl: 'street'
                    },
                  {
                    id:8,
                    icon: 'el-icon-document',
                    name: '收费规则管理',
                    indexUrl: 'costRule'
                        parentId: 3,
                        indexUrl: "street"
                      },
                      {
                        icon: 'el-icon-document',
                        name: '罚单管理',
                        parentId: 3,
                        indexUrl: "ticket"
                      },
                      {
                        icon: 'el-icon-document',
                        name: '罚没发票管理',
                        parentId: 3,
                        indexUrl: "zfticket"
                      },
                    ]
                  },
                  {
                    id:9,
                    icon: 'el-icon-document',
                    name: '订单统计',
                    indexUrl: 'orderRecord'
                  },
                    // {
                    //     id:3,
                    //     icon: 'el-icon-folder-opened',
                    //     indexUrl: '2',
                    //     name: '统计报表',
                    //     children:[
                    //         {
                    //             icon: 'el-icon-document',
                    //             name: '普通员工月度评价',
                    //             parentId: 3,
                    //             indexUrl: "puTongYuanGongStatistic"
                    //         },
                    //         {
                    //             icon: 'el-icon-document',
                    //             name: '职能部门评价结果',
                    //             parentId: 3,
                    //             indexUrl: "leaderStatistic"
                    //         }
                    //     ]
                    // }
                ]
            }
        },

 src/components/page/EditParkNum.vue

@@ -68,13 +68,13 @@
        num:'',
        carNum:''
      },
      urlPath:this.$systemconfig.basePath + '/park/',
      urlPath:this.$systemconfig.basePath + '/ffzf/park/',
      table1:[],
      table2:[],
    }
  },
  mounted() {
    this.$byutil.postData(this, this.$systemconfig.basePath+'/park/findAll', this.formData, res => {
    this.$byutil.postData(this, this.urlPath+'findAll', this.formData, res => {
      this.table1 = res.data;
    })
  },
@@ -150,4 +150,4 @@
  height: 500px;
}

</style>
</style>

 src/components/page/Index.vue

@@ -74,7 +74,7 @@
                cs[cs_arr[i].split('=')[0]] = cs_arr[i].split('=')[1]
            }
            this.ticketId = cs.id;
            this.$byutil.postData(this, this.$systemconfig.basePath + '/ticket/findById', {id:cs.id}, res => {
            this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/ticket/findById', {id:cs.id}, res => {
                this.statisticData = res.data;
            })
        },

 src/components/page/Index2.vue

@@ -37,14 +37,22 @@
                            <el-button class="jiaofei-btn" type="primary" @click="pay()" :loading="payFlag">去缴费</el-button>
                        </el-form-item>
                    </el-form>
<!--                    <el-form label-width="100px" label-position="left">-->
<!--                        <el-form-item label="请输入手机号" style="margin-left: 5px;">-->
<!--                            <el-input v-model="carNo" placeholder="请输入手机号"></el-input>-->
<!--                        </el-form-item>-->
<!--                        <el-form-item style="display: flex;justify-content: center;margin-top: 2px" label-width="0">-->
<!--                            <el-button class="jiaofei-btn" type="primary" @click="noCarOut()" v-show="showFlag">无牌出场缴费</el-button>-->
<!--                        </el-form-item>-->
<!--                    </el-form>-->
                    <el-form
                        class="carSearch"
                        label-position="left">
                        <el-form-item
                            class='formLabel'
                            style="display: flex;
                            flex-direction: column;align-items: center;justify-content: center"
                            label="无 牌 车 辆 查 询">
                            <el-input prefix-icon="el-icon-search" style="margin-top: 20px;border: solid 1px #ccc!important;" v-model="carNo" placeholder="请输入手机号"></el-input>
                        </el-form-item>
                        <el-form-item class="weizhang-footer-box" style="display: flex;justify-content: center;margin-top: 5.498vh" label-width="0">
                            <el-button
                                style="borderColor:'none';background:#121215e0 "
                                class="jiaofei-btn" type="primary" @click="noCarOut()" v-show="showFlag">查询</el-button>
                        </el-form-item>
                    </el-form>

                </div>

@@ -113,26 +121,18 @@
            },
            noCarOut(){
                if(this.carNo){
                    this.$byutil.postData(this, this.$systemconfig.basePath + '/outpark/outPark2', {code2:this.code2,carNo:this.carNo}, res => {
                        if(res.success){
                            this.outParkId = res.data.id;
                            this.pay();
                            this.showFlag = false;
                        }else{
                            this.$message({
                                message: res.msg, type: 'error', duration:2000,
                            });
                    this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/car/outParkByPhone', {code2:this.code2,carNo:this.carNo}, res => {
                        if(res.code===0){
                          this.statisticData = res.data;
                          this.outParkId = this.statisticData.id;
                        }

                    })
                }else{
                    this.$message({
                        message: '请输入手机号',
                        type: 'error',
                        duration:2000,
                    });
                }

            },
        }
    }
@@ -245,4 +245,21 @@
    .weizhang-main-bootom{
        margin-top: 0.333rem  /* 25/75 */;
    }
    .formLabel{
      ::v-deep .el-form-item__label{
        font-size: 18px;
      }
      ::v-deep el-input{
        border: solid 1px #ccc!important;

      }

    }
    .carSearch{
      border:solid 1px #ccc;
      margin-top: 15%;
      border-radius: 4%;
      box-shadow: 0px 0px 0px 10px;

    }
</style>

 src/components/page/Index3.vue

File was deleted

 src/components/page/Index4.vue

New file
@@ -0,0 +1,198 @@
<template>
    <div class="weizhang-box">
        <!--<div class="weizhang-header">-->
            <!--<div class="iconfont leftjiantou">&#xe606;</div>-->
            <!--<div class="text"><h1>峰峰矿区综合行政执法局</h1></div>-->
            <!--<div class="right"></div>-->
        <!--</div>-->
        <div class="weizhang-main-box">
            <div class="weizhang-main-top">
                <img class="logoPhone" src="../../assets/images/logoImg.png" alt="">
                <span class="weizhang">无牌车辆入场</span>

            </div>
            <div class="weizhang-main-bootom">
                <div class="weizhang-main-form">
                    <el-form label-width="80px" :model="statisticData" label-position="left">
                        <el-form-item label="停车场:" style="margin-left: 25px;">
                            {{this.statisticData.parkName}}
                        </el-form-item>
                        <el-form-item label="道闸:" style="margin-left: 25px;">
                            {{this.statisticData.name}}
                        </el-form-item>
                      <el-form-item label="手机号:" style="margin-left: 25px;">
                        <el-input v-model="enterPark.carNo"></el-input>
                      </el-form-item>
                        <el-form-item class="weizhang-footer-box" style="display: flex;justify-content: center;margin-top: 5.498vh" label-width="0" v-if="statisticData.type==1">
                            <el-button class="jiaofei-btn" type="primary" @click="pay()" :loading="payFlag">进场</el-button>
                        </el-form-item>
                    </el-form>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'dashboard',
        data() {
            return {
                payFlag:false,
                outParkId:"",
                statisticData:{

                },
                enterPark:{
                  barrierId:"",
                  carNo:"",
                  parkId:"",
                },
                showFlag:true,
                showFlag2:true,
                status3:0,
                carNo:"",
                code2:""
            }
        },
        created(){
            var url = window.location.href;
            var cs = url.split('?')[1];
            var cs_arr = cs.split('&');
            var cs={};
            for(var i=0;i<cs_arr.length;i++){
                cs[cs_arr[i].split('=')[0]] = cs_arr[i].split('=')[1]
            }
            this.code2 = cs.code;
            this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/barrier/getByCode', {code:cs.code}, res => {
                this.statisticData = res.data;
            })
        },
        methods: {
            pay(){
              if(this.enterPark.carNo === null || this.enterPark.carNo === ""){
                this.$message.error("请填写手机号");
                return;
              }
              this.enterPark.parkId = this.statisticData.parkId,
              this.enterPark.barrierId = this.statisticData.id,
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/car/inParkByPhone', this.enterPark, res => {
                  if(res.code===0){
                    this.$message.success("操作成功");
                  }else {
                    this.$message.error(res.msg);
                  }
                })
            },
        }
    }

</script>


<style lang="scss">
    .weizhang-main-bootom{
        .el-input__inner{
            border:none;
        }
        .el-form-item__label{
            color: #000;
            font-weight: 600;
        }
    }
    .weizhang-footer-box{
        .el-form-item__content{
            width: 100%;
            display: flex;
            justify-content: center;
        }
        .el-button--small{
            padding: 11px 15px;
            font-size: 0.347rem  /* 26/75 */;
        }
    }

</style>
<style lang="scss" scoped>
    h1,h2,h3,h4,h5{
        font-family: '苹方 中等';
        font-weight: normal;
    }
    .weizhang-header{
        display: flex;
        height: 12.8vw  /* 96/7.5 */;
        align-items: center;
        border-bottom:1px solid rgba(154,154,154,0.2);
    .text{
        flex: 1;
        text-align: center;
    h1{
        font-size: 2.699vh  /* 36/13.34 */;
    }
    }
    .right{
        width: 6.747vh  /* 90/13.34 */;
    }
    .leftjiantou{
        font-size: 5.33vw;
        width: 6.747vh  /* 90/13.34 */;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    }
    .weizhang-main-box{
        width: 100%;
        display: flex;
        flex-direction: column;
        padding:5.33vw  /* 40/7.5 */;
    }
    .weizhang-main-top{
        height: 22.489vh  /* 300/13.34 */;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        border-bottom: 1px solid #f0f0f0;
    .money{
        font-size: 6.93vw  /* 52/7.5 */;
        font-weight: 550;
        color: #000;
    }
    .weizhang{
        font-size: 0.4rem  /* 30/75 */;
        line-height: 2;
        font-weight: normal;
        margin-top:1.33vw  /* 10/7.5 */;
        color: #000;
    }
    }
    .weizhang-main-form{
    }
    .weizhang-tiaokuan{
        margin-top: 2.67vw  /* 20/7.5 */;
    h1{
        font-size:3.2vw  /* 24/7.5 */;
        color: #999999;
        text-indent: 2.5em;
        line-height: 2;
    }
    }
    .jiaofei-btn{
        width: 80%;
        border-radius: 5.33vw  /* 40/7.5 */;
        background-image: linear-gradient(to right,#33b1fe,#0679dc);
    }

    .logoPhone{
        margin-top: 0.67vw;
        width: 1.333rem  /* 100/75 */;
        height: 1.333rem  /* 100/75 */;
    }
    .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item {
        margin-bottom: 10px;
    }
    .weizhang-main-bootom{
        margin-top: 0.333rem  /* 25/75 */;
    }
</style>

 src/components/page/IndexTest.vue

@@ -107,13 +107,10 @@
                    return;
                }
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/api/park', {id:this.outParkId}, res => {
                    this.$message({
                        message: '2秒后自动跳转到支付页面，防止内外网数据同步延迟，请稍等',
                        type: 'success',
                        duration:2000,
                    });
                  setTimeout(function(){window.location.href = res.msg;},2000);
                    this.showFlag = false;
                  if(res.code === 0){
                    window.location.href = res.msg
                    this.showFlag = false
                  }
                })
            },
            noCarOut(){

 src/components/page/Login.vue

@@ -48,7 +48,7 @@
            submitForm(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var url = this.$systemconfig.basePath + '/user/login';
                        var url = this.$systemconfig.basePath + '/ffzf/user/login';
                        this.$byutil.postData(this,url,this.ruleForm,res=>{
                            let data = res.data;
                          if (data) {

 src/components/page/costRule/index.vue

@@ -12,7 +12,7 @@
            </el-form>
        </div>

        <el-table :data="pageData.rows" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
        <el-table :data="pageData.rows"  :height="tableHeight" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
            <el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
            <el-table-column prop="parkName" label="停车场" align="center" width="150"></el-table-column>
            <el-table-column prop="armyCar" label="军车是否免费" align="center" width="100">
@@ -173,15 +173,17 @@
                    freeTime:0,
                    parkId:null
                },
                urlPath:this.$systemconfig.basePath + '/rule/',
                urlPath:this.$systemconfig.basePath + '/ffzf/rule/',
                table1:[],
               tableHeight:500,
            }
        },
        mounted() {
            this.loadData();
            this.$byutil.postData(this, this.$systemconfig.basePath+'/park/findAll', this.formData, res => {
            this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
                this.table1 = res.data;
            })
          this.tableHeight = window.innerHeight - 260
        },
        methods: {
            onSave(){

 src/components/page/enterpark/index.vue

New file
@@ -0,0 +1,145 @@
<template>
  <div class="mod-config">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="车牌号">
          <el-input v-model="searchForm.carNo" clearable></el-input>
        </el-form-item>
        <el-form-item label="停车场">
          <el-select v-model="searchForm.parkId" clearable>
            <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="选择入场时间">
          <div class="date-box">
            <el-date-picker type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
                            v-model="searchForm.date" placeholder="">
            </el-date-picker>
          </div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button>
        </el-form-item>
      </el-form>

      <div class="avue-crud">
        <el-table
              :height="tableHeight"
               :data="pageData.rows"
                border
               v-loading="pageData.isLoading">
          <el-table-column
            type="index"
            width="50"
            label="序号"
            align="center">
          </el-table-column>
          <el-table-column label="入场图" width="200" header-align="center" align="center">
            <template slot-scope="scope">
              <!-- trigger(触发方式)、placement(出现位置) -->
              <el-popover trigger="hover" placement="right" v-if="scope.row.imgPath != null">
                <img :src="scope.row.imgPath"  style="height: 800px;width: 800px"/>
                <img slot="reference" :src="scope.row.imgPath" :alt="scope.row.imgPath" style="height: 50px;width: 150px">
              </el-popover>
            </template>
          </el-table-column>
            <el-table-column
                    prop="carNo"
                    header-align="center"
                    align="center"
                    label="车牌号">
            </el-table-column>
            <el-table-column
                    prop="parkName"
                    header-align="center"
                    align="center"
                    label="停车场">
            </el-table-column>
            <el-table-column
              prop="createTime"
              header-align="center"
              align="center"
              label="入场时间">
            </el-table-column>
            <el-table-column
                    prop="status"
                    header-align="center"
                    align="center"
                    label="发现违章">
              <template slot-scope="scope">
                <p v-if="scope.row.status==0">未违章</p>
                <p v-if="scope.row.status==1" style="color: red">有违章</p>
              </template>
            </el-table-column>
        </el-table>
        <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>

      </div>

  </div>
</template>

<script>
  export default {
    data () {
      return {
        tableHeight:500,
        dataForm: {
          key: ''
        },
        table1:[],
        pageData: this.$byutil.defaultPageData(),
        searchForm: {
          current: this.pageIndex,
          size: this.pageSize,
          carNo:'',
          parkId:'',
          date: new Date,
        },
        dataList: [],
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false
      }
    },
    components: {
    },
    created () {
      this.getAllPark()
      this.getDataList()
      this.tableHeight = window.innerHeight - 260
    },
    computed: {
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.searchForm.current = this.pageIndex
        this.searchForm.size = this.pageSize
        this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/enterpark/findPage', this.searchForm);
        this.dataListLoading = false
      },
      getAllPark(){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
          this.table1 = res.data;
        })
      },
      onPageSizeChange(val) {
        this.pageData.pageSize = val;
        this.loadData();
      },
      onCurrentPageChange(val) {
        this.pageData.page = val;
        this.loadData();
      },
    }
  }
</script>

<style lang="scss" scoped>
.fenye-box{
  width: calc(70% - 20px);
}
</style>

 src/components/page/orderRecord/index.vue

@@ -16,7 +16,6 @@
              </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="small" @click="onSearch" icon="el-icon-search">查询</el-button>
                    <el-button type="primary" size="small" @click="onSearch2" icon="el-icon-search">查询</el-button>
                </el-form-item>
            </el-form>
        </div>
@@ -48,14 +47,14 @@
                  orderNum:'',
                  orderMoney:''
                },
                urlPath:this.$systemconfig.basePath + '/orderrecord/',
                urlPath:this.$systemconfig.basePath + '/ffzf/orderrecord/',
                table1:[],
                table2:[],
            }
        },
        mounted() {
            this.defaultDate();
            this.$byutil.postData(this, this.$systemconfig.basePath+'/park/findAll', this.formData, res => {
            this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
                this.table1 = res.data;
            })
        },
@@ -75,11 +74,6 @@
            onSearch() {
                this.loadData();
            },
          onSearch2() {
            this.$byutil.postData(this, this.urlPath+'getById/1000', null,res => {
              console.log(res.data)
            });
          },
          //设置默认日期
          defaultDate(){
            //获取新的时间

 src/components/page/outPark/AddDialog.vue

File was deleted

 src/components/page/outPark/index.vue

@@ -1,226 +1,179 @@
<template>
    <section>
        <el-card class="box-card toolCard">
            <div slot="header" class="clearfix">
                <!--显示导航-->
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>
                        <a href="javascript:void(0);">系统管理</a>
                    </el-breadcrumb-item>
                    <el-breadcrumb-item>用户管理</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <!--<div class="text item">-->
            <!--工具条-->
            <!--<section class="toolbar">-->
  <div class="mod-config">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="车牌号">
          <el-input v-model="searchForm.carNo" clearable></el-input>
        </el-form-item>
        <el-form-item label="支付码">
          <el-input v-model="searchForm.payCode" clearable></el-input>
        </el-form-item>
        <el-form-item label="停车场">
          <el-select v-model="searchForm.parkId" clearable>
            <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="选择出场时间">
          <div class="date-box">
            <el-date-picker type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
                            v-model="searchForm.date" placeholder="">
            </el-date-picker>
          </div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button>
        </el-form-item>
      </el-form>

            <!--</section>-->
            <el-form :inline="true" :model="searchForm">
                <el-form-item label="名称">
                    <el-input v-model="searchForm.name" placeholder="名称"></el-input>
                </el-form-item>
                <el-form-item label="手机号">
                    <el-input v-model="searchForm.phone" placeholder="手机号"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="small" @click="onSearch" icon="el-icon-search">查询</el-button>
                    <el-button type="primary" size="small" @click="onAdd" icon="el-icon-plus">增加</el-button>
                    <el-button type="primary" size="small" @click="onInitPassword" icon="el-icon-refresh">初始化密码</el-button>
                    <el-button type="primary" size="small" @click="onSetUserImage" icon="el-icon-picture-outline">设置头像</el-button>
                    <el-button type="primary" size="small" @click="onChangeDept" icon="el-icon-picture-outline">调换部门</el-button>
                </el-form-item>
            </el-form>

            <!--</div>-->
        </el-card>

        <!--列表数据-->
        <el-table :data="pageData.rows" v-loading="pageData.isLoading" :element-loading-text="pageData.loadingText"
                  border
                  :height="pageConfig.maxHeight"
                  stripe  tooltip-effect="dark" style="width:100%; height:100%" @selection-change="onSelectionChange" @row-click="clickRow"
                  ref="mulTable">
            <!--<el-table-column-->
            <!--type="selection"-->
            <!--width="50">
    </el-table-column>-->
            <el-table-column prop="loginName" label="登录名">
      <div class="avue-crud">
        <el-table
            :height="tableHeight"
            :data="pageData.rows"
            border
            v-loading="pageData.isLoading">
          <el-table-column
            type="index"
            width="50"
            label="序号"
            align="center">
          </el-table-column>
          <el-table-column label="出场图" width="200" header-align="center" align="center">
            <template slot-scope="scope">
              <!-- trigger(触发方式)、placement(出现位置) -->
              <el-popover trigger="hover" placement="right" v-if="scope.row.imgPath != null">
                <img :src="scope.row.imgPath"  style="height: 800px;width: 800px"/>
                <img slot="reference" :src="scope.row.imgPath" :alt="scope.row.imgPath" style="height: 50px;width: 150px">
              </el-popover>
            </template>
          </el-table-column>
            <el-table-column
                    prop="carNo"
                    header-align="center"
                    align="center"
                    label="车牌号">
            </el-table-column>
            <el-table-column prop="name" label="姓名">
            <el-table-column
                    prop="enterTime"
                    header-align="center"
                    align="center"
                    label="入场时间">
            </el-table-column>
            <el-table-column prop="sexStr" label="性别名">
          <el-table-column
            prop="createTime"
            header-align="center"
            align="center"
            label="出场时间">
          </el-table-column>
          <el-table-column
            prop="timeStr"
            header-align="center"
            align="center"
            label="停车时长">
          </el-table-column>
            <el-table-column
                    prop="parkName"
                    header-align="center"
                    align="center"
                    label="停车场">
            </el-table-column>
            <el-table-column prop="age" label="年龄">
            <el-table-column
                    prop="payCode"
                    header-align="center"
                    align="center"
                    label="支付码">
            </el-table-column>
            <el-table-column prop="deptName" label="所在部门">
            <el-table-column
                    prop="price"
                    width="100px"
                    header-align="center"
                    align="center"
                    label="停车金额(元)">
            </el-table-column>
            <el-table-column prop="post" label="职位">
            <el-table-column
                    prop="status"
                    width="120px"
                    header-align="center"
                    align="center"
                    label="缴费状态">
              <template slot-scope="scope">
                <p v-if="scope.row.status==0">未缴费</p>
                <p v-if="scope.row.status==1">已缴费</p>
              </template>
            </el-table-column>
            <el-table-column prop="phone" label="手机号">
            </el-table-column>
            <el-table-column prop="roleNames" label="角色">
            </el-table-column>
            <el-table-column prop="status" label="状态">
            </el-table-column>
            <el-table-column prop="lastLoginTime" label="最近登录时间">
            </el-table-column>

            <el-table-column label="操作" fixed="right" width="250">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="onEdit(scope.$index, scope.row)">编辑
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            @click="onStop(scope.$index, scope.row)">停用
                    </el-button>
                    <el-button
                            size="mini"
                            @click="onStart(scope.$index, scope.row)">启用
                    </el-button>
                </template>
            <el-table-column
                    prop="status3"
                    width="120px"
                    header-align="center"
                    align="center"
                    label="违章状态">
              <template slot-scope="scope">
                <p v-if="scope.row.status3==0">未违章</p>
                <p v-if="scope.row.status3==1" style="color: red">有违章</p>
              </template>
            </el-table-column>
        </el-table>
        <!--分页信息-->
        <el-pagination
                background
                @size-change="onPageSizeChange"
                @current-change="onCurrentPageChange"
                :current-page="pageData.currentPage"
                :page-sizes="[10, 20, 30, 40, 50, 100, 200]"
                :page-size="pageData.pageSize"
                layout="total, sizes, jumper, prev, pager, next"
                :total="pageData.total">
        </el-pagination>
    </section>
        <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>

      </div>
  </div>
</template>

<script>
    // 导入新增组件
    import addDialog from './AddDialog'
    export default {
        name: "UserIndex",
        data: function () {
            return {
                pageConfig: {
                    pageDataUrl: this.$systemconfig.basePath + '/security/user/list',
                    stopUrl: this.$systemconfig.basePath + '/security/user/stop',
                    startUrl: this.$systemconfig.basePath + '/security/user/start',
                    initPasswordUrl:this.$systemconfig.basePath+'/security/user/restoreInitialPassword',
                },
                // 查询数据
                searchForm: {
                    name: ''
                },
                // 页面数据
                pageData: this.$byutil.defaultPageData()
            }
  export default {
    data () {
      return {
        tableHeight:500,
        dataForm: {
          key: ''
        },
        // 引入组件
        components: {
            addDialog: addDialog
        table1:[],
        pageData: this.$byutil.defaultPageData(),
        searchForm: {
          current: this.pageIndex,
          size: this.pageSize,
          carNo:'',
          parkId:'',
          payCode:'',
          date: new Date(),
        },
        // 执行初始化数据
        mounted() {
            this.$byutil.initTableMaxHeight(this);
            this.loadData();
        },
        // 方法
        methods: {
            //加载数据
            loadData() {
                this.$byutil.loadPageData(this, this.pageConfig.pageDataUrl, this.searchForm);
            },
            // 点击查询按钮
            onSearch() {
                this.pageData = this.$byutil.defaultPageData();
                this.loadData();
            },
            // 点击新增按钮
            onAdd() {
                this.$refs.addDialog.showDialog(true);
            },
            // 点击编辑按钮
            onEdit(index, row) {
                this.$refs.addDialog.showDialog(true);
                //初始化旧数据
                this.$refs.addDialog.initData(row);
            },
            // 点击停用
            onStop(index, row) {
                if(row.status == "删除"){
                    alert("已经停用，不能再次停用");
                    return;
                }
                this.$byutil.stopData(this, this.pageConfig.stopUrl, row);
            },
            // 点击启用
            onStart(index, row) {
                if(row.status == "正常"){
                    alert("正常状态，不能再次启用");
                    return;
                }
                this.$byutil.startData(this, this.pageConfig.startUrl, row);
            },
            // 多选时
            onSelectionChange(val) {
                // this.pageData.multipleSelection = val
            },
            // 切换每页显示条数
            onPageSizeChange(val) {
                this.pageData.pageSize = val;
                this.loadData();
            },
            // 跳转页
            onCurrentPageChange(val) {
                this.pageData.page = val;
                this.loadData();
            },
            //单选
            clickRow(val){
                this.pageData.signSelection = val

            },
            // 设置头像
            onSetUserImage (){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$refs.setUserImageDialog.showDialog(true);
                this.$refs.setUserImageDialog.initData(row);
            },

            // 调换部门
            onChangeDept (){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$refs.changeDeptDialog.showDialog(true);
                this.$refs.changeDeptDialog.initData(row);
            },

            //初始化密码
            onInitPassword(){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$byutil.postData(this,this.pageConfig.initPasswordUrl,row,res=>{
                    this.$alert(row.name+'初始化密码成功', {'title': '提示','type': 'success','center': true,'showClose': false});
                })
            }
        }
        dataList: [],
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false
      }
    },
    components: {
    },
    created () {
      this.getAllPark()
      this.getDataList()
      this.tableHeight = window.innerHeight - 260
    },
    computed: {
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.searchForm.current = this.pageIndex
        this.searchForm.size = this.pageSize
        this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/outpark/findPage', this.searchForm);
        this.dataListLoading = false
      },
      getAllPark(){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
          this.table1 = res.data;
        })
      },
      onPageSizeChange(val) {
        this.pageData.pageSize = val;
        this.loadData();
      },
      onCurrentPageChange(val) {
        this.pageData.page = val;
        this.loadData();
      },
    }
  }
</script>

<style scoped>

</style>

 src/components/page/park/index.vue

@@ -83,7 +83,7 @@
                    phone: '',
                    type: '',
                },
                urlPath:this.$systemconfig.basePath + '/park/',
                urlPath:this.$systemconfig.basePath + '/ffzf/park/',
                id:null,
            }
        },

 src/components/page/park/index2.vue

@@ -90,7 +90,7 @@
                    ipAddress:'',
                    port:'',
                },
                urlPath:this.$systemconfig.basePath + '/barrier/',
                urlPath:this.$systemconfig.basePath + '/ffzf/barrier/',
            }
        },
        watch:{

 src/components/page/parkticket/index.vue

New file
@@ -0,0 +1,210 @@
<template>
  <div class="mod-config">
    <basic-container>
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="车牌号">
          <el-input v-model="searchForm.carNo" clearable></el-input>
        </el-form-item>
<!--        <el-form-item label="停车场">-->
<!--          <el-select v-model="searchForm.parkId" clearable>-->
<!--            <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>-->
<!--          </el-select>-->
<!--        </el-form-item>-->
        <el-form-item>
          <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button>
        </el-form-item>
      </el-form>

      <div class="avue-crud">
        <el-table
            :height="tableHeight"
            :data="pageData.rows"
            border
            v-loading="pageData.isLoading">
          <el-table-column
            type="index"
            width="50"
            label="序号"
            align="center">
          </el-table-column>
          <el-table-column label="入场图" width="200" header-align="center" align="center">
            <template slot-scope="scope">
              <!-- trigger(触发方式)、placement(出现位置) -->
              <el-popover trigger="hover" placement="right" v-if="scope.row.imgInPath != null">
                <img :src="scope.row.imgInPath"  style="height: 800px;width: 800px"/>
                <img slot="reference" :src="scope.row.imgInPath" :alt="scope.row.imgInPath" style="height: 50px;width: 150px">
              </el-popover>
            </template>
          </el-table-column>
          <el-table-column label="出场图" width="200" header-align="center" align="center">
            <template slot-scope="scope">
              <!-- trigger(触发方式)、placement(出现位置) -->
              <el-popover trigger="hover" placement="right" v-if="scope.row.imgOutPath != null">
                <img :src="scope.row.imgOutPath"  style="height: 800px;width: 800px"/>
                <img slot="reference" :src="scope.row.imgOutPath" :alt="scope.row.imgOutPath" style="height: 50px;width: 150px">
              </el-popover>
            </template>
          </el-table-column>
            <el-table-column
                    prop="carNo"
                    header-align="center"
                    align="center"
                    label="车牌号">
            </el-table-column>
            <el-table-column
                    prop="code"
                    header-align="center"
                    align="center"
                    label="订单号">
            </el-table-column>
          <el-table-column
            prop="updateTime"
            header-align="center"
            align="center"
            label="开票时间">
          </el-table-column>
            <el-table-column
                    prop="money"
                    header-align="center"
                    align="center"
                    width="100px"
                    label="金额">
            </el-table-column>
            <el-table-column
                    prop="payCode"
                    header-align="center"
                    align="center"
                    label="电子缴款码">
            </el-table-column>
            <el-table-column
                    prop="ticketStatus"
                    header-align="center"
                    align="center"
                    width="100px"
                    label="开票状态">
              <template slot-scope="scope">
                <p v-if="scope.row.ticketStatus==2" style="color: red">未开票</p>
                <p v-if="scope.row.ticketStatus==1" >已开票</p>
              </template>
            </el-table-column>
          <el-table-column
                  header-align="center"
                  align="center"
                  label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" icon="el-icon-view" @click="watchTicket(scope.row.fileId)">查看发票</el-button>
              <el-button type="text" size="small" icon="el-icon-download" @click="downTicket(scope.row.fileId)">下载发票</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>

      </div>

      <el-dialog append-to-body title="查看发票" :visible.sync="imgFlag" width="60%" :close-on-click-modal="closeDialog">
        <el-image
          class = "my-img"
          ref = "myImg"
          :src="imageUrl"
          :preview-src-list="srcList">
        </el-image>
      </el-dialog>

    </basic-container>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        tableHeight:500,
        dataForm: {
          key: ''
        },
        table1:[],
        pageData: this.$byutil.defaultPageData(),
        searchForm: {
          carNo:'',
          parkId:'',
          type:1,
          current:this.pageIndex,
          size:this.pageSize
        },
        imageUrl:'',
        imgFlag:false,
        srcList:'',
        dataList: [],
        pageIndex: 1,
        pageSize: 50,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false
      }
    },
    components: {
    },
    created () {
      this.getDataList()
      this.getAllPark()
      this.tableHeight = window.innerHeight - 260
    },
    computed: {
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.searchForm.current = this.pageIndex
        this.searchForm.size = this.pageSize
        this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/orderrecord/findPage', this.searchForm);
        this.dataListLoading = false
      },
      getAllPark(){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
          this.table1 = res.data;
        })
      },
      closeDialog(){
        this.imgFlag = false
      },
      watchTicket(fileId){
        this.imgFlag = true
        this.imageUrl = "/ffzf/fileinfo/showImgById/"+fileId
      },
      downTicket(fileId){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/fileinfo/download/downloadPng', {fileId:fileId}, res => {

        })
      },
      onPageSizeChange(val) {
        this.pageData.pageSize = val;
        this.loadData();
      },
      onCurrentPageChange(val) {
        this.pageData.page = val;
        this.loadData();
      },
    }
  }
</script>
<style lang="scss" scoped>
.fenye-box2{
  width: calc(80% - 20px);
}
.per-up{
  position: relative;
  .my-img{
    width: 100px;
    height: 100px;
    .el-image__inner{
      visibility: hidden ;
    }
  }
  .my-pre{
    position: absolute;
    margin-left: 111px;
    margin-top: -156px;
  }
}
</style>

 src/components/page/street/index.vue

@@ -16,7 +16,7 @@
            </el-form>
        </div>

        <el-table :data="pageData.rows" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;margin-top: 10px;">
        <el-table :data="pageData.rows" :height="tableHeight" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;margin-top: 10px;">
            <el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
            <el-table-column prop="name" label="道路名称" align="center"></el-table-column>
            <el-table-column prop="code" label="编号" align="center"></el-table-column>
@@ -113,6 +113,7 @@
                searchForm: {
                    type: null
                },
                tableHeight:500,
                pageData: this.$byutil.defaultPageData(),
                formData: {
                    name: '',
@@ -123,11 +124,12 @@
        },
        mounted() {
            this.loadData();
            this.tableHeight = window.innerHeight - 260
        },
        methods: {
            onSave3(){
                for(var i=0;i<this.streetIds.length;i++){
                    this.$byutil.postData(this, this.$systemconfig.basePath + '/street/save2', {roadId:this.roadId,streetId:this.streetIds[i]}, res => {
                    this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/street/save2', {roadId:this.roadId,streetId:this.streetIds[i]}, res => {
                        this.streetEdit(this.roadId);
                    })
                }
@@ -149,21 +151,21 @@
                this.loadSelect();
            },
            loadSelect(){
                this.$byutil.postData(this, this.$systemconfig.basePath + '/street/findList', {}, res => {
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/street/findList', {}, res => {
                    this.select3 = res.data.list2
                })
            },
            streetEdit(id){
                this.flag2 = true;
                this.roadId = id;
                this.$byutil.postData(this, this.$systemconfig.basePath + '/street/findById', {id:id,type:0}, res => {
                this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/street/findById', {id:id,type:0}, res => {
                    this.table2 = res.data;
                })
            },
            onSave(){
                this.$refs['formData'].validate((valid) => {
                    if (valid) {
                        this.$byutil.postData(this, this.$systemconfig.basePath + '/street/save', this.formData, res => {
                        this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/street/save', this.formData, res => {
                            this.$refs['formData'].resetFields();
                            this.flag=false;
                            this.$message({message: '保存成功', type: 'success'});
@@ -176,7 +178,7 @@
                });
            },
            loadData() {
                this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/street/findPage', this.searchForm);
                this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/street/findPage', this.searchForm);
            },
            onSearch() {
                this.pageData = this.$byutil.defaultPageData();
@@ -196,13 +198,13 @@
                this.formData  = row;
            },
            onDelete(index, row) {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/street/delete",{id:row.id}, res => {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/ffzf/street/delete",{id:row.id}, res => {
                    this.$message({message: '删除成功', type: 'success'});
                    this.loadData();
                })
            },
            onDelete2(index, row) {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/street/delete2",{id:row.id}, res => {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/ffzf/street/delete2",{id:row.id}, res => {
                    this.$message({message: '删除成功', type: 'success'});
                    this.streetEdit(this.roadId)
                })

 src/components/page/ticket/AddDialog.vue

File was deleted

 src/components/page/ticket/index.vue

@@ -1,226 +1,236 @@
<template>
    <section>
        <el-card class="box-card toolCard">
            <div slot="header" class="clearfix">
                <!--显示导航-->
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>
                        <a href="javascript:void(0);">系统管理</a>
                    </el-breadcrumb-item>
                    <el-breadcrumb-item>用户管理</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <!--<div class="text item">-->
            <!--工具条-->
            <!--<section class="toolbar">-->
  <div class="mod-config">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="车牌号">
          <el-input v-model="searchForm.carNo" clearable></el-input>
        </el-form-item>
        <el-form-item label="事件类型">
          <el-select v-model="searchForm.type" placeholder="请选择" clearable>
            <el-option label="现场处罚" :value="0"></el-option>
            <el-option label="上级任务" :value="1"></el-option>
            <el-option label="违章拖车" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="缴费状态">
          <el-select v-model="searchForm.payStatus" placeholder="请选择" clearable>
            <el-option label="待缴费" :value="0"></el-option>
            <el-option label="已缴费" :value="1"></el-option>
            <el-option label="缴费失败" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="违章类型">
          <el-select v-model="searchForm.violationTypeId" clearable>
            <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button>
        </el-form-item>
      </el-form>

            <!--</section>-->
            <el-form :inline="true" :model="searchForm">
                <el-form-item label="名称">
                    <el-input v-model="searchForm.name" placeholder="名称"></el-input>
                </el-form-item>
                <el-form-item label="手机号">
                    <el-input v-model="searchForm.phone" placeholder="手机号"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="small" @click="onSearch" icon="el-icon-search">查询</el-button>
                    <el-button type="primary" size="small" @click="onAdd" icon="el-icon-plus">增加</el-button>
                    <el-button type="primary" size="small" @click="onInitPassword" icon="el-icon-refresh">初始化密码</el-button>
                    <el-button type="primary" size="small" @click="onSetUserImage" icon="el-icon-picture-outline">设置头像</el-button>
                    <el-button type="primary" size="small" @click="onChangeDept" icon="el-icon-picture-outline">调换部门</el-button>
                </el-form-item>
            </el-form>

            <!--</div>-->
        </el-card>

        <!--列表数据-->
        <el-table :data="pageData.rows" v-loading="pageData.isLoading" :element-loading-text="pageData.loadingText"
                  border
                  :height="pageConfig.maxHeight"
                  stripe  tooltip-effect="dark" style="width:100%; height:100%" @selection-change="onSelectionChange" @row-click="clickRow"
                  ref="mulTable">
            <!--<el-table-column-->
            <!--type="selection"-->
            <!--width="50">
    </el-table-column>-->
            <el-table-column prop="loginName" label="登录名">
      <div class="avue-crud">
        <el-table
            :height="tableHeight"
            :data="pageData.rows"
            border
            v-loading="pageData.isLoading">
          <el-table-column
            type="index"
            width="50"
            label="序号"
            align="center">
          </el-table-column>
          <el-table-column
            prop="carNo"
            width="100px"
            header-align="center"
            align="center"
            label="车牌号">
          </el-table-column>
          <el-table-column
            prop="type"
            width="100px"
            header-align="center"
            align="center"
            label="事件类型">
            <template slot-scope="scope">
              <p v-if="scope.row.type==0" >现场处罚</p>
              <p v-if="scope.row.type==1">上级任务</p>
              <p v-if="scope.row.type==2">违章拖车</p>
            </template>
          </el-table-column>
          <el-table-column
            prop="carType"
            width="90px"
            header-align="center"
            align="center"
            label="车辆类型">
          </el-table-column>
          <el-table-column
            prop="color"
            width="90px"
            header-align="center"
            align="center"
            label="车辆颜色">
          </el-table-column>
            <el-table-column
                    prop="address"
                    header-align="center"
                    align="center"
                    label="违法地点">
            </el-table-column>
            <el-table-column prop="name" label="姓名">
            </el-table-column>
            <el-table-column prop="sexStr" label="性别名">
            </el-table-column>
            <el-table-column prop="age" label="年龄">
            </el-table-column>
            <el-table-column prop="deptName" label="所在部门">
            </el-table-column>
            <el-table-column prop="post" label="职位">
            </el-table-column>
            <el-table-column prop="phone" label="手机号">
            </el-table-column>
            <el-table-column prop="roleNames" label="角色">
            </el-table-column>
            <el-table-column prop="status" label="状态">
            </el-table-column>
            <el-table-column prop="lastLoginTime" label="最近登录时间">
            <el-table-column
                    prop="money"
                    width="100px"
                    header-align="center"
                    align="center"
                    label="应缴金额">
            </el-table-column>

            <el-table-column label="操作" fixed="right" width="250">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="onEdit(scope.$index, scope.row)">编辑
                    </el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            @click="onStop(scope.$index, scope.row)">停用
                    </el-button>
                    <el-button
                            size="mini"
                            @click="onStart(scope.$index, scope.row)">启用
                    </el-button>
                </template>
            <el-table-column
                    prop="payStatus"
                    width="100px"
                    header-align="center"
                    align="center"
                    label="缴费状态">
              <template slot-scope="scope">
                <p v-if="scope.row.payStatus==0" style="color: red">待缴费</p>
                <p v-if="scope.row.payStatus==1">已缴费</p>
                <p v-if="scope.row.payStatus==2" style="color: blue">缴费失败</p>
              </template>
            </el-table-column>
            <el-table-column
                    prop="userName"
                    width="100px"
                    header-align="center"
                    align="center"
                    label="处理人">
            </el-table-column>
            <el-table-column
                    prop="violationTypeName"
                    header-align="center"
                    align="center"
                    width="100px"
                    label="违章类型">
            </el-table-column>
          <el-table-column
            prop="remark"
            header-align="center"
            align="center"
            label="备注">
          </el-table-column>
          <el-table-column
                  fixed="right"
                  header-align="center"
                  align="center"
                  label="操作">
            <template slot-scope="scope">
              <el-button  type="text" size="small" icon="el-icon-view" @click="addOrUpdateHandle(scope.row.id)">处决书</el-button>
              <el-button  type="text" size="small" icon="el-icon-view" @click="pictureHandle(scope.row)">图像证据</el-button>
              <el-button  type="text" size="small" icon="el-pay6zhifu" @click="jiaofeiHandle(scope.row.id)">现场缴费</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!--分页信息-->
        <el-pagination
                background
                @size-change="onPageSizeChange"
                @current-change="onCurrentPageChange"
                :current-page="pageData.currentPage"
                :page-sizes="[10, 20, 30, 40, 50, 100, 200]"
                :page-size="pageData.pageSize"
                layout="total, sizes, jumper, prev, pager, next"
                :total="pageData.total">
        </el-pagination>
    </section>
        <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>

      </div>

      <!-- 弹窗, 新增 / 修改 -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></table-form>
      <!--图像证据-->
      <pictureForm v-if="pictureFormVisiable" ref="pictureForm"></pictureForm>
  </div>
</template>

<script>
    // 导入新增组件
    import addDialog from './AddDialog'
    export default {
        name: "UserIndex",
        data: function () {
            return {
                pageConfig: {
                    pageDataUrl: this.$systemconfig.basePath + '/security/user/list',
                    stopUrl: this.$systemconfig.basePath + '/security/user/stop',
                    startUrl: this.$systemconfig.basePath + '/security/user/start',
                    initPasswordUrl:this.$systemconfig.basePath+'/security/user/restoreInitialPassword',
                },
                // 查询数据
                searchForm: {
                    name: ''
                },
                // 页面数据
                pageData: this.$byutil.defaultPageData()
            }
  import TableForm from './ticket-form'
  import pictureForm from './picture-form'
  export default {
    data () {
      return {
        tableHeight:650,
        dataForm: {
          key: ''
        },
        // 引入组件
        components: {
            addDialog: addDialog
        table1:[],
        pageData: this.$byutil.defaultPageData(),
        searchForm: {
          current:this.pageIndex,
          size:this.pageSize,
          carNo:'',
          type:null,
          violationTypeId:null,
          payStatus:null,
        },
        // 执行初始化数据
        mounted() {
            this.$byutil.initTableMaxHeight(this);
            this.loadData();
        },
        // 方法
        methods: {
            //加载数据
            loadData() {
                this.$byutil.loadPageData(this, this.pageConfig.pageDataUrl, this.searchForm);
            },
            // 点击查询按钮
            onSearch() {
                this.pageData = this.$byutil.defaultPageData();
                this.loadData();
            },
            // 点击新增按钮
            onAdd() {
                this.$refs.addDialog.showDialog(true);
            },
            // 点击编辑按钮
            onEdit(index, row) {
                this.$refs.addDialog.showDialog(true);
                //初始化旧数据
                this.$refs.addDialog.initData(row);
            },
            // 点击停用
            onStop(index, row) {
                if(row.status == "删除"){
                    alert("已经停用，不能再次停用");
                    return;
                }
                this.$byutil.stopData(this, this.pageConfig.stopUrl, row);
            },
            // 点击启用
            onStart(index, row) {
                if(row.status == "正常"){
                    alert("正常状态，不能再次启用");
                    return;
                }
                this.$byutil.startData(this, this.pageConfig.startUrl, row);
            },
            // 多选时
            onSelectionChange(val) {
                // this.pageData.multipleSelection = val
            },
            // 切换每页显示条数
            onPageSizeChange(val) {
                this.pageData.pageSize = val;
                this.loadData();
            },
            // 跳转页
            onCurrentPageChange(val) {
                this.pageData.page = val;
                this.loadData();
            },
            //单选
            clickRow(val){
                this.pageData.signSelection = val
        dataList: [],
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false,
        pictureFormVisiable:false, //图像证据弹框
      }
    },
    components: {
      TableForm,
      pictureForm
    },
    created () {
      this.getDataList()
      this.findAllViolation()
      this.tableHeight = window.innerHeight - 255
    },
    computed: {

            },
            // 设置头像
            onSetUserImage (){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$refs.setUserImageDialog.showDialog(true);
                this.$refs.setUserImageDialog.initData(row);
            },
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.searchForm.current=this.pageIndex
        this.searchForm.size=this.pageSize
        this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/ticket/findPage', this.searchForm);
        this.dataListLoading = false
      },
      findAllViolation(){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/violationType/findAll', this.formData, res => {
          this.table1 = res.data;
        })
      },
      onPageSizeChange(val) {
        this.pageData.pageSize = val;
        this.loadData();
      },
      onCurrentPageChange(val) {
        this.pageData.page = val;
        this.loadData();
      },
      pictureHandle(data) {
         console.log(data,'data=====')
          let imgArry = []
          if(data.img) {
              imgArry = data.img.split(',')
              console.log(imgArry,'imgArry====')
          }
          this.pictureFormVisiable = true
          this.$nextTick(() => {
              this.$refs.pictureForm.init(imgArry)
          })

            // 调换部门
            onChangeDept (){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$refs.changeDeptDialog.showDialog(true);
                this.$refs.changeDeptDialog.initData(row);
            },

            //初始化密码
            onInitPassword(){
                let row = this.pageData.signSelection;
                if(!row){
                    this.$alert('请选择用户', {'title': '提示','type': 'warning','center': true,'showClose': false});
                    return;
                }
                this.$byutil.postData(this,this.pageConfig.initPasswordUrl,row,res=>{
                    this.$alert(row.name+'初始化密码成功', {'title': '提示','type': 'success','center': true,'showClose': false});
                })
            }
        }
      },
      // 新增 / 修改
      addOrUpdateHandle (id) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id)
        })
      },
      //现场缴费
      jiaofeiHandle(id){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/ticket/jiaofei', {id:id}, res => {
          this.getDataList()
        })
      },
    }
  }
</script>

<style scoped>

</style>

 src/components/page/ticket/picture-form.vue

New file
@@ -0,0 +1,74 @@
<template>
    <div>
      <el-dialog
        title="图像证据"
        :close-on-click-modal="false"
        :visible.sync="visible"
        v-dialogDrag>
        <div class="previewDialog" v-for="(item,index) in pictureList" :key="index">
          <img
            style="width: 100%"
            :src="item.url"
            :preview="item.preview"
            :preview-text="item.title"
            alt="">
          <!--<div class="enlargeBox">
            <img
              :src="item.larg"
              alt="">
          </div>-->
        </div>
      </el-dialog>
    </div>
</template>

<script>
    export default {
        name: "pictureForm",
        data() {
            return {
                visible:false,
                pictureList: []
            }
        },
        methods: {
            init(data) {

                this.visible = true
                this.pictureList = data.map((item,index) => {
                    return {
                        url: '/ffzf/fileinfo/showImg/'+item,
                        title: item,
                        preview:'1',
                        //larg: require('@/assets/img/enlarge.png')
                    }
                })
                this.$previewRefresh();
                console.log(this.pictureList,'pictureList-----pictureList')
            }
        }
    }
</script>

<style lang="scss">
  .pswp{
    z-index: 9999;
  }

</style>
<style lang="scss" scoped>
  .previewDialog{
    position: relative;
    cursor: pointer;
    /*.enlargeBox{*/
    /*  position: absolute;*/
    /*  z-index: 99999;*/
    /*  left: 50%;*/
    /*  top: 50%;*/
    /*  background: rgba(0,0,0,0.5);*/
    /*  padding: 20px;*/
    /*  border-radius: 20px;*/
    /*  box-shadow:inset 0 0 2px 3px rgba(255,255,255,0.2), 0 0 8px rgba(255,255,255,0.6),0 0 20px rgba(255,255,255,0.3);*/
    /*}*/
  }
</style>

 src/components/page/ticket/ticket-form.vue

New file
@@ -0,0 +1,222 @@
<template>
  <div>
    <el-dialog
      :title="!dataForm.id ? '新增' : '完善信息'"
      append-to-body
      :close-on-click-modal="false"
      :visible.sync="visible"
      v-dialogDrag>
      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
               label-width="140px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="年份">
              <el-date-picker
                style="width: 100%"
                v-model="dataForm.year"
                value-format="yyyy"
                type="year"
                placeholder="选择年">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="文书号">
              <el-input v-model="dataForm.number"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <!--<el-col :span="12">
            <el-form-item label="决定书号">
              <el-input
                v-model="dataForm.unitName"
                placeholder="峰综当罚决〔     〕第    号"
              ></el-input>
            </el-form-item>
          </el-col>-->

          <el-col :span="12">
            <el-form-item label="当事人" prop="personName">
              <el-input v-model="dataForm.personName" placeholder="请输入当事人"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="身份证号码" prop="idCard">
              <el-input v-model="dataForm.idCard" placeholder="请输入身份证号码"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>

          <el-col :span="12">
            <el-form-item label="住址" prop="personAddress">
              <el-input v-model="dataForm.personAddress" placeholder="请输入住址"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="执行期限" prop="days">
              <el-input v-model="dataForm.days" placeholder="请输入执行期限"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="执法人员" prop="zfName1">
              <el-input v-model="dataForm.zfName1" placeholder="请输入账号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="执法证号" prop="zfNum1">
              <el-input v-model="dataForm.zfNum1" placeholder="请输入户名"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="执法人员" prop="zfName2">
              <el-input v-model="dataForm.zfName2" placeholder="请输入账号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="执法证号" prop="zfNum2">
              <el-input v-model="dataForm.zfNum2" placeholder="请输入户名"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()" :loading="loadingSubmit">确定</el-button>
      <el-button type="primary" @click="viewVord(dataForm)">预览</el-button>
      <el-button type="success" @click="downloadWord(dataForm)">下载</el-button>
    </span>
    </el-dialog>
    <WordView v-if="WordViewShow" ref="WordView"></WordView>
  </div>
</template>

<script>
  import WordView from './word-view/index'
  import {exportDoc} from '../../../libs/word'

  export default {
    components: {
        WordView
    },
    data() {
      return {
        WordViewShow: false,   //word文档是否显示
        visible: false,
        loadingSubmit:false,
        dataForm: {
            year:'',
            number:'',
            personName:'',
            idCard: '',
            chufaCheckList:[],
            fakuanCheckList:[],
            personAddress:'',
            zfName1:'',
            zfName2:'',
            zfNum1:'',
            zfNum2:'',
            id:'',
            days: '0'

        },
        dataRule: {

          personName: [
                {required: true, message: '当事人不能为空', trigger: 'blur'}
              ],
          personAddress: [
            {required: true, message: '当事人地址不能为空', trigger: 'blur'}
          ],
          idCard: [
                {required: true, message: '身份证号不能为空', trigger: 'blur'}
              ],
          zfName1: [
                {required: true, message: '执法人员1不能为空', trigger: 'blur'}
              ],
          zfName2: [
                {required: true, message: '执法人员2不能为空', trigger: 'blur'}
              ],
        }
      }
    },
    methods: {
      init(id) {
        this.dataForm.id = id || null;
        this.visible = true;
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.id) {
            this.$byutil.getData(this,this.$systemconfig.basePath+'/ffzf/ticket/'+id,null,res=>{
              this.dataForm = res.data
            })
          }
        })
      },
      viewVord(data) {  //word预览
          this.WordViewShow = true
          this.$nextTick(() => {
              this.$refs.WordView.initWord(data,'/words/administrativeDecisionLetter.docx')
          })
      },
      downloadWord(data) {  //word下载

          exportDoc(data,'/words/administrativeDecisionLetter.docx','当场行政处罚决定书')
      },
      // 表单提交
      dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.loadingSubmit = true;
            if (this.dataForm.id) {
              this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/ticket/updateById', this.formData, res => {
                if (res.code === 0) {
                  this.$notify.success('修改成功')
                  this.visible = false
                  this.loadingSubmit = false;
                  this.$emit('refreshDataList')
                } else {
                  this.loadingSubmit = false;
                }
              })
            } else {
              alert("未选择违章车辆")
            }
          }
        })
      }
    }
  }
</script>
<style lang="scss">
  .el-checkbox.flexDate{
    display: flex;
    align-items: baseline;
    .el-checkbox__label{
      display: flex;
      flex-wrap: wrap;
      line-height: 2;
      white-space: initial;
    }
  }
</style>
<style lang="scss" scoped>
  .flexDate{
    display: flex;
    span{
      margin-left: 5px;
    }
  }
  .dialog-footer{
    display: flex;
    justify-content: center;
    .el-button{
      margin: 0 5px;
    }
  }
</style>

 src/components/page/ticket/word-view/index.vue

New file
@@ -0,0 +1,46 @@
<template>
  <el-dialog
    title="预览"
    :visible.sync="dialogVisible"
    class="dialogStyle"
    v-dialogDrag>
    <div ref="word"></div>
  </el-dialog>
</template>

<script>
    import {viewD} from '../../../../libs/word'
    export default {
        name: "index",
        data() {
            return {
                dialogVisible: false,
            }
        },
        methods: {
            initWord(data,url) {
                this.dialogVisible = true
                setTimeout(() => {
                    viewD(data,url,this.$refs.word)
                },1000)
            }
        }
    }
</script>

<style lang="scss">
  .dialogStyle{
    .el-dialog{
      width: clamp(860px,47%,960px) !important;
    }
    .docx-wrapper{
      background:#fff!important;
    }
  }

</style>
<style lang="scss" scoped>
  :v-deep{

  }
</style>

 src/components/page/user/index.vue

@@ -102,7 +102,7 @@
                this.formData.parkIds = this.parkIds.toString()
                this.$refs['formData'].validate((valid) => {
                    if (valid) {
                        this.$byutil.postData(this, this.$systemconfig.basePath + '/user/save', this.formData, res => {
                        this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/user/save', this.formData, res => {
                            this.$refs['formData'].resetFields();
                            this.flag=false;
                            this.$message({message: '保存成功', type: 'success'});
@@ -114,10 +114,10 @@
                });
            },
            loadData() {
                this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/user/findPage', this.searchForm);
                this.$byutil.loadPageData(this, this.$systemconfig.basePath + '/ffzf/user/findPage', this.searchForm);
            },
            getParkList(){
              this.$byutil.postData(this, this.$systemconfig.basePath + '/park/findAll',null,res => {
              this.$byutil.postData(this, this.$systemconfig.basePath + '/ffzf/park/findAll',null,res => {
                this.parkList = res.data
              });
            },
@@ -154,7 +154,7 @@
              console.log(this.parkIds)
            },
            onDelete(index, row) {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/user/delete",{id:row.id}, res => {
                this.$byutil.deleteData(this,this.$systemconfig.basePath+"/ffzf/user/delete",{id:row.id}, res => {
                    this.$message({message: '删除成功', type: 'success'});
                    this.loadData();
                })

 src/components/page/violationType/index.vue

@@ -12,7 +12,7 @@
            </el-form>
        </div>

        <el-table :data="pageData.rows" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
        <el-table :data="pageData.rows" :height="tableHeight" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
            <el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
            <el-table-column prop="code" label="违章代码" align="center" width="80"></el-table-column>
            <el-table-column prop="name" label="简称" align="center" width="200"></el-table-column>
@@ -63,6 +63,7 @@
                searchForm: {
                    name: ''
                },
              tableHeight:500,
                pageData: this.$byutil.defaultPageData(),
                formData: {
                    name: '',
@@ -70,11 +71,12 @@
                    reducePoint: 0,
                    content: '',
                },
                urlPath:this.$systemconfig.basePath + '/violationType/'
                urlPath:this.$systemconfig.basePath + '/ffzf/violationType/'
            }
        },
        mounted() {
            this.loadData();
          this.tableHeight = window.innerHeight - 260
        },
        methods: {
            onSave(){

 src/components/page/whiteList/index.vue

@@ -12,7 +12,7 @@
            </el-form>
        </div>

        <el-table :data="pageData.rows" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
        <el-table :height="tableHeight" :data="pageData.rows" v-loading="pageData.isLoading" border style="width:100%;border:1px solid #bcbec2;">
            <el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
            <el-table-column prop="carNo" label="车牌号" align="center" width="150"></el-table-column>
            <el-table-column prop="type" label="类型" align="center" width="100">
@@ -84,15 +84,17 @@
                    name: '',
                },
                ids:[],
                urlPath:this.$systemconfig.basePath + '/whiteList/',
                urlPath:this.$systemconfig.basePath + '/ffzf/whiteList/',
                table1:[],
              tableHeight:500,
            }
        },
        mounted() {
            this.loadData();
            this.$byutil.postData(this, this.$systemconfig.basePath+'/park/findAll', this.formData, res => {
            this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
                this.table1 = res.data;
            })
          this.tableHeight = window.innerHeight - 260
        },
        methods: {
            selectChange(value){

 src/components/page/zfticket/index.vue

New file
@@ -0,0 +1,188 @@
<template>
  <div class="mod-config">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="车牌号">
          <el-input v-model="searchForm.carNo" clearable></el-input>
        </el-form-item>
<!--        <el-form-item label="停车场">-->
<!--          <el-select v-model="searchForm.parkId" clearable>-->
<!--            <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>-->
<!--          </el-select>-->
<!--        </el-form-item>-->
        <el-form-item>
          <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">查询</el-button>
        </el-form-item>
      </el-form>

      <div class="avue-crud">
        <el-table
            :height="tableHeight"
            :data="pageData.rows"
            border
            v-loading="pageData.isLoading">
          <el-table-column
            type="index"
            width="50"
            label="序号"
            align="center">
          </el-table-column>
            <el-table-column
                    prop="carNo"
                    header-align="center"
                    align="center"
                    label="车牌号">
            </el-table-column>
            <el-table-column
                    prop="code"
                    header-align="center"
                    align="center"
                    label="订单号">
            </el-table-column>
          <el-table-column
            prop="updateTime"
            header-align="center"
            align="center"
            label="开票时间">
          </el-table-column>
            <el-table-column
                    prop="money"
                    header-align="center"
                    align="center"
                    width="100px"
                    label="金额">
            </el-table-column>
            <el-table-column
                    prop="payCode"
                    header-align="center"
                    align="center"
                    label="电子缴款码">
            </el-table-column>
            <el-table-column
                    prop="ticketStatus"
                    header-align="center"
                    align="center"
                    width="100px"
                    label="开票状态">
              <template slot-scope="scope">
                <p v-if="scope.row.ticketStatus==0" style="color: red">未开票</p>
                <p v-if="scope.row.ticketStatus==1" >已开票</p>
              </template>
            </el-table-column>
          <el-table-column
                  header-align="center"
                  align="center"
                  label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" icon="el-icon-view" @click="watchTicket(scope.row.fileId)">查看发票</el-button>
              <el-button type="text" size="small" icon="el-icon-download" @click="downTicket(scope.row.fileId)">下载发票</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>

      </div>

      <el-dialog append-to-body title="查看发票" :visible.sync="imgFlag" width="60%" >
        <el-image
          class = "my-img"
          ref = "myImg"
          :src="imageUrl"
          :preview-src-list="srcList">
        </el-image>
      </el-dialog>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        tableHeight:500,
        dataForm: {
          key: ''
        },
        table1:[],
        pageData: this.$byutil.defaultPageData(),
        searchForm: {
          carNo:'',
          parkId:'',
          type:0,
          current:this.pageIndex,
          size:this.pageSize
        },
        imageUrl:'',
        imgFlag:false,
        srcList:'',
        dataList: [],
        pageIndex: 1,
        pageSize: 50,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false
      }
    },
    components: {
    },
    created () {
      this.getDataList()
      this.tableHeight = window.innerHeight - 260
    },
    computed: {
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        this.searchForm.current = this.pageIndex
        this.searchForm.size = this.pageSize
        this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/orderrecord/findPage', this.searchForm);
        this.dataListLoading = false
      },
      getAllPark(){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
          this.table1 = res.data;
        })
      },
      closeDialog(){
        this.imgFlag = false
      },
      watchTicket(fileId){
        this.imgFlag = true
        this.imageUrl = "/ffzf/fileinfo/showImgById/"+fileId
      },
      downTicket(fileId){
        this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/fileinfo/download/downloadPng', {fileId:fileId}, res => {

        })
      },
      onPageSizeChange(val) {
        this.pageData.pageSize = val;
        this.loadData();
      },
      onCurrentPageChange(val) {
        this.pageData.page = val;
        this.loadData();
      },
    }
  }
</script>
<style lang="scss" scoped>
.fenye-box2{
  width: calc(80% - 20px);
}
.per-up{
  position: relative;
  .my-img{
    width: 100px;
    height: 100px;
    .el-image__inner{
      visibility: hidden ;
    }
  }
  .my-pre{
    position: absolute;
    margin-left: 111px;
    margin-top: -156px;
  }
}
</style>

 src/libs/dialogDrag.js

New file
@@ -0,0 +1,75 @@
import Vue from 'vue';
// v-dialogDrag: 弹窗拖拽属性
Vue.directive('dialogDrag', {
  bind(el, binding, vnode, oldVnode) {
    const dialogHeaderEl = el.querySelector('.el-dialog__header');
    const dragDom = el.querySelector('.el-dialog');
    // dialogHeaderEl.style.cursor = 'move';
    dialogHeaderEl.style.cssText += ';cursor:move;';
    dragDom.style.cssText += ';top:0px;';

    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
    const sty = (function() {
      if (window.document.currentStyle) {
        return (dom, attr) => dom.currentStyle[attr];
      } else {
        return (dom, attr) => getComputedStyle(dom, false)[attr];
      }
    })();
    dialogHeaderEl.onmousedown = e => {
      // 鼠标按下，计算当前元素距离可视区的距离
      const disX = e.clientX - dialogHeaderEl.offsetLeft;
      const disY = e.clientY - dialogHeaderEl.offsetTop;
      const screenWidth = document.body.clientWidth; // body当前宽度
      const screenHeight = document.documentElement.clientHeight; // 可见区域高度(应为body高度，可某些环境下无法获取)
      const dragDomWidth = dragDom.offsetWidth; // 对话框宽度
      const dragDomheight = dragDom.offsetHeight; // 对话框高度
      const minDragDomLeft = dragDom.offsetLeft;
      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
      const minDragDomTop = dragDom.offsetTop;
      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
      // 获取到的值带px 正则匹配替换
      let styL = sty(dragDom, 'left');
      let styT = sty(dragDom, 'top');
      // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
      if (styL.includes('%')) {
        // eslint-disable-next-line no-useless-escape
        styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100);
        // eslint-disable-next-line no-useless-escape
        styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100);
      } else {
        styL = +styL.replace(/\px/g, '');
        styT = +styT.replace(/\px/g, '');
      }

      document.onmousemove = function(e) {
        // 通过事件委托，计算移动的距离
        let left = e.clientX - disX;
        let top = e.clientY - disY;

        // 边界处理
        if (-left > minDragDomLeft) {
          left = -minDragDomLeft;
        } else if (left > maxDragDomLeft) {
          left = maxDragDomLeft;
        }
        if (-top > minDragDomTop) {
          top = -minDragDomTop;
        } else if (top > maxDragDomTop) {
          top = maxDragDomTop;
        }

        // 移动当前元素
        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
      };

      document.onmouseup = function(e) {
        document.onmousemove = null;
        document.onmouseup = null;
      };
      return false;
    };
  }
});



 src/libs/word.js

New file
@@ -0,0 +1,89 @@
import PizZip from 'pizzip'
import docxtemplater from 'docxtemplater'
import JSZipUtils from 'jszip-utils'
import { saveAs } from 'file-saver'
let docx = require("docx-preview");
const ImageModule = require("docxtemplater-image-module-free");

//下载word，不带图片
export const exportDoc = (e,path,dname) => {
  for(let i in e) {
    if(e[i] == null) {
      e[i] = ''
    }
  }
  let docxsrc = path;        //模板文件的位置
  let docxname = dname;        //导出文件的名字
  // 读取并获得模板文件的二进制内容
  JSZipUtils.getBinaryContent(docxsrc,function (error, content) {
    if (error) throw error // 抛出异常
    let zip = new PizZip(content) // 创建一个JSZip实例，内容为模板的内容
    let doc = new docxtemplater().loadZip(zip) // 创建并加载docxtemplater实例对象
    doc.setData(e)  // 设置模板变量的值
    try {
      doc.render() // 用模板变量的值替换所有模板变量
    } catch(error) {
      let e = {
        message: error.message,
        name: error.name,
        stack: error.stack,
        properties: error.properties
      }
      console.log(JSON.stringify({ error: e }))
      throw error // 抛出异常
    }
    // 生成一个代表docxtemplater对象的zip文件（不是一个真实的文件，而是在内存中的表示）
    let out = doc.getZip().generate({
      type: "blob",
      mimeType: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
    });
    // 将目标文件对象保存为目标类型的文件，并命名
    saveAs(out, docxname);
  })
}

//预览word，不带图片的
export const viewD = (e, path , continer) => {
  for (let attr in e) {
    if (e[attr] == null) {
      e[attr] = "";
    }
  }
  let docxsrc = path;        //模板文件的位置
  // 读取并获得模板文件的二进制内容
  JSZipUtils.getBinaryContent(docxsrc, function (error, content) {
    // docxsrc是模板。我们在导出的时候，会根据此模板来导出对应的数据
    // 抛出异常
    if (error) {
      throw error;
    }

    // 创建一个PizZip实例，内容为模板的内容
    let zip = new PizZip(content);
    // 创建并加载docx templater实例对象
    let doc = new docxtemplater().loadZip(zip);
    // 设置模板变量的值
    doc.setData(e);

    try {
      //替换所有模板变量
      doc.render();
    } catch (error) {
      let e = {
        message: error.message,
        name: error.name,
        stack: error.stack,
        properties: error.properties
      };
      console.log(JSON.stringify({error: e}));
      throw error;
    }

    // 生成一个代表docxtemplater对象的zip文件（不是一个真实的文件，而是在内存中的表示）
    let out = doc.getZip().generate({
      type: "blob",
      mimeType: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
    });
    docx.renderAsync(out, continer); // 渲染到页面预览
  });
};

 src/router/index.js

@@ -18,35 +18,31 @@
                    path: '/user',
                    component: resolve => require(['../components/page/user/index.vue'], resolve),
                    meta: { title: '人员管理' }
                },{
                },
                {
                    path: '/park',
                    component: resolve => require(['../components/page/park/index.vue'], resolve),
                    meta: { title: '停车场管理' }
                },
                {
                    path: '/violationType',
                    component: resolve => require(['../components/page/violationType/index.vue'], resolve),
                    meta: { title: '违章类型管理' }
                    path: '/enterPark',
                    component: resolve => require(['../components/page/enterpark/index.vue'], resolve),
                    meta: { title: '车辆入场管理' }
                },
                {
                    path: '/outPark',
                    component: resolve => require(['../components/page/outPark/index.vue'], resolve),
                    meta: { title: '订单管理' }
                    meta: { title: '车辆出场管理' }
                },
                {
                    path: '/parkticket',
                    component: resolve => require(['../components/page/parkticket/index.vue'], resolve),
                    meta: { title: '泊车发票管理' }
                },
                {
                    path: '/whiteList',
                    component: resolve => require(['../components/page/whiteList/index.vue'], resolve),
                    meta: { title: '白名单' }
                },
                {
                    path: '/ticket',
                    component: resolve => require(['../components/page/ticket/index.vue'], resolve),
                    meta: { title: '罚单管理' }
                },
                {
                    path: '/street',
                    component: resolve => require(['../components/page/street/index.vue'], resolve),
                    meta: { title: '罚单管理' }
                },
                {
                    path: '/costRule',
@@ -57,6 +53,26 @@
                    path: '/orderRecord',
                    component: resolve => require(['../components/page/orderRecord/index.vue'], resolve),
                    meta: { title: '订单统计' }
                },
                {
                    path: '/violationType',
                    component: resolve => require(['../components/page/violationType/index.vue'], resolve),
                    meta: { title: '违章类型管理' }
                },
                {
                    path: '/ticket',
                    component: resolve => require(['../components/page/ticket/index.vue'], resolve),
                    meta: { title: '罚单管理' }
                },
                {
                    path: '/zfticket',
                    component: resolve => require(['../components/page/zfticket/index.vue'], resolve),
                    meta: { title: '罚没发票管理' }
                },
                {
                    path: '/street',
                    component: resolve => require(['../components/page/street/index.vue'], resolve),
                    meta: { title: '街道管理' }
                },
            ]
        },
@@ -79,15 +95,20 @@
            component: resolve => require(['../components/page/Index2.vue'], resolve),
            meta: { title: '智慧泊车' }
        },
        // {
        //     path: '/index3',
        //     component: resolve => require(['../components/page/Index3.vue'], resolve),
        //     meta: { title: '无牌停车' }
        // },
        {
            path: '/index4',
            component: resolve => require(['../components/page/Index4.vue'], resolve),
            meta: { title: '无牌入场' }
        },
        {
            path: '/indexTest',
            component: resolve => require(['../components/page/IndexTest.vue'], resolve),
            meta: { title: '邮储测试' }
        },
        {
            path: '/index3',
            component: resolve => require(['../components/page/Index3.vue'], resolve),
            meta: { title: '无牌停车' }
        },
        {
            path: '/invoice',

 vue.config.js

@@ -1,12 +1,22 @@
var path = require("path")
module.exports = {
    baseUrl: './',
    configureWebpack: {
        resolve: {
            alias: {
                '@': path.join(__dirname, 'src')
            }
        }
    },
    assetsDir: 'static',
    productionSourceMap: false,
    devServer: {
        sockHost: 'demo.my-domain.com',
        disableHostCheck: true,
        proxy: {
            '/api':{
                target:'http://183.196.93.178',
                //target:'http://127.0.0.1',
                //target:'http://183.196.93.178',
                target:'http://127.0.0.1',
                changeOrigin:true,
                pathRewrite:{
                    '/api':''