|
|
@@ -0,0 +1,391 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-dialog v-dialogDrag title="历史引入" :visible.sync="dialogVisible" append-to-body width="80%" :close-on-click-modal="false">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="16">
|
|
|
+ <avue-crud
|
|
|
+ v-if="dialogVisible"
|
|
|
+ :option="option"
|
|
|
+ :data="data"
|
|
|
+ :table-loading="loading"
|
|
|
+ :page.sync="page"
|
|
|
+ :search.sync="query"
|
|
|
+ ref="crud"
|
|
|
+ @search-change="searchChange"
|
|
|
+ @search-reset="searchReset"
|
|
|
+ @current-change="currentChange"
|
|
|
+ @size-change="sizeChange"
|
|
|
+ @current-row-change="handleCurrentRowChange"
|
|
|
+ @on-load="onLoad"
|
|
|
+ >
|
|
|
+ <template slot="menuLeft">
|
|
|
+ <div style="display: flex;align-items: center;">
|
|
|
+ <!-- <avue-radio v-model="dc" :dic="dic" @input="dcChange"></avue-radio> -->
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-radio-group v-model="dc" size="mini" @input="dcChange">
|
|
|
+ <el-radio-button :label="null">全部</el-radio-button>
|
|
|
+ <el-radio-button label="D">收</el-radio-button>
|
|
|
+ <el-radio-button label="C">付</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ <avue-crud
|
|
|
+ v-if="dialogVisible"
|
|
|
+ :option="feeOption"
|
|
|
+ :data="itemData"
|
|
|
+ :table-loading="itemLoading"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ ></avue-crud
|
|
|
+ ></el-col>
|
|
|
+ </el-row>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false" size="mini">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submit" size="mini">导入</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { billsList, historyCostList, historyCostImport } from "@/api/iosBasicData/bills";
|
|
|
+import dicSelect from "@/components/dicSelect/main";
|
|
|
+import { dateFormat } from "@/util/date";
|
|
|
+export default {
|
|
|
+ props: {
|
|
|
+ businessType: {
|
|
|
+ type: String
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ dicSelect
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ firstPage: false,
|
|
|
+ billId: null,
|
|
|
+ dc: null,
|
|
|
+ dic: [
|
|
|
+ {
|
|
|
+ label: "全部",
|
|
|
+ value: null
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "收",
|
|
|
+ value: "D"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "付",
|
|
|
+ value: "C"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ data: [],
|
|
|
+ itemData: [],
|
|
|
+ selectionList: [],
|
|
|
+ form: {},
|
|
|
+ dialogVisible: false,
|
|
|
+ loading: false,
|
|
|
+ itemLoading: false,
|
|
|
+ query: {},
|
|
|
+ page: {
|
|
|
+ pageSize: 20,
|
|
|
+ currentPage: 1,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ option: {
|
|
|
+ height: 400,
|
|
|
+ searchShow: true,
|
|
|
+ searchMenuSpan: 12,
|
|
|
+ border: true,
|
|
|
+ index: true,
|
|
|
+ addBtn: false,
|
|
|
+ viewBtn: false,
|
|
|
+ editBtn: false,
|
|
|
+ delBtn: false,
|
|
|
+ menu: false,
|
|
|
+ columnBtn: false,
|
|
|
+ refreshBtn: false,
|
|
|
+ searchIcon: true,
|
|
|
+ highlightCurrentRow: true,
|
|
|
+ align: "center",
|
|
|
+ searchIndex: 3,
|
|
|
+ header: false,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.corpName"),
|
|
|
+ prop: "corpCnName",
|
|
|
+ search: true,
|
|
|
+ type: "select",
|
|
|
+ filterable: true,
|
|
|
+ remote: true,
|
|
|
+ dicUrl: "/api/blade-los/bcorps/listByType?shortName={{key}}",
|
|
|
+ props: {
|
|
|
+ label: "cnName",
|
|
|
+ value: "cnName",
|
|
|
+ res: "data.records"
|
|
|
+ },
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.mblno"),
|
|
|
+ prop: "mblno",
|
|
|
+ search: true,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.hblno"),
|
|
|
+ prop: "hblno",
|
|
|
+ search: true,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.etd"),
|
|
|
+ prop: "etd",
|
|
|
+ searchProp: "etdList",
|
|
|
+ type: "date",
|
|
|
+ unlinkPanels: true,
|
|
|
+ searchRange: true,
|
|
|
+ overHidden: true,
|
|
|
+ format: "yyyy-MM-dd",
|
|
|
+ valueFormat: "yyyy-MM-dd HH:mm:ss",
|
|
|
+ searchDefaultTime: ["00:00:00", "23:59:59"],
|
|
|
+ search: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.pol"),
|
|
|
+ prop: "polEnName",
|
|
|
+ type: "select",
|
|
|
+ filterable: true,
|
|
|
+ remote: true,
|
|
|
+ dicUrl: "/api/blade-los/bports/list?enName={{key}}",
|
|
|
+ props: {
|
|
|
+ label: "enName",
|
|
|
+ value: "enName",
|
|
|
+ res: "data.records"
|
|
|
+ },
|
|
|
+ search: true,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.pod"),
|
|
|
+ prop: "podEnName",
|
|
|
+ type: "select",
|
|
|
+ filterable: true,
|
|
|
+ remote: true,
|
|
|
+ dicUrl: "/api/blade-los/bports/list?enName={{key}}",
|
|
|
+ props: {
|
|
|
+ label: "enName",
|
|
|
+ value: "enName",
|
|
|
+ res: "data.records"
|
|
|
+ },
|
|
|
+ search: true,
|
|
|
+ overHidden: true
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ feeOption: {
|
|
|
+ height: 500,
|
|
|
+ border: true,
|
|
|
+ index: true,
|
|
|
+ addBtn: false,
|
|
|
+ viewBtn: false,
|
|
|
+ editBtn: false,
|
|
|
+ delBtn: false,
|
|
|
+ menu: false,
|
|
|
+ align: "center",
|
|
|
+ header: false,
|
|
|
+ selection: true,
|
|
|
+ tip: false,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: "收/付",
|
|
|
+ prop: "dc",
|
|
|
+ width: 60,
|
|
|
+ dicData: [
|
|
|
+ {
|
|
|
+ label: "收",
|
|
|
+ value: "D"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "付",
|
|
|
+ value: "C"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.feeInfo"),
|
|
|
+ prop: "feeCnName",
|
|
|
+ width: 100,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.unitNo"),
|
|
|
+ prop: "unitNo",
|
|
|
+ width: 90,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.currency"),
|
|
|
+ prop: "curCode",
|
|
|
+ width: 60,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.exrate"),
|
|
|
+ prop: "exrate",
|
|
|
+ width: 60,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.price"),
|
|
|
+ prop: "price",
|
|
|
+ width: 100,
|
|
|
+ overHidden: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: this.$t("sea118n.quantity"),
|
|
|
+ prop: "quantity",
|
|
|
+ width: 80,
|
|
|
+ overHidden: true
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ methods: {
|
|
|
+ dcChange(val) {
|
|
|
+ let obj = {
|
|
|
+ id: this.form.id,
|
|
|
+ billId: this.billId,
|
|
|
+ dc: val
|
|
|
+ };
|
|
|
+ this.getHistoryCostList(obj);
|
|
|
+ },
|
|
|
+ openDialog(val, type) {
|
|
|
+ this.billId = null;
|
|
|
+ this.data = [];
|
|
|
+ this.itemData = [];
|
|
|
+ this.dc = type;
|
|
|
+ this.form = val;
|
|
|
+ this.dialogVisible = true;
|
|
|
+ },
|
|
|
+ handleCurrentRowChange(row) {
|
|
|
+ this.billId = row.id;
|
|
|
+ let obj = {
|
|
|
+ id: this.form.id,
|
|
|
+ billId: row.id,
|
|
|
+ dc: this.dc
|
|
|
+ };
|
|
|
+ this.getHistoryCostList(obj);
|
|
|
+ },
|
|
|
+ getHistoryCostList(obj) {
|
|
|
+ this.itemLoading = true;
|
|
|
+ historyCostList(obj)
|
|
|
+ .then(res => {
|
|
|
+ this.itemData = res.data.data;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.itemLoading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ searchReset() {
|
|
|
+ this.query = this.$options.data().query;
|
|
|
+ // this.onLoad(this.page);
|
|
|
+ },
|
|
|
+ // 搜索按钮点击
|
|
|
+ searchChange(params, done) {
|
|
|
+ this.firstPage = true;
|
|
|
+ this.page.currentPage = 1;
|
|
|
+ this.onLoad(this.page, this.query);
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ selectionChange(list) {
|
|
|
+ this.selectionList = list;
|
|
|
+ },
|
|
|
+ currentChange(currentPage) {
|
|
|
+ this.page.currentPage = currentPage;
|
|
|
+ },
|
|
|
+ sizeChange(pageSize) {
|
|
|
+ this.page.pageSize = pageSize;
|
|
|
+ },
|
|
|
+ onLoad(page, params = {}) {
|
|
|
+ if (this.firstPage) {
|
|
|
+ let obj = {};
|
|
|
+ obj = {
|
|
|
+ businessType: this.businessType,
|
|
|
+ ...Object.assign(params, this.query)
|
|
|
+ };
|
|
|
+ this.loading = true;
|
|
|
+ billsList(page.currentPage, page.pageSize, obj)
|
|
|
+ .then(res => {
|
|
|
+ this.data = res.data.data.records;
|
|
|
+ this.page.total = res.data.data.total;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ if (this.selectionList.length == 0) {
|
|
|
+ return this.$message.error("请选择费用明细");
|
|
|
+ }
|
|
|
+ let obj = {
|
|
|
+ id: this.form.id,
|
|
|
+ feeCenterListAll: this.selectionList
|
|
|
+ };
|
|
|
+ const loading = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: "加载中",
|
|
|
+ spinner: "el-icon-loading",
|
|
|
+ background: "rgba(255,255,255,0.7)"
|
|
|
+ });
|
|
|
+ historyCostImport(obj)
|
|
|
+ .then(res => {
|
|
|
+ this.$emit("update");
|
|
|
+ this.dialogVisible = false;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.close();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 更改表格颜色
|
|
|
+ headerClassName(tab) {
|
|
|
+ //颜色间隔
|
|
|
+ let back = "";
|
|
|
+ if (tab.columnIndex >= 0 && tab.column.level === 1) {
|
|
|
+ if (tab.columnIndex % 2 === 0) {
|
|
|
+ back = "back-one";
|
|
|
+ } else if (tab.columnIndex % 2 === 1) {
|
|
|
+ back = "back-two";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return back;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+::v-deep#out-table .back-one {
|
|
|
+ background: #ecf5ff !important;
|
|
|
+ text-align: center;
|
|
|
+ padding: 4px 0;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep#out-table .back-two {
|
|
|
+ background: #ecf5ff !important;
|
|
|
+ text-align: center;
|
|
|
+ padding: 4px 0;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .el-col-md-8 {
|
|
|
+ width: 24.33333%;
|
|
|
+}
|
|
|
+::v-deep .el-dialog__body {
|
|
|
+ padding: 5px 20px;
|
|
|
+}
|
|
|
+</style>
|