فهرست منبع

财务新增查询页面

lichao 3 سال پیش
والد
کامیت
981f752b09
2فایلهای تغییر یافته به همراه661 افزوده شده و 0 حذف شده
  1. 10 0
      src/api/finance/query.js
  2. 651 0
      src/views/finance/query/index.vue

+ 10 - 0
src/api/finance/query.js

@@ -0,0 +1,10 @@
+import request from '@/utils/request'
+
+// 查询主列表
+export function getList(data) {
+  return request({
+    url: '/warehouseBusiness/warehousebillsfees/queryMenuList',
+    method: 'get',
+    params: data
+  })
+}

+ 651 - 0
src/views/finance/query/index.vue

@@ -0,0 +1,651 @@
+<template>
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryForm"
+      v-show="showSearch"
+      label-width="100px"
+      size="mini"
+    >
+      <el-row>
+        <el-col :xs="12" :sm="6">
+          <el-form-item label="提单号" prop="fMblno">
+            <el-input
+              v-model="queryParams.fMblno"
+              placeholder="请输入提单号"
+              clearable
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :xs="12" :sm="6">
+          <el-form-item label="客户名称" prop="fCorpid">
+            <el-select
+              v-model="queryParams.fCorpid"
+              clearable
+              filterable
+              placeholder="请输入关键词"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="(item, index) in fMblnoOptions"
+                :key="index.fId"
+                :label="item.fName"
+                :value="item.fId"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :xs="12" :sm="6">
+          <el-form-item label="业务日期" prop="fBsdateList">
+            <el-date-picker
+              type="daterange"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              :default-time="['00:00:00', '23:59:59']"
+              clearable
+              unlink-panels
+              style="width: 100%"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              v-model="queryParams.fBsdateList"
+            ></el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :xs="12" :sm="6">
+          <el-form-item label="审核日期" prop="fReviewDateList">
+            <el-date-picker
+              type="daterange"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              :default-time="['00:00:00', '23:59:59']"
+              clearable
+              unlink-panels
+              style="width: 100%"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              v-model="queryParams.fReviewDateList"
+            ></el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-collapse-transition>
+        <div v-show="show">
+          <el-row>
+            <el-col :xs="12" :sm="6">
+              <el-form-item label="收/付" prop="fDc">
+                <el-select
+                  v-model="queryParams.fDc"
+                  clearable
+                  filterable
+                  placeholder="请选择"
+                  style="width: 100%"
+                >
+                  <el-option
+                    label="收"
+                    value="D"
+                  ></el-option>
+                  <el-option
+                    label="付"
+                    value="C"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :xs="12" :sm="6">
+              <el-form-item label="费用状态" prop="fDc">
+                <el-select
+                  v-model="queryParams.fDc"
+                  clearable
+                  filterable
+                  placeholder="请选择"
+                  style="width: 100%"
+                >
+                  <el-option
+                    label="收"
+                    value="D"
+                  ></el-option>
+                  <el-option
+                    label="付"
+                    value="C"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+      </el-collapse-transition>
+    </el-form>
+    <el-row :gutter="10" style="padding-bottom: 10px">
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+        >导出</el-button>
+      </el-col>
+      <div class="tabSetting">
+        <div style="margin-right: 20px">
+          <el-button
+            type="cyan"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleQuery"
+            v-hasPermi="['warehouse:modify:list']"
+          >搜索</el-button
+          >
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+          >重置</el-button
+          >
+          <el-button
+            v-show="show"
+            @click="show = !show"
+            icon="el-icon-arrow-up"
+            size="mini"
+          >展开</el-button
+          >
+          <el-button
+            v-show="!show"
+            @click="show = !show"
+            icon="el-icon-arrow-down"
+            size="mini"
+          >展开</el-button
+          >
+        </div>
+        <right-toolbar
+          :showSearch.sync="showSearch"
+          @queryTable="getList"
+        ></right-toolbar>
+        <div style="margin: 0 12px">
+          <el-button
+            icon="el-icon-setting"
+            size="mini"
+            circle
+            @click="showSetting = !showSetting"
+          ></el-button>
+        </div>
+      </div>
+    </el-row>
+
+    <el-dialog title="自定义列显示" :visible.sync="showSetting" width="700px">
+      <div>配置排序列数据(拖动调整顺序)</div>
+      <div style="margin-left: 17px">
+        <el-checkbox
+          v-model="allCheck"
+          label="全选"
+          @change="allChecked"
+        ></el-checkbox>
+      </div>
+      <div style="padding: 4px; display: flex; justify-content: center">
+        <draggable
+          v-model="setRowList"
+          group="site"
+          animation="300"
+          @start="onStart"
+          @end="onEnd"
+          handle=".indraggable"
+        >
+          <transition-group>
+            <div
+              v-for="item in setRowList"
+              :key="item.surface"
+              class="listStyle"
+            >
+              <div style="width: 500px" class="indraggable">
+                <div class="progress" :style="{ width: item.width + 'px' }">
+                  <el-checkbox
+                    :label="item.name"
+                    v-model="item.checked"
+                    :true-label="0"
+                    :false-label="1"
+                  >{{ item.name }}
+                  </el-checkbox>
+                </div>
+              </div>
+              <el-input-number
+                v-model.number="item.width"
+                controls-position="right"
+                :min="1"
+                :max="500"
+                size="mini"
+              ></el-input-number>
+            </div>
+          </transition-group>
+        </draggable>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="showSetting = false">取 消</el-button>
+        <el-button @click="delRow" type="danger">重 置</el-button>
+        <el-button type="primary" @click="save()">确 定</el-button>
+      </span>
+    </el-dialog>
+
+    <el-table
+      v-loading="loading"
+      :data="dataList"
+      style="width: 100%"
+      ref="table"
+      :height="tableHeight"
+      stripe
+      show-summary
+      :summary-method="getSum"
+    >
+      <el-table-column
+        type="index"
+        width="50">
+      </el-table-column>
+      <el-table-column
+        v-for="(item, index) in getRowList"
+        :key="index"
+        :label="item.name"
+        :width="item.width"
+        :prop="item.label"
+        align="center"
+        :show-overflow-tooltip="true"
+        sortable
+        :fixed="item.fixed"
+      >
+        <template slot-scope="scope">
+          <span v-if="item.label == 'fDc'">
+            {{ scope.row.fDc == 'D'? '收': '付' }}
+          </span>
+          <span v-else-if="item.label == 'fFeeUnitid'">
+            {{ scope.row.fFeeUnitid | fFeeUnitFormat(fFeetUnitOptions) }}
+          </span>
+          <span v-else>{{ scope.row[item.label] }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import Cookies from "js-cookie";
+import draggable from "vuedraggable";
+import { addSet, resetModule, select } from '@/api/system/set';
+import {listCorps} from "@/api/basicdata/corps";
+import {getList} from "@/api/finance/query";
+
+export default {
+  name: "index",
+  components: {
+    draggable,
+  },
+  data() {
+    return {
+      // 表格高度
+      tableHeight: 0,
+      // 总条数
+      total: 0,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      showSearch: true,
+      // 搜索展开/隐藏
+      show: false,
+      // 自定义列弹窗显示
+      showSetting: false,
+      //自定义列宽
+      allCheck: false,
+      setRowList: [],
+      getRowList: [],
+      drag: false,
+      tableDate: [
+        {
+          surface: "1",
+          label: "corpName",
+          name: "客户名称",
+          checked: 0,
+          width: 140,
+        },
+        {
+          surface: "2",
+          label: "fMblno",
+          name: "提单号",
+          checked: 0,
+          width: 180,
+        }, {
+          surface: "3",
+          label: "fBsdate",
+          name: "业务日期",
+          checked: 0,
+          width: 100,
+        },{
+          surface: "4",
+          label: "fReviewDate",
+          name: "审核日期",
+          checked: 0,
+          width: 100,
+        },{
+          surface: "5",
+          label: "feesName",
+          name: "费用名称",
+          checked: 0,
+          width: 100,
+        },{
+          surface: "6",
+          label: "fDc",
+          name: "收/付",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "7",
+          label: "fAmount",
+          name: "金额",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "8",
+          label: "fStlamount",
+          name: "结算金额",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "9",
+          label: "fStlamountDate",
+          name: "结算日期",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "10",
+          label: "fInvamount",
+          name: "开票金额",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "11",
+          label: "fInvnos",
+          name: "发票号",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "12",
+          label: "fAccamount",
+          name: "对账金额",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "13",
+          label: "fAccamountDate",
+          name: "对账日期",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "14",
+          label: "fStatementNo",
+          name: "对账单号",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "15",
+          label: "fFeeUnitid",
+          name: "计价单位",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "16",
+          label: "fQty",
+          name: "数量",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "17",
+          label: "fUnitprice",
+          name: "单价",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "18",
+          label: "fBusinessType",
+          name: "业务类型",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "19",
+          label: "fProductName",
+          name: "货物名称",
+          checked: 0,
+          width: 100,
+        },
+        {
+          surface: "20",
+          label: "remark",
+          name: "备注",
+          checked: 0,
+          width: 100,
+        },
+      ],
+      // 计价单位
+      fFeetUnitOptions: [],
+      fMblnoOptions: [],
+      loading: false,
+      dataList: [],
+    }
+  },
+  created() {
+    this.setRowList = this.tableDate;
+    this.getRowList = this.tableDate;
+    this.getRow()
+    this.getList()
+    listCorps({type: 1}).then((response) => {
+      this.fMblnoOptions = response.rows;
+    });
+    this.getDicts("data_unitfees").then((response) => {
+      this.fFeetUnitOptions = response.data;
+    });
+  },
+  mounted() {
+    this.$nextTick(() => {
+      let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
+      this.tableHeight = windowHeight - 280;
+      // 监听浏览器高度变化,改变表格高度
+      window.onresize = () => {
+        this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 70
+      }
+    })
+  },
+  updated() {
+    this.$nextTick(() => {
+      this.$refs.table.doLayout();
+    })
+  },
+  filters: {
+    fFeeUnitFormat(row, fFeetUnitOptions) {
+      let name;
+      fFeetUnitOptions.map((e) => {
+        if (row == e.dictValue) {
+          name = e.dictLabel;
+        }
+      });
+      return name;
+    },
+  },
+  methods: {
+    getList() {
+      this.loading = true
+      getList(this.queryParams).then(res => {
+        this.dataList = res.rows
+        this.total = res.total
+        this.loading = false;
+      })
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.queryParams.pageSize = 10;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 10,
+      }
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 导出
+    handleExport() {
+      this.$message.warning('此功能暂未开发')
+    },
+    // 表格合计
+    getSum(param) {
+      const { columns, data } = param;
+      const sums = [];
+      var values = [];
+      columns.forEach((column, index) => {
+        if (index === 0) {
+          sums[index] = "合计";
+          return;
+        }
+        if (column.property === "fAmount") {
+          values = data.map((item) => Number(item["fAmount"]));
+        }
+        if (column.property === "fStlamount") {
+          values = data.map((item) => Number(item["fStlamount"]));
+        }
+        if (column.property === "fInvamount") {
+          values = data.map((item) => Number(item["fInvamount"]));
+        }
+        if (column.property === "fAccamount") {
+          values = data.map((item) => Number(item.fAccamount));
+        }
+        if (column.property === "fQty") {
+          values = data.map((item) => Number(item.fQty));
+        }
+        if (
+          column.property === "fAmount" ||
+          column.property === "fStlamount" ||
+          column.property === "fInvamount" ||
+          column.property === "fAccamount" ||
+          column.property === "fQty"
+        ) {
+          sums[index] = values.reduce((prev, curr) => {
+            const value = Number(curr);
+            if (!isNaN(value)) {
+              return prev + curr;
+            } else {
+              return prev;
+            }
+          }, 0);
+          if (column.property === "fAmount") {
+            sums[index] = (sums[index]).toFixed(2);
+          }
+          if (column.property === "fStlamount") {
+            sums[index] = (sums[index]).toFixed(2);
+          }
+          if (column.property === "fInvamount") {
+            sums[index] = (sums[index]).toFixed(2);
+          }
+          if (column.property === "fAccamount") {
+            sums[index] = (sums[index]).toFixed(2);
+          }
+          if (column.property === "fQty") {
+            sums[index] = sums[index];
+          }
+        }
+      });
+      return sums;
+    },
+
+    //列设置全选
+    allChecked() {
+      if (this.allCheck == true) {
+        this.setRowList.map((e) => {
+          return (e.checked = 0);
+        });
+      } else {
+        this.setRowList.map((e) => {
+          return (e.checked = 1);
+        });
+      }
+    },
+    //开始拖拽事件
+    onStart() {
+      this.drag = true;
+    },
+    //拖拽结束事件
+    onEnd() {
+      this.drag = false;
+    },
+    //重置列表
+    delRow() {
+      this.data = {
+        tableName: "财务查询",
+        userId: Cookies.get("userName"),
+      };
+      resetModule(this.data).then((res) => {
+        if (res.code == 200) {
+          this.showSetting = false;
+          this.setRowList = this.tableDate;
+          console.log(this.setRowList)
+          this.getRowList = this.tableDate;
+        }
+      });
+    },
+    //保存列设置
+    save() {
+      this.showSetting = false;
+      this.data = {
+        tableName: "财务查询",
+        userId: Cookies.get("userName"),
+        sysTableSetList: this.setRowList,
+      };
+      addSet(this.data).then((res) => {
+        this.getRowList = this.setRowList.filter((e) => e.checked == 0);
+      });
+    },
+    //查询列数据
+    getRow() {
+      let that = this;
+      this.data = {
+        tableName: "财务查询",
+        userId: Cookies.get("userName"),
+      };
+      select(this.data).then((res) => {
+        if (res.data.length != 0) {
+          this.getRowList = res.data.filter((e) => e.checked == 0);
+          this.setRowList = res.data;
+          this.setRowList = this.setRowList.reduce((res, item) => {
+            res.push({
+              surface: item.surface,
+              label: item.label,
+              name: item.name,
+              checked: item.checked,
+              width: item.width,
+              fixed: item.fixed,
+            });
+            return res;
+          }, []);
+        }
+      });
+    },
+  },
+}
+</script>
+
+<style scoped>
+
+</style>