Smart_platform_ui/src/views/iosBasicData/periodManagement/index.vue

<template>
  <div>
    <basic-container v-show="!detailsOpen">
      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="会计期间" name="first">
          <avue-crud
            :option="option"
            :search.sync="search"
            v-model="form"
            :table-loading="loading"
            :data="dataList"
            ref="crud"
            :key="key"
            @on-load="onLoad"
            @search-change="searchChange"
            @refresh-change="refreshChange"
            @resetColumn="resetColumnTwo('crud', 'option', 'optionList', 366)"
            @saveColumn="saveColumnTwo('crud', 'option', 'optionList', 366)"
            :page.sync="page"
          >
            <template slot-scope="{ type, size, row, index }" slot="menu">
              <el-button size="small" :type="type" :disabled="row.lockingStatus != 0" @click="lock(row, 1)">锁定</el-button>
              <el-button size="small" :type="type" :disabled="row.lockingStatus != 1 || row.isClosed != 0" @click="lock(row, 2)">撤销锁定</el-button>
              <el-button size="small" :type="type" :disabled="row.lockingStatus != 1 || row.isClosed != 0" @click="inClose(row, 1)">结转</el-button>
              <el-button size="small" :type="type" :disabled="row.isClosed != 1" @click="inClose(row, 2)">反结转</el-button>
            </template>
            <template slot-scope="{ type, size, row, $index }" slot="menuLeft">
              <el-button
                type="success"
                size="small"
                @click="
                  openDialog = true;
                  title = '开账';
                "
                v-if="showBut"
                >开 账</el-button
              >
              <el-button
                type="success"
                size="small"
                @click="
                  openDialog = true;
                  title = '账套初始化';
                "
                v-if="!showBut"
                >账套初始化</el-button
              >
            </template>
          </avue-crud>
        </el-tab-pane>
        <el-tab-pane label="月末结转" name="second">
          <avue-crud
            :option="option2"
            :search.sync="search2"
            v-model="form2"
            :table-loading="loading"
            :data="dataList2"
            ref="crud2"
            :key="key"
            @on-load="onLoad2"
            @search-change="searchChange2"
            @refresh-change="refreshChange2"
            @resetColumn="resetColumnTwo('crud2', 'option2', 'optionList2', 367)"
            @saveColumn="saveColumnTwo('crud2', 'option2', 'optionList2', 367)"
          >
            <template slot-scope="{ type, size, row, index }" slot="menu">
              <el-button size="small" :type="type" @click="editOpen(row)">模板修改</el-button>
              <el-button size="small" :type="type" @click="generate(row)">生成凭证</el-button>
            </template>
            <!-- <template slot-scope="{type,size,row,$index}" slot="menuLeft">
                            <el-button icon="el-icon-plus" type="primary" size="small"
                                @click="detailsOpen = true">新建申请</el-button>
                        </template> -->
          </avue-crud>
        </el-tab-pane>
      </el-tabs>
    </basic-container>
    <detailsPage v-if="detailsOpen" @goBack="goBack" :onLoad="form" :detailData="detailData"> </detailsPage>

    <el-dialog v-dialogdrag append-to-body :title="title" :visible.sync="openDialog" width="30%" :before-close="handleClose">
      <span v-if="title == '汇兑损益汇率'" style="display: flex; align-items: center">
        <avue-crud :data="itemData" :option="itemOption"></avue-crud>
      </span>
      <span v-if="title == '期间损益汇率'" style="display: flex; align-items: center">
        <avue-crud :data="itemData" :option="itemOption"></avue-crud>
      </span>
      <span v-else-if="title == '开账'" style="display: flex; align-items: center">
        开账期间：<avue-date
          size="small"
          type="month"
          v-model="openDate"
          format="yyyy-MM"
          value-format="yyyy-MM"
          placeholder="请选择开账日期"
        ></avue-date>
      </span>
      <span v-else-if="title == '账套初始化'" style="display: flex; align-items: center">
        初始化期间：<avue-date
          size="small"
          type="month"
          v-model="openDate"
          format="yyyy-MM"
          value-format="yyyy-MM"
          placeholder="请选择初始化期间"
        ></avue-date>
      </span>
      <el-dialog v-dialogdrag append-to-body title="凭证明细" :visible.sync="itemOpenDialog" width="50%" :before-close="handleClose2">
        <span style="display: flex; align-items: center">
          <avue-crud :data="itemForm2.finVouchersItemsList" :option="itemOption2"></avue-crud>
        </span>
        <span slot="footer" class="dialog-footer">
          <el-button size="mini" @click="itemOpenDialog = false">取 消</el-button>
          <el-button size="mini" type="primary" @click="onPeriod()">确 定</el-button>
        </span>
      </el-dialog>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="openDialog = false">取 消</el-button>
        <el-button v-if="title == '开账'" size="mini" type="primary" @click="openPeriod">确 定</el-button>
        <el-button v-else-if="title == '账套初始化'" size="mini" type="primary" @click="resetBill">确 定</el-button>
        <el-button v-else-if="title == '汇兑损益汇率'" size="mini" type="primary" @click="inPeriod">确 定</el-button>
        <el-button v-else-if="title == '期间损益汇率'" size="mini" type="primary" @click="inPeriod">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog v-dialogdrag append-to-body title="业务审核未通过明细" :visible.sync="openDialog2" width="50%" :before-close="handleClose3">
      <span style="display: flex; align-items: center">
        <avue-crud :data="dialogData" :option="dialogOption"></avue-crud>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="openDialog2 = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="exportExcel(1)">导 出</el-button>
      </span>
    </el-dialog>
    <el-dialog v-dialogdrag append-to-body title="凭证未记账数据" :visible.sync="openDialog3" width="50%" :before-close="handleClose4">
      <span style="display: flex; align-items: center">
        <avue-crud :data="dialogData2" :option="dialogOption2"></avue-crud>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="openDialog3 = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="exportExcel(2)">导 出</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  currentPeriod,
  init,
  locking,
  revokeLocking,
  close,
  unclose,
  generateVouchers,
  submitPeriod,
  getPeriodExchangeRate,
  openPeriod,
} from "@/api/iosBasicData/periodManagement";
import detailsPage from "./detailsPage";
import { defaultDate4 } from "@/util/date";
import { getToken } from "@/util/auth";
export default {
  name: "index",
  components: {
    detailsPage,
  },
  data() {
    return {
      itemId: null,
      dialogOption: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: false,
        border: true,
        menu: false,
        header: false,
        align: "center",
        size: "small",
        column: [
          {
            label: "业务模块",
            prop: "businessType",
            overHidden: true,
          },
          {
            label: "单据号",
            prop: "billNo",
            overHidden: true,
          },
          {
            label: "业务日期",
            prop: "businessDate",
            overHidden: true,
          },
          {
            label: "提单号",
            prop: "mblno",
            overHidden: true,
          },
          {
            label: "操作员",
            prop: "operator",
            overHidden: true,
          },
          {
            label: "业务员",
            prop: "salesperson",
            overHidden: true,
          },
        ],
      },
      openDialog2: false,
      dialogData: [],
      dialogOption2: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: false,
        border: true,
        menu: false,
        header: false,
        align: "center",
        size: "small",
        column: [
          {
            label: "年",
            prop: "year",
            overHidden: true,
          },
          {
            label: "月",
            prop: "month",
            overHidden: true,
          },
          {
            label: "凭证号",
            prop: "voucherNumber",
            overHidden: true,
          },
          {
            label: "凭证日期",
            prop: "voucherDate",
            overHidden: true,
          },
          {
            label: "制单人",
            prop: "operator",
            overHidden: true,
          },
        ],
      },
      openDialog3: false,
      dialogData2: [],
      itemForm: {},
      itemData: [],
      itemOption: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: false,
        border: true,
        menu: false,
        header: false,
        align: "center",
        size: "small",
        column: [
          {
            label: "币种代码",
            prop: "curCode",
          },
          {
            label: "币种名称",
            prop: "curName",
          },
          {
            label: "汇率日期",
            prop: "curDate",
          },
          {
            label: "汇率",
            prop: "exrate",
            type: "number",
            precision: 4,
            step: 4,
            cell: true,
          },
        ],
      },
      itemForm2: {},
      itemOption2: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: false,
        border: true,
        menu: false,
        header: false,
        align: "center",
        size: "small",
        column: [
          {
            label: "摘要",
            prop: "descr",
            overHidden: true,
          },
          {
            label: "代码名称",
            prop: "accountCode",
            overHidden: true,
          },
          {
            label: "本币金额",
            overHidden: true,
            children: [
              {
                label: "借方",
                prop: "amountDr",
                overHidden: true,
              },
              {
                label: "货方",
                prop: "amountCr",
                overHidden: true,
              },
            ],
          },
          {
            label: "外币金额",
            overHidden: true,
            children: [
              {
                label: "币种",
                prop: "curCode",
                overHidden: true,
              },
              {
                label: "汇率",
                prop: "exrate",
                overHidden: true,
              },
              {
                label: "借方",
                prop: "amountDrUsd",
                overHidden: true,
              },
              {
                label: "货方",
                prop: "amountCrUsd",
                overHidden: true,
              },
            ],
          },
        ],
      },
      showBut: false,
      title: "开账",
      openDate: null,
      openDialog: false,
      itemOpenDialog: false,
      activeName: "first",
      detailsOpen: false,
      loading: false,
      search: {
        periodYear: defaultDate4(),
      },
      form: {},
      dataList: [],
      detailData: {},
      page: {
        pageSize: 20,
        currentPage: 1,
        total: 0,
        pageSizes: [10, 20, 30, 40, 50, 100, 200, 300, 400, 500],
      },
      key: 0,
      option: {},
      optionList: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: true,
        span: 8,
        border: true,
        height: "auto",
        // searchMenuPosition: "right",
        align: "center",
        size: "small",
        menuWidth: 200,
        searchSpan: 6,
        searchIcon: true,
        searchIndex: 3,
        dialogWidth: "70%",
        column: [
          {
            label: "会计年度",
            prop: "periodYear",
            search: true,
            overHidden: true,
            hide: true,
            type: "year",
            valueFormat: "yyyy",
            width: 100,
          },
          {
            label: "期间",
            prop: "periodDate",
            overHidden: true,
            width: 100,
          },
          {
            label: "开始时间",
            prop: "beginDate",
            search: false,
            overHidden: true,
            type: "date",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd 00:00:00",
            width: 180,
          },
          {
            label: "结束时间",
            prop: "endDate",
            type: "date",
            overHidden: true,
            search: false,
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd 23:59:59",
            width: 180,
          },
          {
            label: "结转状态",
            prop: "isClosed",
            type: "select",
            width: 100,
            overHidden: true,
            search: true,
            dicData: [
              {
                label: "未结转",
                value: 0,
              },
              {
                label: "已结转",
                value: 1,
              },
            ],
          },
          {
            label: "结转时间",
            prop: "closeDate",
            searchProp: "closeDateList",
            overHidden: true,
            search: false,
            type: "date",
            width: 180,
            searchRange: true,
            searchDefaultTime: ["00:00:00", "23:59:59"],
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd HH:mm:ss",
          },
        ],
      },
      search2: {},
      form2: {},
      dataList2: [],
      detailData2: {},
      option2: {},
      optionList2: {
        viewBtn: false,
        editBtn: false,
        delBtn: false,
        addBtn: false,
        index: true,
        span: 8,
        border: true,
        height: "auto",
        searchMenuPosition: "right",
        align: "center",
        size: "small",
        menuWidth: 200,
        dialogWidth: "70%",
        column: [
          {
            label: "结转凭证",
            prop: "descr",
            overHidden: true,
          },
          {
            label: "开始时间",
            prop: "date",
            overHidden: true,
          },
          {
            label: "状态",
            prop: "status",
            type: "select",
            overHidden: true,
            dicData: [
              {
                label: "未生成",
                value: 0,
              },
              {
                label: "已生成",
                value: 1,
              },
            ],
          },
        ],
      },
    };
  },
  async created() {
    this.option = await this.getColumnData(this.getColumnName(366), this.optionList);
    this.option2 = await this.getColumnData(this.getColumnName(367), this.optionList2);
  },
  methods: {
    exportExcel(type) {
      const routeData = this.$router.resolve({
        path: "/api/blade-los/finperiod/export", //跳转目标窗口的地址
        query: {
          "Blade-Auth": getToken(),
          id: this.itemId,
        },
      });
      window.open(routeData.href.slice(1, routeData.href.length));
      if (type == 1) {
        this.handleClose3();
      } else {
        this.handleClose4();
      }
    },
    lock(row, type) {
      if (type == "1") {
        this.$confirm("是否锁定?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          this.loading = true;
          locking({ id: row.id })
            .then((res) => {
              if (res.data.msg == "审核未通过") {
                this.loading = false;
                this.openDialog2 = true;
                this.itemId = row.id;
                this.dialogData = res.data.data;
              } else if (res.data.msg == "凭证未记账") {
                this.loading = false;
                this.openDialog3 = true;
                this.itemId = row.id;
                this.dialogData2 = res.data.data;
              } else {
                this.loading = false;
                this.$message.success("锁定成功");
                this.handleClick(this.activeName);
              }
            })
            .finally(() => {
              this.loading = false;
            });
        });
      } else {
        this.$confirm("是否撤销锁定?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          this.loading = true;
          revokeLocking({ id: row.id })
            .then((res) => {
              this.loading = false;
              this.$message.success("撤销锁定");
              this.handleClick(this.activeName);
            })
            .finally(() => {
              this.loading = false;
            });
        });
      }
    },
    inClose(row, type) {
      if (type == "1") {
        this.$confirm("是否结转?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          this.loading = true;
          close({ id: row.id })
            .then((res) => {
              this.loading = false;
              this.$message.success("结转成功");
              this.handleClick(this.activeName);
            })
            .finally(() => {
              this.loading = false;
            });
        });
      } else {
        this.$confirm("是否反结转?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          this.loading = true;
          unclose({ id: row.id })
            .then((res) => {
              this.loading = false;
              this.$message.success("反结转成功");
              this.handleClick(this.activeName);
            })
            .finally(() => {
              this.loading = false;
            });
        });
      }
    },
    openPeriod() {
      if (!this.openDate) {
        return this.$message.warning("请选择开账月份！");
      }
      this.$confirm("确认开账?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.loading = true;
        openPeriod({ beginDate: this.openDate + "-01 00:00:00" })
          .then((res) => {
            this.$message.success("开账成功");
            this.handleClick(this.activeName);
            this.handleClose();
          })
          .finally(() => {
            this.loading = false;
          });
      });
    },
    handleClose() {
      this.itemForm = {};
      this.openDate = null;
      this.openDialog = false;
    },
    handleClose2() {
      this.itemData2 = [];
      this.itemOpenDialog = false;
    },
    handleClose3() {
      this.itemId = null;
      this.dialogData = [];
      this.openDialog2 = false;
    },
    handleClose4() {
      this.itemId = null;
      this.dialogData2 = [];
      this.openDialog3 = false;
    },
    resetBill() {
      if (!this.openDate) {
        return this.$message.warning("请选择初始化月份！");
      }

      this.$confirm("确认账套初始化?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.loading = true;
        init({ beginDate: this.openDate + "-01 00:00:00" })
          .then((res) => {
            this.loading = false;
            this.$message.success("初始化成功");
            this.handleClick(this.activeName);
            this.handleClose();
          })
          .finally(() => {
            this.loading = false;
          });
      });
    },
    handleClick(val) {
      if (val == "first") {
        this.onLoad(this.page, this.search);
      } else {
        this.onLoad2(this.search2);
      }
    },
    goBack(type) {
      this.form = {};
      this.detailsOpen = false;
      this.onLoad(this.page, this.search);
    },
    editOpen(row, status) {
      this.form = row;
      this.detailData = {
        id: row.id,
        type: row.bsType,
        status: status,
      };
      this.detailsOpen = true;
    },
    generate(row) {
      this.openDialog = true;
      this.itemForm = row;
      this.title = row.bsType == "FM-CURRENCY-PL-TRANSFER" ? "汇兑损益汇率" : "期间损益汇率";
      getPeriodExchangeRate().then((res) => {
        res.data.data.forEach((e) => {
          e.$cellEdit = true;
        });
        this.itemData = res.data.data;
      });
    },
    inPeriod() {
      let obj = {};
      obj = { ...this.itemForm, exchangeRateList: this.itemData };

      generateVouchers(obj).then((res) => {
        console.log(res);
        this.itemForm2 = res.data.data;
        this.handleClose();
        this.itemOpenDialog = true;
      });
    },
    onPeriod() {
      if (this.itemForm2.finVouchersItemsList.length == 0) {
        return this.$message.error("明细不能为空");
      }
      this.$confirm("确定保存凭证?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.loading = true;
        submitPeriod(this.itemForm2)
          .then((res) => {
            this.$message.success("保存成功");
            this.handleClose2();
          })
          .finally(() => {
            this.loading = false;
          });
      });
    },
    //刷新
    refreshChange() {
      this.onLoad(this.page, this.search);
    },
    searchChange(params, done) {
      this.page.currentPage = 1;
      done();
      this.onLoad(this.page, params);
    },
    onLoad(page, params = {}) {
      console.log(params);
      params = {
        ...Object.assign(params, this.search),
        current: page.currentPage,
        size: page.pageSize,
      };
      this.loading = true;
      getList(params)
        .then((res) => {
          this.dataList = res.data.data.records;
          this.page.total = res.data.data.total;
          this.showBut = res.data.data.records.length == 0 ? true : false;
          this.loading = false;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    //刷新
    refreshChange2() {
      this.onLoad2(this.search);
    },
    searchChange2(params, done) {
      this.page.currentPage = 1;
      done();
      this.onLoad(params);
    },
    onLoad2(page, params = {}) {
      params = {
        ...params,
      };
      this.loading = true;
      currentPeriod(params)
        .then((res) => {
          this.dataList2 = res.data.data;
          this.loading = false;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    //自定义列保存
    async saveColumnTwo(ref, option, optionBack, code) {
      /**
       * 已定义全局方法，直接使用，saveColumnData保存列数据方法,参数传值(表格名称，当前表格的option数据)
       * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
       * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
       */
      const inSave = await this.saveColumnData(this.getColumnName(code), this[option]);
      if (inSave) {
        this.$message.success("保存成功");
        //关闭窗口
        this.$refs[ref].$refs.dialogColumn.columnBox = false;
      }
    },
    //自定义列重置
    async resetColumnTwo(ref, option, optionBack, code) {
      this[option] = this[optionBack];
      const inSave = await this.delColumnData(this.getColumnName(code), this[optionBack]);
      if (inSave) {
        this.$message.success("重置成功");
        this.$refs[ref].$refs.dialogColumn.columnBox = false;
      }
    },
  },
};
</script>

<style scoped>
.bottomBox {
  padding: 3px 6px;
  border-radius: 12px;
  color: #fff;
  font-size: 10px;
}
</style>