saas_masterPlatform/src/views/financed/accountsPayable/components/dislogOrderList.vue

<template>
  <BaseDialog
    width="1400px"
    :isShowFooter="false"
    :isShow.sync="isShow"
    :title="title"
    @open="init"
  >
    <div class="des df">
      <p>机构名称：{{ info.tenantName }}</p>
      <p>账期类型：{{ ["月份", "季度", "半年", "年度"][info.billType] }}</p>
      <p>时间：{{ info.monthTime }}</p>
    </div>
    <search-box-new
      ref="searchBox"
      class="search_box_page"
      :redIcon="false"
      :formData="formData"
      :formList="formList"
      @search="search(3)"
      @init="init"
    />
    <picture-list ref="pictureList" :list="showStatisticsList"></picture-list>
    <table-list
      rowKey="id"
      ref="tableList"
      :tableSets="tableSet"
      :tableData="tableData"
      :navText="navText"
      :loading="loading"
    >
      <template slot="customize">
        <el-button v-if="isEdit" @click="exportSH" type="primary">
          批量审核
        </el-button>
        <el-button v-else @click="batchExport" type="info" plain>
          导出excel
        </el-button>
      </template>
      <template slot="predictPayTime" slot-scope="props">
        <span v-if="props.scope.row.creditStatus == 1">已结清</span>
        <span style="color: red" v-else>
          {{ $methodsTools.onlyForma(props.scope.row.predictPayTime) || "--" }}
        </span>
      </template>
      <template slot="predictPayDay" slot-scope="props">
        <span
          :style="{ color: props.scope.row.predictPayDay < 0 ? 'red' : '' }"
        >
          {{ props.scope.row.predictPayDay || "--" }}
        </span>
      </template>
      <template slot="divideCheckStatus" slot-scope="props">
        <div v-if="props.scope.row.billType != 7">
          {{
            divideCheckStatus(
              props.scope.row.orderSn,
              props.scope.row.payStatus,
              props.scope.row.checkStatus
            )
          }}
          <span style="color: #409eff" v-if="props.scope.row.roleName">
            ({{ props.scope.row.roleName }})
          </span>
        </div>
      </template>
      <template slot="btn" slot-scope="props">
        <el-button type="text" @click="openDialog(props.scope.row, 1)">
          详情
        </el-button>
        <el-button
          type="text"
          :disabled="
            props.scope.row.checkStatus !== 0 ||
            getRoles(props.scope.row.roleId)
          "
          @click="openDialog([props.scope.row])"
        >
          审核
        </el-button>
      </template>
    </table-list>
    <pagination1
      :total="total"
      :pageSize.sync="formData.pageSize"
      :currentPage.sync="formData.pageNum"
      @search="search(3)"
    />
  </BaseDialog>
</template>

<script>
import pictureList from "@/components/Comon/pictureList.vue";
export default {
  name: "SaasMasterPlatformDislogOrderList",
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
    info: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  data() {
    return {
      statisticsList: [
        {
          label: "订单金额",
          img: "未收款",
          value: 0,
        },
        {
          label: "税前佣金",
          img: "已退款",
          value: 0,
        },
        {
          label: "完单分成",
          img: "成本金额",
          value: 0,
        },
        {
          label: "应付分成",
          img: "成本金额",
          value: 0,
        },
      ],
      loading: false,
      navText: {
        title: "机构分成",
        index: 0,
        ch: "条",
        num: true,
        choice: true,
        addHide: true,
        dontNum: true,
        openCheckMore: false,
        changeWidth: "280px",
        custom: false,
        tableColor: true,
      },
      formData: {
        pageSize: 10,
        pageNum: 1,
      },
      formList: [
        {
          prop: "checkStatus",
          placeholder: "审核状态",
          scope: "select",
          options: [
            { label: "待审核", value: 2 },
            { label: "已通过", value: 1 },
          ],
        },
        {
          prop: "checkStatus",
          placeholder: "分成类型",
          scope: "select",
          options: [
            { label: "退款扣除", value: 2 },
            { label: "完单分成", value: 1 },
          ],
        },
        {
          prop: "date",
          scope: "datePickerA",
          placeholder: "完单时间",
          type: "date",
        },
        {
          prop: "orderSn",
          placeholder: "输入订单号",
        },
      ],
      tableSet: [
        {
          label: "完单时间",
          hidden: true,
          width: 140,
        },
        {
          label: "订单日期",
          prop: "orderSn",
          width: "180",
          hidden: true,
        },
        {
          label: "订单号",
          prop: "orderSn",
          width: "180",
          hidden: true,
        },
        {
          label: "分成类型",
          prop: "billType",
          scope: "type",
          hidden: true,
          values: {
            1: "退款扣除",
            2: "完单分成",
          },
        },
        {
          label: "订单金额",
          prop: "tenantName",
          hidden: true,
        },
        {
          label: "税前佣金",
          prop: "payMoney",
          hidden: true,
          scope: "formatPrice",
        },
        {
          label: "完单分成",
          prop: "closeOrderMoney",
          hidden: true,
          scope: "formatPrice",
        },
        {
          label: "税前佣金",
          prop: "deductMoney",
          hidden: true,
          scope: "formatPrice",
        },
        {
          label: "审核状态",
          prop: "divideCheckStatus",
          hidden: true,
          scope: "solt",
          soltName: "divideCheckStatus",
        },
      ],
      tableData: [],
      total: 0,
    };
  },

  methods: {
    init() {
      console.log(this.info, 789);
      //   this.navText.choice = !!this.isEdit;
    },
    batchExport() {
      tenantExport(this.formData).then((res) => {
        if (res.msg) {
          exportFn(res.msg, "导出机构分成数据");
        } else {
          this.$message.error("导出失败");
        }
      });
    },
  },
  computed: {
    isShow: {
      get() {
        return this.dialogVisible;
      },
      set(val) {
        this.$emit("update:dialogVisible", false);
      },
    },
    isEdit() {
      return this.info.isEdit;
    },
    title() {
      return this.isEdit ? "订单审核" : "订单列表";
    },
    showStatisticsList() {
      if (this.isEdit) {
        this.statisticsList.splice(2, 1);
      }
      return this.statisticsList;
    },
  },
  components: {
    pictureList,
  },
};
</script>

<style lang="scss" scoped>
.des {
  margin-top: -20px;
  p {
    margin: 10px 40px 10px 0;
  }
}
.search_box_page {
  /deep/ .el-select {
    width: 120px;
  }
  /deep/ .el-form-item__content > .el-input {
    width: 190px;
  }
}
</style>