发票管理样式调整

front-vue/src/App.vue

@@ -19,7 +19,9 @@ export default {
     min-height: 100vh;
     background-color: #f4f5f6;
 }
-
+.zap-bg{
+    background-color: #ffffff;
+}
 .zap-padding {
     padding: 0 30px;
 }
@@ -31,7 +33,9 @@ export default {
 .zap-padding-end {
     padding-right: 25px;
 }
-
+.zap-padding-top{
+    padding-top: 25px !important;
+}
 .zap-margin-top {
     margin-top: 20px;
 }
@@ -106,18 +110,54 @@ export default {
         margin: 0;
     }
 }
-.zap-table-search{
-    padding: 0 25px; 
+
+.zap-table-search {
+    padding: 0 25px;
     background-color: #ffffff;
-    .el-form{
+
+    .el-form {
         padding-top: 25px;
     }
 }
-.zap-title__prefix{
+
+.zap-title__prefix {
     display: inline-block;
     margin-right: 10px;
     width: 5px;
     height: 20px;
     background-color: #4280f2;
 }
+
+.zap-table-search {
+    padding-top: 12px;
+    background-color: #ffffff;
+}
+
+.zap-table-search__form {
+    display: flex;
+    align-items: center;
+    min-height: 90px;
+
+    .el-form-item--medium.el-form-item {
+        margin-bottom: 0;
+    }
+
+    .el-form-item__label {
+        line-height: 40px;
+        font-size: 14px;
+        color: #333333;
+    }
+
+    .el-input--small .el-input__inner {
+        height: 40px;
+        line-height: 40px;
+    }
+}
+
+.zap-column-setting {
+    margin-left: 20px;
+}
+.zap-right-toolbar{
+    margin-top: 4px;
+}
 </style>

front-vue/src/views/service/contract/contract.vue

@@ -1,301 +1,246 @@
 <template>
-  <div class="app-container zap-main">
+<div class="app-container zap-main">
     <el-row class="zap-table-search">
         <div class="zap-padding-end">
-          <right-toolbar style="margin-top: 4px;" :showSearch.sync="showSearch" @queryTable="getList">收起</right-toolbar>
-          <span class="zap-padding-start zap-font-title">所选条件:</span>
-          <div  style="float: right;margin-right:1%">
-              <el-button type="cyan"  icon="el-icon-search" @click="handleQuery">搜索</el-button>
-              <el-button icon="el-icon-refresh" @click="resetQuery"  style="float: ;margin-right: 20px;">重置</el-button>
-              <column-setting :checkList="checkList" :tableList="tableList" :selfDom="selfDom" :tableId="tableId"></column-setting>
-          </div>
+            <right-toolbar class="zap-right-toolbar" :showSearch.sync="showSearch" @queryTable="getList">收起</right-toolbar>
+            <span class="zap-padding-start zap-font-title">所选条件:</span>
+            <div style="float: right;margin-right:1%">
+                <el-button type="cyan" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+                <el-button icon="el-icon-refresh" @click="resetQuery" style="float: ;margin-right: 20px;">重置</el-button>
+                <column-setting class="zap-column-setting"  :checkList="checkList"  :tableList="tableList"  :selfDom="selfDom"  :tableId="tableId"></column-setting>
+            </div>
         </div>
-        <hr  style="margin-top: 16px;">
+        <hr style="margin-top: 16px;">
         <el-form class="zap-table-search__form" :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
-          <el-form-item label="资金方" prop="scyName" >
-            <el-input
-              v-model="queryParams.scyName"
-              placeholder="请输入资金方"
-              clearable
-              size="small"
-              maxlength="30"
-              @keyup.enter.native="handleQuery"
-            />
-          </el-form-item>
-          <el-form-item label="合同模板名称" prop="zfcName">
-              <el-input
-              v-model="queryParams.zfcName"
-              placeholder="请输入模板名称"
-              clearable
-              size="small"
-              maxlength="20"
-            />
-          </el-form-item>
-          <el-form-item label="合同模板状态" prop="zfcStatus">
-              <el-select
-                v-model="queryParams.zfcStatus"
-                placeholder="请选择合同模板状态"
-                clearable
-                size="small">
-                <el-option
-                  v-for="dict in statusOptions"
-                  :key="dict.dictValue"
-                  :label="dict.dictLabel"
-                  :value="dict.dictValue"/>
-              </el-select>
-          </el-form-item>
+            <el-form-item label="资金方" prop="scyName">
+                <el-input v-model="queryParams.scyName" placeholder="请输入资金方" clearable size="small" maxlength="30" @keyup.enter.native="handleQuery" />
+            </el-form-item>
+            <el-form-item label="合同模板名称" prop="zfcName">
+                <el-input v-model="queryParams.zfcName" placeholder="请输入模板名称" clearable size="small" maxlength="20" />
+            </el-form-item>
+            <el-form-item label="合同模板状态" prop="zfcStatus">
+                <el-select v-model="queryParams.zfcStatus" placeholder="请选择合同模板状态" clearable size="small">
+                    <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
+                </el-select>
+            </el-form-item>
         </el-form>
     </el-row>
     <div class="zap-content zap-margin-top">
-        <el-button
-          type="primary"
-          icon="el-icon-plus"
-          @click="handleAdd"
-          v-hasPermi="['service:contract:add']"
-        >新增</el-button>
+        <el-button type="primary" icon="el-icon-plus" @click="handleAdd" v-hasPermi="['service:contract:add']">新增</el-button>
     </div>
 
     <el-table v-loading="loading" :data="contractList" class="zap-table" @selection-change="handleSelectionChange" stripe>
-      <el-table-column label="序号" type="index" width="50" align="center">
-        <template slot-scope="scope">
-          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
-        </template>
-      </el-table-column>     
-      <el-table-column label="资金方" align="center" prop="scyName" :show-overflow-tooltip="true" v-if="uncheckList.scyName"/> 
-      <el-table-column label="合同模板名称" align="center" prop="zfcName" :show-overflow-tooltip="true" v-if="uncheckList.zfcName"/>
-      <el-table-column label="合同模板状态" align="center" prop="zfcStatus" width = '120px' :formatter="statusFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcStatus"/>
-      <el-table-column label="签署节点" align="center" prop="zfcNode"  :formatter="nodeFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcNode"/>
-      <!-- <el-table-column label="签署方" align="center" prop="zfcSubject" :formatter="subjectFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcSubject"/> -->
-      <el-table-column label="创建人" align="center" prop="nickName" :show-overflow-tooltip="true" v-if="uncheckList.nickName"/>
-      <el-table-column label="创建时间" align="center" prop="createTime" :show-overflow-tooltip="true" v-if="uncheckList.createTime"/>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width='200px'>
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-if="scope.row.zfcStatus == '01'"
-            v-hasPermi="['service:contract:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleChange(scope.row)"
-            v-if="scope.row.zfcStatus == '00'"
-            v-hasPermi="['service:contract:change']"
-          >停用</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleChange(scope.row)"
-            v-if="scope.row.zfcStatus == '01'"
-            v-hasPermi="['service:contract:change']"
-          >启用</el-button>
-           <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-view"
-            @click="handleInfo(scope.row)"
-            v-hasPermi="['service:contract:query']"
-          >详情</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDel(scope.row)"
-            v-if="scope.row.zfcStatus == '01'"
-            v-hasPermi="['service:contract:delete']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
+        <el-table-column label="序号" type="index" width="50" align="center">
+            <template slot-scope="scope">
+                <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
+            </template>
+        </el-table-column>
+        <el-table-column label="资金方" align="center" prop="scyName" :show-overflow-tooltip="true" v-if="uncheckList.scyName" />
+        <el-table-column label="合同模板名称" align="center" prop="zfcName" :show-overflow-tooltip="true" v-if="uncheckList.zfcName" />
+        <el-table-column label="合同模板状态" align="center" prop="zfcStatus" width='120px' :formatter="statusFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcStatus" />
+        <el-table-column label="签署节点" align="center" prop="zfcNode" :formatter="nodeFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcNode" />
+        <!-- <el-table-column label="签署方" align="center" prop="zfcSubject" :formatter="subjectFormat" :show-overflow-tooltip="true" v-if="uncheckList.zfcSubject"/> -->
+        <el-table-column label="创建人" align="center" prop="nickName" :show-overflow-tooltip="true" v-if="uncheckList.nickName" />
+        <el-table-column label="创建时间" align="center" prop="createTime" :show-overflow-tooltip="true" v-if="uncheckList.createTime" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width='200px'>
+            <template slot-scope="scope">
+                <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-if="scope.row.zfcStatus == '01'" v-hasPermi="['service:contract:edit']">修改</el-button>
+                <el-button size="mini" type="text" icon="el-icon-edit" @click="handleChange(scope.row)" v-if="scope.row.zfcStatus == '00'" v-hasPermi="['service:contract:change']">停用</el-button>
+                <el-button size="mini" type="text" icon="el-icon-edit" @click="handleChange(scope.row)" v-if="scope.row.zfcStatus == '01'" v-hasPermi="['service:contract:change']">启用</el-button>
+                <el-button size="mini" type="text" icon="el-icon-view" @click="handleInfo(scope.row)" v-hasPermi="['service:contract:query']">详情</el-button>
+                <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDel(scope.row)" v-if="scope.row.zfcStatus == '01'" v-hasPermi="['service:contract:delete']">删除</el-button>
+            </template>
+        </el-table-column>
     </el-table>
-    
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-  </div>
+
+    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+</div>
 </template>
 
 <script>
-import { listContract,changeState,delContract} from "@/api/service/contract/contract";
-import ColumnSetting from "../../../components/Table/columnSetting.vue";
-import { columnQuery, columnfilter } from "@/api/common/columnSetting";
+import {
+    listContract,
+    changeState,
+    delContract
+} from "@/api/service/contract/contract";
+import ColumnSetting from "../../../components/Table/columnSetting.vue";
+import {
+    columnQuery,
+    columnfilter
+} from "@/api/common/columnSetting";
 import Cookies from 'js-cookie'
 export default {
-  name: "contract",
-  components: {
-    ColumnSetting 
-  },
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      contractList:[],
-      statusOptions:[],
-      // 总条数
-      total: 0,
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        zfcName: null,
-        scyName: null,
-        zfcStatus: null,
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        //  pptName:[
-        //   { required: true, message: "项目类型不能为空", trigger: "blur" },
-        // ]
-      },
-      tableList: [
-        {
-          label: "scyName",
-          value: "资金渠道"
-        },
-        {
-          label: "zfcName",
-          value: "合同模板名称"
-        },
-        {
-          label: "zfcStatus",
-          value: "合同模板状态"
-        },
-        {
-          label: "zfcNode",
-          value: "签署节点"
-        },
-//         {
-//           label: "zfcSubject",
-//           value: "签署方"
-//         },
-        {
-          label: "nickName",
-          value: "创建人"
-        },
-        {
-          label: "createTime",
-          value: "创建时间"
-        },
-      ],
-      checkList: [], //筛选列选中的数据列表--显示隐藏列用
-      uncheckList: {}, //控制筛选列显示隐藏--显示隐藏列用
-      selfDom: this,
-      tableId: "/service/contract/list",
-    };
-  },
-  created() {
-    this.getList();
-    this.getDicts("zc_zfc_status").then((response) => {
-      this.statusOptions = response.data;
-    });
-    this.getDicts("zc_zfc_node").then((response) => {
-      this.nodeOptions = response.data;
-    });
-    this.getDicts("zc_zfc_subject").then((response) => {
-      this.subjectOptions = response.data;
-    });
-  },
-  activated(){
-    this.getList();
-  },
-  mounted() {
-    this.columnQuery();
-  },
-  methods: {
-    /** 查询合同列表 */
-    getList() {
-      this.loading = true;
-      listContract(this.queryParams).then(response => {
-        this.contractList = response.data.records;
-        this.total = response.data.total;
-        this.loading = false;
-      });
-    },
-    
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-       
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
+    name: "contract",
+    components: {
+        ColumnSetting
     },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-     /*  this.ids = selection.map(item => item.ptcId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length */
+    data() {
+        return {
+            // 遮罩层
+            loading: true,
+            // 选中数组
+            ids: [],
+            // 非单个禁用
+            single: true,
+            // 非多个禁用
+            multiple: true,
+            // 显示搜索条件
+            showSearch: true,
+            contractList: [],
+            statusOptions: [],
+            // 总条数
+            total: 0,
+            // 弹出层标题
+            title: "",
+            // 是否显示弹出层
+            open: false,
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                zfcName: null,
+                scyName: null,
+                zfcStatus: null,
+            },
+            // 表单参数
+            form: {},
+            // 表单校验
+            rules: {
+                //  pptName:[
+                //   { required: true, message: "项目类型不能为空", trigger: "blur" },
+                // ]
+            },
+            tableList: [{
+                    label: "scyName",
+                    value: "资金渠道"
+                },
+                {
+                    label: "zfcName",
+                    value: "合同模板名称"
+                },
+                {
+                    label: "zfcStatus",
+                    value: "合同模板状态"
+                },
+                {
+                    label: "zfcNode",
+                    value: "签署节点"
+                },
+                //         {
+                //           label: "zfcSubject",
+                //           value: "签署方"
+                //         },
+                {
+                    label: "nickName",
+                    value: "创建人"
+                },
+                {
+                    label: "createTime",
+                    value: "创建时间"
+                },
+            ],
+            checkList: [], //筛选列选中的数据列表--显示隐藏列用
+            uncheckList: {}, //控制筛选列显示隐藏--显示隐藏列用
+            selfDom: this,
+            tableId: "/service/contract/list",
+        };
     },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.resetForm("queryForm");
-      Cookies.set("/contract/addContract/", this.$route.fullPath);
-      this.$router.push({path:"/contract/addContract/"});
+    created() {
+        this.getList();
+        this.getDicts("zc_zfc_status").then((response) => {
+            this.statusOptions = response.data;
+        });
+        this.getDicts("zc_zfc_node").then((response) => {
+            this.nodeOptions = response.data;
+        });
+        this.getDicts("zc_zfc_subject").then((response) => {
+            this.subjectOptions = response.data;
+        });
     },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      const zfcId = row.zfcId
-      this.resetForm("queryForm");
-      Cookies.set("/contract/editContract/"+zfcId+"/", this.$route.fullPath);
-      this.$router.push({path:"/contract/editContract/"+zfcId+"/"});
+    activated() {
+        this.getList();
     },
-    /** 详情按钮操作 */
-    handleInfo(row) {
-      const zfcId = row.zfcId
-      this.resetForm("queryForm");
-      Cookies.set("/contract/detailContract/"+zfcId+"/", this.$route.fullPath);
-      this.$router.push({path:"/contract/detailContract/"+zfcId+"/"});
+    mounted() {
+        this.columnQuery();
     },
-    /** 删除按钮操作 */
-    handleDel(row) {
-      const zfcId = row.zfcId
-      const zfcName = row.zfcName
-      this.$confirm(
-                '是否确认删除合同模板名为"' + zfcName + '"的数据项?',
-                "警告",
-                {
-                    confirmButtonText: "确定",
-                    cancelButtonText: "取消",
-                    type: "warning",
-                }
-            )
+    methods: {
+        /** 查询合同列表 */
+        getList() {
+            this.loading = true;
+            listContract(this.queryParams).then(response => {
+                this.contractList = response.data.records;
+                this.total = response.data.total;
+                this.loading = false;
+            });
+        },
+
+        // 取消按钮
+        cancel() {
+            this.open = false;
+            this.reset();
+        },
+        // 表单重置
+        reset() {
+            this.form = {
+
+            };
+            this.resetForm("form");
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+        // 多选框选中数据
+        handleSelectionChange(selection) {
+            /*  this.ids = selection.map(item => item.ptcId)
+             this.single = selection.length!==1
+             this.multiple = !selection.length */
+        },
+        /** 新增按钮操作 */
+        handleAdd() {
+            this.reset();
+            this.resetForm("queryForm");
+            Cookies.set("/contract/addContract/", this.$route.fullPath);
+            this.$router.push({
+                path: "/contract/addContract/"
+            });
+        },
+        /** 修改按钮操作 */
+        handleUpdate(row) {
+            const zfcId = row.zfcId
+            this.resetForm("queryForm");
+            Cookies.set("/contract/editContract/" + zfcId + "/", this.$route.fullPath);
+            this.$router.push({
+                path: "/contract/editContract/" + zfcId + "/"
+            });
+        },
+        /** 详情按钮操作 */
+        handleInfo(row) {
+            const zfcId = row.zfcId
+            this.resetForm("queryForm");
+            Cookies.set("/contract/detailContract/" + zfcId + "/", this.$route.fullPath);
+            this.$router.push({
+                path: "/contract/detailContract/" + zfcId + "/"
+            });
+        },
+        /** 删除按钮操作 */
+        handleDel(row) {
+            const zfcId = row.zfcId
+            const zfcName = row.zfcName
+            this.$confirm(
+                    '是否确认删除合同模板名为"' + zfcName + '"的数据项?',
+                    "警告", {
+                        confirmButtonText: "确定",
+                        cancelButtonText: "取消",
+                        type: "warning",
+                    }
+                )
                 .then(function () {
                     return delContract(zfcId);
                 })
@@ -309,104 +254,79 @@ export default {
                         message: "已取消删除",
                     });
                 });
-    },
-    /** 启用按钮操作 */
-     handleChange(row) {
-           let text = row.zfcStatus === "01" ? "启用合同" : "停用合同";
+        },
+        /** 启用按钮操作 */
+        handleChange(row) {
+            let text = row.zfcStatus === "01" ? "启用合同" : "停用合同";
             this.$confirm(
-                "确认要" + text + '"' + row.zfcName + '"吗?',
-                "警告",
-                {
-                    confirmButtonText: "确定",
-                    cancelButtonText: "取消",
-                    type: "warning",
-                }
-            )
+                    "确认要" + text + '"' + row.zfcName + '"吗?',
+                    "警告", {
+                        confirmButtonText: "确定",
+                        cancelButtonText: "取消",
+                        type: "warning",
+                    }
+                )
                 .then(function () {
                     return changeState(row.zfcId);
                 })
                 .then(() => {
-                  this.getList();
-                    this.msgSuccess(text + '"' + row.zfcName +'"'+ "成功");
+                    this.getList();
+                    this.msgSuccess(text + '"' + row.zfcName + '"' + "成功");
                 })
                 .catch(function () {
-                    
+
                 });
-     },
-    //合同模板状态字典反显
-    statusFormat(row, column) {
-      return this.selectDictLabel(this.statusOptions, row.zfcStatus);
-    },
-    //签署节点字典反显
-    nodeFormat(row, column) {
-      var zfcNodes = row.zfcNode.split(",");
-      var zfcNodeList='';
-      for(var i=0;i<zfcNodes.length;i++){
-        zfcNodeList += this.selectDictLabel(this.nodeOptions, zfcNodes[i]);
-        if(i < zfcNodes.length-1){
-          zfcNodeList +=",";
-        }
-      }
-      return zfcNodeList;
-    },
-     //签署节点字典反显
-    subjectFormat(row, column) {
-      return this.selectDictLabel(this.subjectOptions, row.zfcSubject);
-    },
-    //获取当前客户是否之前设置过列展示隐藏
-    columnQuery() {
-      //获取页面路径
-      var psfPagePath = window.location.pathname;
+        },
+        //合同模板状态字典反显
+        statusFormat(row, column) {
+            return this.selectDictLabel(this.statusOptions, row.zfcStatus);
+        },
+        //签署节点字典反显
+        nodeFormat(row, column) {
+            var zfcNodes = row.zfcNode.split(",");
+            var zfcNodeList = '';
+            for (var i = 0; i < zfcNodes.length; i++) {
+                zfcNodeList += this.selectDictLabel(this.nodeOptions, zfcNodes[i]);
+                if (i < zfcNodes.length - 1) {
+                    zfcNodeList += ",";
+                }
+            }
+            return zfcNodeList;
+        },
+        //签署节点字典反显
+        subjectFormat(row, column) {
+            return this.selectDictLabel(this.subjectOptions, row.zfcSubject);
+        },
+        //获取当前客户是否之前设置过列展示隐藏
+        columnQuery() {
+            //获取页面路径
+            var psfPagePath = window.location.pathname;
 
-      //用请求后台的url作为唯一标识
-      var psfTableName = this.tableId;
-      var columnForm = {};
-      columnForm.psfPagePath = psfPagePath;
-      columnForm.psfTableName = psfTableName;
-      columnQuery(columnForm).then(response => {
-        if (response.data && response.data.psfShowData) {
-          this.checkList = response.data.psfShowData;
-        }
-        this.filter();
-      });
-    },
-    //控制隐藏显示的函数
-    filter(checkList) {
-      if (!!checkList) {
-        this.checkList = checkList;
-      }
-      columnfilter(this.selfDom);
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      /* this.download('base/taxCode/export', {
-        ...this.queryParams
-      }, `base_taxCode.xlsx`) */
+            //用请求后台的url作为唯一标识
+            var psfTableName = this.tableId;
+            var columnForm = {};
+            columnForm.psfPagePath = psfPagePath;
+            columnForm.psfTableName = psfTableName;
+            columnQuery(columnForm).then(response => {
+                if (response.data && response.data.psfShowData) {
+                    this.checkList = response.data.psfShowData;
+                }
+                this.filter();
+            });
+        },
+        //控制隐藏显示的函数
+        filter(checkList) {
+            if (!!checkList) {
+                this.checkList = checkList;
+            }
+            columnfilter(this.selfDom);
+        },
+        /** 导出按钮操作 */
+        handleExport() {
+            /* this.download('base/taxCode/export', {
+              ...this.queryParams
+            }, `base_taxCode.xlsx`) */
+        }
     }
-  }
 };
 </script>
-
-<style lang="scss">
-.zap-table-search{
-  padding-top: 12px;
-  background-color: #ffffff;
-}
-.zap-table-search__form{
-  display: flex;
-  align-items: center;
-  min-height: 90px;
-  .el-form-item--medium.el-form-item{
-    margin-bottom: 0;
-  }
-  .el-form-item__label {
-    line-height: 40px;
-    font-size: 14px;
-    color: #333333;
-  }
-  .el-input--small .el-input__inner{
-    height: 40px;
-    line-height: 40px;
-  }
-}
-</style>

front-vue/src/views/service/invoice/invoice.vue

@@ -1,412 +1,349 @@
 <template>
-  <div class="app-container">
-       <el-card class="fiche">
-          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList">收起</right-toolbar>
-          <span style="margin-bottom: 10px;color:#333333;font:14px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial,sans-serif">所选条件:</span>
-         <div  style="float: right;margin-right:1%">
-            <el-button type="cyan"  icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"  style="float: ;">重置</el-button>
-                         <column-setting :checkList="checkList" :tableList="tableList" :selfDom="selfDom" :tableId="tableId" style="margin-left:5px"></column-setting>
-
-         </div>
-         <hr  style="margin-top: 16px;">
-        <el-form :model="queryParams" ref="queryForm" :inline="true" v-if="showSearch" label-width="68px">
-            <el-form-item label="发票编码" prop="ziiNo">
-                <el-input
-                v-model.trim="queryParams.ziiNo"
-                placeholder="请输入发票编码"
-                clearable
-                size="small"
-                maxlength="25"
-                @keyup.enter.native="handleQuery"
-                />
-        </el-form-item>
-        <el-form-item label="购方识别" prop="ziiPurchaserNo">
-            <el-input
-            v-model.trim="queryParams.ziiPurchaserNo"
-            placeholder="请输入购方识别码"
-            clearable
-            size="small"
-            maxlength="25"
-            @keyup.enter.native="handleQuery"
-            />
-        </el-form-item>
-        <el-form-item label="销方识别" prop="ziiSellerNo">
-            <el-input
-            v-model.trim="queryParams.ziiSellerNo"
-            placeholder="请输入销方识别码"
-            clearable
-            size="small"
-            maxlength="25"
-            @keyup.enter.native="handleQuery"
-            />
-        </el-form-item>
-        <el-form-item label="开票日期" prop="ziiDate">
-            <el-date-picker  size="small"
-            v-model="queryParams.ziiDate"
-            style="width: 240px" 
-            unlink-panels
-            value-format="yyyy-MM-dd" 
-            type="daterange" 
-            range-separator="-" 
-            start-placeholder="开始日期" 
-            end-placeholder="结束日期">
-            </el-date-picker>
-        </el-form-item>
-        <el-form-item label="发票类型" prop="ziiType">
-          <el-select v-model="queryParams.ziiType" placeholder="请选择发票类型" clearable size="small">
-              <el-option
-                v-for="dict in typeOptions"
-                :key="dict.dictValue"
-                :label="dict.dictLabel"
-                :value="dict.dictValue"
-              />
-            </el-select>
-        </el-form-item>
-        <el-form-item label="购方" prop="ziiPurchaserName">
-            <el-input
-            v-model.trim="queryParams.ziiPurchaserName"
-            placeholder="请输入购方名称"
-            clearable
-            size="small"
-            maxlength="25"
-            @keyup.enter.native="handleQuery"
-            />
-        </el-form-item>
-        <el-form-item label="销方" prop="ziiSellerName">
-            <el-input
-            v-model.trim="queryParams.ziiSellerName"
-            placeholder="请输入销方名称"
-            clearable
-            size="small"
-            maxlength="25"
-            @keyup.enter.native="handleQuery"
-            />
-        </el-form-item>
-    </el-form>
- </el-card>
-    <el-table v-loading="loading" :data="infList" @selection-change="handleSelectionChange" border>
-     <el-table-column label="序号" type="index" width="50" align="center">
-        <template slot-scope="scope">
-          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="发票编号" align="center" prop="ziiNo" v-if="uncheckList.ziiNo" :show-overflow-tooltip="true"/>
-      <el-table-column label="购方"  align="center" prop="ziiPurchaserName"  v-if="uncheckList.ziiPurchaserName" :show-overflow-tooltip="true"/>
-      <el-table-column label="购方识别码"  align="center" prop="ziiPurchaserNo"  v-if="uncheckList.ziiPurchaserNo" :show-overflow-tooltip="true"/>
-      <el-table-column label="销方"  align="center" prop="ziiSellerName"  v-if="uncheckList.ziiSellerName" :show-overflow-tooltip="true"/>
-      <el-table-column label="销方识别码" align="center" prop="ziiSellerNo"   v-if="uncheckList.ziiSellerNo" :show-overflow-tooltip="true"/>
-      <el-table-column label="开票日期" align="center" prop="ziiDate" :show-overflow-tooltip="true" v-if="uncheckList.ziiDate"/>
-      <el-table-column label="开票金额" align="center" :formatter="moneyFormat" prop="ziiAmount" :show-overflow-tooltip="true" v-if="uncheckList.ziiAmount"/>
-      <el-table-column label="合计金额" align="center" :formatter="moneyFormat" prop="ziiTotalAmount" :show-overflow-tooltip="true" v-if="uncheckList.ziiTotalAmount"/>
-      <el-table-column label="发票类型" :formatter="typeFormat" align="center" prop="ziiType" :show-overflow-tooltip="true" v-if="uncheckList.ziiType"/>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width='300' fixed="right" >
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-view"
-            @click="handleDetail(scope.row)"
-            v-hasPermi="['invoice:invoice:query']"
-          >详情</el-button>
-          <el-button
-            :disabled="!scope.row.ziiFile"
-            style="font-size:12px"
-            type="text"
-            icon="el-icon-download"
-            @click="handleDownload(scope.row)"
-            v-hasPermi="['invoice:invoice:download']"
-          >下载</el-button>
-        </template>
-      </el-table-column>
+<div class="app-container zap-main">
+    <el-row class="zap-table-search">
+        <div class="zap-padding-end">
+            <right-toolbar class="zap-right-toolbar" :showSearch.sync="showSearch" @queryTable="getList">收起</right-toolbar>
+            <span class="zap-padding-start zap-font-title">所选条件:</span>
+            <div style="float: right;margin-right:1%">
+                <el-button type="cyan" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+                <el-button icon="el-icon-refresh" @click="resetQuery" style="float: ;">重置</el-button>
+                <column-setting class="zap-column-setting" :checkList="checkList" :tableList="tableList" :selfDom="selfDom" :tableId="tableId"></column-setting>
+            </div>
+            <hr style="margin-top: 16px;">
+            <el-form :model="queryParams" ref="queryForm" :inline="true" v-if="showSearch" label-width="68px">
+                <el-form-item label="发票编码" prop="ziiNo" size="large">
+                    <el-input v-model.trim="queryParams.ziiNo" placeholder="请输入发票编码" clearable maxlength="25" @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="购方识别" prop="ziiPurchaserNo"  size="large">
+                    <el-input v-model.trim="queryParams.ziiPurchaserNo" placeholder="请输入购方识别码" clearable maxlength="25" @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="销方识别" prop="ziiSellerNo"  size="large">
+                    <el-input v-model.trim="queryParams.ziiSellerNo" placeholder="请输入销方识别码" clearable maxlength="25" @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="开票日期" prop="ziiDate"  size="large">
+                    <el-date-picker v-model="queryParams.ziiDate" unlink-panels value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="发票类型" prop="ziiType"  size="large">
+                    <el-select v-model="queryParams.ziiType" placeholder="请选择发票类型" clearable>
+                        <el-option v-for="dict in typeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="购方" prop="ziiPurchaserName"  size="large">
+                    <el-input v-model.trim="queryParams.ziiPurchaserName" placeholder="请输入购方名称" clearable maxlength="25" @keyup.enter.native="handleQuery" />
+                </el-form-item>
+                <el-form-item label="销方" prop="ziiSellerName"  size="large">
+                    <el-input v-model.trim="queryParams.ziiSellerName" placeholder="请输入销方名称" clearable maxlength="25" @keyup.enter.native="handleQuery" />
+                </el-form-item>
+            </el-form>
+        </div>
+    </el-row>
+    <el-row class="zap-table zap-margin-top zap-padding-top zap-bg">
+      <el-table  v-loading="loading" :data="infList" @selection-change="handleSelectionChange" stripe>
+        <el-table-column label="序号" type="index" width="50" align="center">
+            <template slot-scope="scope">
+                <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
+            </template>
+        </el-table-column>
+        <el-table-column label="发票编号" align="center" prop="ziiNo" v-if="uncheckList.ziiNo" :show-overflow-tooltip="true" />
+        <el-table-column label="购方" align="center" prop="ziiPurchaserName" v-if="uncheckList.ziiPurchaserName" :show-overflow-tooltip="true" />
+        <el-table-column label="购方识别码" align="center" prop="ziiPurchaserNo" v-if="uncheckList.ziiPurchaserNo" :show-overflow-tooltip="true" />
+        <el-table-column label="销方" align="center" prop="ziiSellerName" v-if="uncheckList.ziiSellerName" :show-overflow-tooltip="true" />
+        <el-table-column label="销方识别码" align="center" prop="ziiSellerNo" v-if="uncheckList.ziiSellerNo" :show-overflow-tooltip="true" />
+        <el-table-column label="开票日期" align="center" prop="ziiDate" :show-overflow-tooltip="true" v-if="uncheckList.ziiDate" />
+        <el-table-column label="开票金额" align="center" :formatter="moneyFormat" prop="ziiAmount" :show-overflow-tooltip="true" v-if="uncheckList.ziiAmount" />
+        <el-table-column label="合计金额" align="center" :formatter="moneyFormat" prop="ziiTotalAmount" :show-overflow-tooltip="true" v-if="uncheckList.ziiTotalAmount" />
+        <el-table-column label="发票类型" :formatter="typeFormat" align="center" prop="ziiType" :show-overflow-tooltip="true" v-if="uncheckList.ziiType" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width='300' fixed="right">
+            <template slot-scope="scope">
+                <el-button size="mini" type="text" icon="el-icon-view" @click="handleDetail(scope.row)" v-hasPermi="['invoice:invoice:query']">详情</el-button>
+                <el-button :disabled="!scope.row.ziiFile" style="font-size:12px" type="text" icon="el-icon-download" @click="handleDownload(scope.row)" v-hasPermi="['invoice:invoice:download']">下载</el-button>
+            </template>
+        </el-table-column>
     </el-table>
-    
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :before-close = "cancel">
-      <el-form ref="form" :disabled="true" :model="form"  v-if="open" label-width="110px" class="demo-form-inline" :inline="true">
-        <el-form-item label="发票编号" prop="ziiNo">
-          <el-input v-model.trim="form.ziiNo"  maxlength="30" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="购方" prop="ziiPurchaserName">
-          <el-input v-model.trim="form.ziiPurchaserName"  maxlength="30" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="购方识别码" prop="ziiPurchaserNo">
-          <el-input v-model.trim="form.ziiPurchaserNo"  maxlength="30" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="销方" prop="ziiSellerName">
-          <el-input v-model.trim="form.ziiSellerName"  maxlength="30" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="销方识别码" prop="ziiSellerNo">
-          <el-input v-model.trim="form.ziiSellerNo"  maxlength="30" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="开票日期" prop="ziiDate">
-          <el-date-picker clearable size="small" style="width: 200px"
-            v-model="form.ziiDate"
-            type="date"
-            value-format="yyyy-MM-dd"
-            >
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item label="开票金额" prop="ziiAmount">
-            <el-input v-model="form.ziiAmount" :max="9999999999.99" :precision="2" style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="合计金额" prop="ziiTotalAmount">
-            <el-input v-model="form.ziiTotalAmount" :max="9999999999.99" :precision="2" style="width: 200px"/>
-        </el-form-item>
-        <el-form-item label="发票类型" prop="ziiType">
-          <el-input v-model.trim="form.ziiType"   style="width: 200px"/>
-        </el-form-item>
-      </el-form>  
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="cancel">取 消</el-button>
-      </div>
+    </el-row>
+
+    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :before-close="cancel">
+        <el-form ref="form" :disabled="true" :model="form" v-if="open" label-width="110px" class="demo-form-inline" :inline="true">
+            <el-form-item label="发票编号" prop="ziiNo" size="large">
+                <el-input v-model.trim="form.ziiNo" maxlength="30" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="购方" prop="ziiPurchaserName" size="large">
+                <el-input v-model.trim="form.ziiPurchaserName" maxlength="30" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="购方识别码" prop="ziiPurchaserNo" size="large">
+                <el-input v-model.trim="form.ziiPurchaserNo" maxlength="30" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="销方" prop="ziiSellerName" size="large">
+                <el-input v-model.trim="form.ziiSellerName" maxlength="30" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="销方识别码" prop="ziiSellerNo" size="large">
+                <el-input v-model.trim="form.ziiSellerNo" maxlength="30" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="开票日期" prop="ziiDate" size="large">
+                <el-date-picker clearable style="width: 200px" v-model="form.ziiDate" type="date" value-format="yyyy-MM-dd">
+                </el-date-picker>
+            </el-form-item>
+            <el-form-item label="开票金额" prop="ziiAmount" size="large">
+                <el-input v-model="form.ziiAmount" :max="9999999999.99" :precision="2" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="合计金额" prop="ziiTotalAmount" size="large">
+                <el-input v-model="form.ziiTotalAmount" :max="9999999999.99" :precision="2" style="width: 200px" />
+            </el-form-item>
+            <el-form-item label="发票类型" prop="ziiType" size="large">
+                <el-input v-model.trim="form.ziiType" style="width: 200px" />
+            </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+            <el-button @click="cancel">取 消</el-button>
+        </div>
     </el-dialog>
-  </div>
+</div>
 </template>
 
 <script>
-import { listInvoice,getInvoiceDetail} from "@/api/service/invoice/invoice";
+import {
+    listInvoice,
+    getInvoiceDetail
+} from "@/api/service/invoice/invoice";
 import Editor from '@/components/Editor';
-import {columnQuery,columnfilter} from "@/api/common/columnSetting";
+import {
+    columnQuery,
+    columnfilter
+} from "@/api/common/columnSetting";
 import ColumnSetting from '../../../components/Table/columnSetting.vue';
-import {getToken} from "@/utils/auth";
+import {
+    getToken
+} from "@/utils/auth";
 export default {
-  name: "invoice",
-  components: {
-    Editor,
-    ColumnSetting 
-  },
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-       pageNum: 1,
-        pageSize: 10,
-        ziiId: null,
-        ziiNo:null,
-        ziiDate:[],
-        ziiAmount:null,
-        ziiType:null,
-        ziiPurchaserNo:null,
-        ziiSellerNo:null,
-        ziiTotalAmount:null
-      },
-      //发票数据
-      infList:[],
-      // 表单参数
-      form: {
-      },
-      //发票类型
-      typeOptions: [],
-      //筛选按钮的数据列表，与table表头的数据一致 --显示隐藏列用
-      tableList: [
-            {
-              label: 'ziiNo',
-              value: '发票编号'
-            },
-            {
-              label: 'ziiPurchaserName',
-              value: '购方'
-            },
-            {
-              label: 'ziiPurchaserNo',
-              value: '购方识别码'
-            },
-            {
-              label: 'ziiSellerName',
-              value: '销方'
-            },
-            {
-              label: 'ziiSellerNo',
-              value: '销方识别码'
-            },
-            {
-              label: 'ziiDate',
-              value: '开票日期'
-            },
-            {
-              label: 'ziiAmount',
-              value: '开票金额'
-            },
-            {
-              label: 'ziiTotalAmount',
-              value: '合计金额'
+    name: "invoice",
+    components: {
+        Editor,
+        ColumnSetting
+    },
+    data() {
+        return {
+            // 遮罩层
+            loading: true,
+            // 选中数组
+            ids: [],
+            // 非单个禁用
+            single: true,
+            // 非多个禁用
+            multiple: true,
+            // 显示搜索条件
+            showSearch: true,
+            // 总条数
+            total: 0,
+            // 弹出层标题
+            title: "",
+            // 是否显示弹出层
+            open: false,
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                ziiId: null,
+                ziiNo: null,
+                ziiDate: [],
+                ziiAmount: null,
+                ziiType: null,
+                ziiPurchaserNo: null,
+                ziiSellerNo: null,
+                ziiTotalAmount: null
             },
-            {
-              label: 'ziiType',
-              value: '发票类型'
-            }
+            //发票数据
+            infList: [],
+            // 表单参数
+            form: {},
+            //发票类型
+            typeOptions: [],
+            //筛选按钮的数据列表，与table表头的数据一致 --显示隐藏列用
+            tableList: [{
+                    label: 'ziiNo',
+                    value: '发票编号'
+                },
+                {
+                    label: 'ziiPurchaserName',
+                    value: '购方'
+                },
+                {
+                    label: 'ziiPurchaserNo',
+                    value: '购方识别码'
+                },
+                {
+                    label: 'ziiSellerName',
+                    value: '销方'
+                },
+                {
+                    label: 'ziiSellerNo',
+                    value: '销方识别码'
+                },
+                {
+                    label: 'ziiDate',
+                    value: '开票日期'
+                },
+                {
+                    label: 'ziiAmount',
+                    value: '开票金额'
+                },
+                {
+                    label: 'ziiTotalAmount',
+                    value: '合计金额'
+                },
+                {
+                    label: 'ziiType',
+                    value: '发票类型'
+                }
             ],
-      checkList: [],//筛选列选中的数据列表--显示隐藏列用
-      uncheckList: {},//控制筛选列显示隐藏--显示隐藏列用
-      selfDom : this,
-      tableId:"/sc-service/ownInvoice/list",
-    };
-  },
-  created() {
-    this.getDicts("zc_invoice_type").then(response => {
-      this.typeOptions = response.data;
-    });
-    this.getList();
-  },
-  activated () {
-    this.getList();
-  },  
-  mounted() {
-    this.columnQuery();
-  },
-  methods: {
-    //获取当前客户是否之前设置过列展示隐藏
-    columnQuery(){
-        //获取页面路径
-        var psfPagePath = window.location.pathname;
-        //用请求后台的url作为唯一标识
-        var psfTableName = this.tableId;
-        var columnForm = {};
-        columnForm.psfPagePath = psfPagePath;
-        columnForm.psfTableName = psfTableName;
-        columnQuery(columnForm).then(response => {
-         if(response.data && response.data.psfShowData){
-                this.checkList = response.data.psfShowData;
-         }
-         this.filter();
-      })
-    },
-    //控制隐藏显示的函数
-    filter(checkList) {
-      if (!!checkList) {
-        this.checkList = checkList;
-      }
-      columnfilter(this.selfDom);
-    },
-    //文件下载
-    handleDownload(row){
-        const pfiUrl = row.pfiUrl;
-        if(pfiUrl != null && pfiUrl != ''){
-        window.open(pfiUrl +"/"+ getToken());
-        }else{
-          this.$message({
-          message: '该附件不存在！',
-          type: 'warning'
-          });
-          return;
-        }
-    },
-    /** 查询收开票信息列表 */
-    getList() {
-      this.loading = true;
-      listInvoice(this.queryParams).then(response => {
-        this.infList = response.data.records;
-        this.total = response.data.total;
-        this.loading = false;
-      });
+            checkList: [], //筛选列选中的数据列表--显示隐藏列用
+            uncheckList: {}, //控制筛选列显示隐藏--显示隐藏列用
+            selfDom: this,
+            tableId: "/sc-service/ownInvoice/list",
+        };
     },
-    //格式化类型
-    typeFormat(row, column) {
-      return this.selectDictLabel(this.typeOptions, row.ziiType);
+    created() {
+        this.getDicts("zc_invoice_type").then(response => {
+            this.typeOptions = response.data;
+        });
+        this.getList();
     },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
+    activated() {
+        this.getList();
     },
-    /** 查看按钮操作 */
-    handleDetail(row) {
-      this.reset();
-      const ziiId = row.ziiId || this.ziiId;
-      getInvoiceDetail(ziiId).then(response => {
-          this.open = true;
-          if(response.data){
-            this.form = response.data[0];
-            this.form.ziiAmount = this.amtFormat(this.form.ziiAmount);
-            this.form.ziiTotalAmount = this.amtFormat(this.form.ziiTotalAmount);
-            //格式化发票类型
-            this.form.ziiType = this.selectDictLabel(this.typeOptions, this.form.ziiType);
-          }
-      });
-     
+    mounted() {
+        this.columnQuery();
     },
-    // 表单重置
-    reset() {
-      this.form = {
-        ziiId: null,
-        ziiNo:null,
-        ziiDate:[],
-        ziiAmount:null,
-        ziiType:null,
-        ziiPurchaserNo:null,
-        ziiSellerNo:null,
-        ziiTotalAmount:null
-      };
-      this.resetForm("form");
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.cifId)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    //列表格式化金额
-    moneyFormat(row, column, cellValue) {
-        if(cellValue == null || cellValue== undefined || cellValue == ''){
-            cellValue = '0.00'
-        }
-        cellValue += '';
-        if (!cellValue.includes('.')) {
-            cellValue += '.00';
+    methods: {
+        //获取当前客户是否之前设置过列展示隐藏
+        columnQuery() {
+            //获取页面路径
+            var psfPagePath = window.location.pathname;
+            //用请求后台的url作为唯一标识
+            var psfTableName = this.tableId;
+            var columnForm = {};
+            columnForm.psfPagePath = psfPagePath;
+            columnForm.psfTableName = psfTableName;
+            columnQuery(columnForm).then(response => {
+                if (response.data && response.data.psfShowData) {
+                    this.checkList = response.data.psfShowData;
+                }
+                this.filter();
+            })
+        },
+        //控制隐藏显示的函数
+        filter(checkList) {
+            if (!!checkList) {
+                this.checkList = checkList;
+            }
+            columnfilter(this.selfDom);
+        },
+        //文件下载
+        handleDownload(row) {
+            const pfiUrl = row.pfiUrl;
+            if (pfiUrl != null && pfiUrl != '') {
+                window.open(pfiUrl + "/" + getToken());
+            } else {
+                this.$message({
+                    message: '该附件不存在！',
+                    type: 'warning'
+                });
+                return;
+            }
+        },
+        /** 查询收开票信息列表 */
+        getList() {
+            this.loading = true;
+            listInvoice(this.queryParams).then(response => {
+                this.infList = response.data.records;
+                this.total = response.data.total;
+                this.loading = false;
+            });
+        },
+        //格式化类型
+        typeFormat(row, column) {
+            return this.selectDictLabel(this.typeOptions, row.ziiType);
+        },
+        // 取消按钮
+        cancel() {
+            this.open = false;
+            this.reset();
+        },
+        /** 查看按钮操作 */
+        handleDetail(row) {
+            this.reset();
+            const ziiId = row.ziiId || this.ziiId;
+            getInvoiceDetail(ziiId).then(response => {
+                this.open = true;
+                if (response.data) {
+                    this.form = response.data[0];
+                    this.form.ziiAmount = this.amtFormat(this.form.ziiAmount);
+                    this.form.ziiTotalAmount = this.amtFormat(this.form.ziiTotalAmount);
+                    //格式化发票类型
+                    this.form.ziiType = this.selectDictLabel(this.typeOptions, this.form.ziiType);
+                }
+            });
+
+        },
+        // 表单重置
+        reset() {
+            this.form = {
+                ziiId: null,
+                ziiNo: null,
+                ziiDate: [],
+                ziiAmount: null,
+                ziiType: null,
+                ziiPurchaserNo: null,
+                ziiSellerNo: null,
+                ziiTotalAmount: null
+            };
+            this.resetForm("form");
+        },
+        // 多选框选中数据
+        handleSelectionChange(selection) {
+            this.ids = selection.map(item => item.cifId)
+            this.single = selection.length !== 1
+            this.multiple = !selection.length
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+        //列表格式化金额
+        moneyFormat(row, column, cellValue) {
+            if (cellValue == null || cellValue == undefined || cellValue == '') {
+                cellValue = '0.00'
+            }
+            cellValue += '';
+            if (!cellValue.includes('.')) {
+                cellValue += '.00';
+            }
+            return cellValue.replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
+                return $1 + ',';
+            }).replace(/\.$/, '');
+        },
+        //input格式化金额
+        amtFormat(cellValue) {
+            if (cellValue == null || cellValue == undefined || cellValue == '') {
+                cellValue = '0.00'
+            }
+            cellValue += '';
+            if (!cellValue.includes('.')) {
+                cellValue += '.00';
+            }
+            console.log(cellValue);
+            return cellValue.replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
+                return $1 + ',';
+            }).replace(/\.$/, '');
         }
-        return cellValue.replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
-            return $1 + ',';
-          }).replace(/\.$/, '');
-    },
-    //input格式化金额
-    amtFormat(cellValue) {
-      if(cellValue == null || cellValue== undefined || cellValue == ''){
-      cellValue = '0.00'
-      }
-      cellValue += '';
-            if (!cellValue.includes('.')) {
-      cellValue += '.00';
-      }
-      console.log(cellValue);
-            return cellValue.replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
-              return $1 + ',';
-            }).replace(/\.$/, '');
-    }
-    
 
-  }
+    }
 };
-</script>
+</script>