cost-frontend/src/views/actualCost/index.vue

<script lang="tsx">
//表格
import { defineComponent, ref } from "vue";
import {
  costStandardDetailList,
  exportcostStandardDetail
} from "@/api/singleLineQuery.js";
import { transformPageResponse } from "@/utils/qomo";
import { download } from "@qomo-platform/utils";
import { ElMessage } from "element-plus";
export default defineComponent({
  setup() {
    const tableRef = ref();
    //列
    const columns = ref([
      { type: "selection" },
      { prop: "materialNumber", label: "内部订单号" },
      { label: "物料号", prop: "versionNumber" },
      { label: "总实际成本", prop: "level", hideInSearchForm: true },
      { label: "材料成本", prop: "figureNumber", hideInSearchForm: true },
      { label: "直接人工", prop: "dosage", hideInSearchForm: true },
      { label: "折旧", prop: "unit", hideInSearchForm: true },
      { label: "燃动力", prop: "materialCost", hideInSearchForm: true },
      { label: "辅料", prop: "laborCost", hideInSearchForm: true },
      { label: "其他费用", prop: "equipmentCost", hideInSearchForm: true },
      { label: "人工工时(分钟)", prop: "driveCost", hideInSearchForm: true },
      {
        label: "机器工时(分钟)",
        prop: "supplyMaterialCost",
        hideInSearchForm: true
      },
      {
        type: "operation",
        label: "操作",
        minWidth: 120,
        render: ({ row }) => (
          <base-table-operation
            btnList={[
              {
                key: "edit",
                label: "查看结构树",
                onclick: () => checkTree(row)
              },
            ]}
          />
        )
      }
    ]);

    const render = () => {
      return (
        <BaseTable
          columns={columns.value}
          queryParamsToUrl
          toolbar={{ layout: "search-dnamic,reload,column-setting,fullscreen" }}
          ref={tableRef}
          issortTable
          request={async ({
            pageSize = 10,
            current = 1,
            ...otherSearchParams
          }) => {
            return transformPageResponse(
              await costStandardDetailList({
                pageNo: current,
                pageSize,
                ...otherSearchParams
              })
            );
          }}
          v-slots={{
            toolbar: ({ doAddOrEdit }) => (
              <el-space>
                <el-button type="success" onclick={handleExport}>
                  批量导出
                </el-button>
              </el-space>
            )
          }}
        />
      );
    };
    const handleExport = () => {
      exportcostStandardDetail(
        tableRef.value.selectionRows
          ? {
              selections: tableRef.value.selectionRows
                .map(item => item.id)
                .join(",")
            }
          : {}
      ).then(res => {
        download(res, "费用预测明细.xlsx");
      });
    };
    const checkTree = (row) => {
      ElMessage.info("查看结构树");
    };
    return render;
  }
});
</script>
<style lang="scss" scoped></style>