Merge branch 'dev' of http://114.132.189.42:9002/r/center-lims-before-ruoyi...

zouyu

2025-03-17 0600ab29100da647a5cd34c935c16f59b3e772e5

 src/views/business/costStatistics/index.vue

@@ -1,9 +1,372 @@
<style scoped>
.title {
  height: 60px;
  line-height: 60px;
}

.search {
  background-color: #fff;
  height: 80px;
  display: flex;
  align-items: center;
}

.search_thing {
  display: flex;
  align-items: center;
  height: 50px;
}

.search_label {
  width: 120px;
  font-size: 14px;
  text-align: right;
}

.search_input {
  width: calc(100% - 120px);
}

>>> .custom-statistic .el-statistic .head {
  font-size: 25px;
}

.table {
  margin-top: 10px;
  background-color: #fff;
  width: calc(100% - 40px);
  height: calc(100% - 60px - 80px - 10px - 40px);
  padding: 20px;
}

.el-form-item {
  margin-bottom: 16px;
}

>>> .el-table tbody tr:hover > td {
  background-color: transparent !important;
}
</style>

<template>
  <div>费用统计</div>
  <div class="inspection_order">
    <div style="width: 100%; height: 100%">
      <div>
        <el-row class="title">
          <el-col :span="12" style="padding-left: 20px; text-align: left"
            >费用统计</el-col
          >
          <el-col :span="12" style="text-align: right">
            <el-button size="small" type="primary">OA推送</el-button>
          </el-col>
        </el-row>
      </div>
      <div class="search">
        <div class="search_thing">
          <div class="search_label">时间范围：</div>
          <div class="search_input">
            <el-date-picker
              v-model="dates"
              type="daterange"
              range-separator="至"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              size="small"
              @change="datesChange"
              :key="index2"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="search_thing" style="width: 340px">
          <div class="search_label">委托单位：</div>
          <div class="search_input">
            <!--            <el-input size="small" placeholder="请输入" clearable-->
            <!--               @keyup.enter.native="refreshTable()"></el-input>-->
            <el-select
              @focus="getCompanyOptions"
              @change="refreshTable()"
              clearable
              size="small"
              v-model="entity.company"
              style="width: 100%"
            >
              <el-option
                v-for="item in companyOptions"
                :key="item.value"
                :label="item.label"
                :value="item.label"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="search_thing" style="padding-left: 30px">
          <el-button size="small" @click="refresh()">重 置</el-button>
          <el-button size="small" type="primary" @click="refreshTable()"
            >查 询</el-button
          >
        </div>
        <!-- <div class="search_thing" style="padding-left: 70px;">总价：{{total}}</div> -->
        <div class="search_thing" style="margin-left: 50px">
          <div style="width: 100%; text-align: right">总价：</div>
          <el-statistic
            group-separator=","
            :precision="2"
            :value="total"
          ></el-statistic>
        </div>

        <div class="search_thing" style="padding-left: 70px">
          <el-button
            size="small"
            type="primary"
            @click="handleDown"
            :loading="outLoading"
            >导出</el-button
          >
        </div>
      </div>
      <div class="table">
        <!-- <ValueTable
          ref="ValueTable"
          :url="$api.insOrder.costStatistics"
          :componentData="componentData"
          :key="upIndex"
          @handleWeave="handleWeave"
          :column-min-width="'140'"
        /> -->
        <lims-table
          :tableData="tableData"
          :column="column"
          :tableLoading="tableLoading"
          :height="'calc(100vh - 270px)'"
          :page="page"
          @pagination="pagination"
        ></lims-table>
      </div>
    </div>
    <el-dialog
      title="在线编制"
      :visible.sync="claimVisible"
      width="70%"
      :modal-append-to-body="false"
    >
      <Word style="height: 70vh" v-if="claimVisible" ref="Word" />
      <span slot="footer" class="dialog-footer">
        <el-button @click="claimVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirmClaim">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {};
</script>
import limsTable from "@/components/Table/lims-table.vue";
import {
  costStatistics,
  exportCommissionFees,
  costStatistics2,
  selectCustomPageList,
} from "../../../api/business/costStatistics";

<style></style>
export default {
  components: {
    limsTable,
  },
  data() {
    return {
      tableData: [],
      column: [
        {
          label: "下单时间",
          prop: "createTime",
        },
        {
          label: "委托编号",
          prop: "entrustCode",
        },
        {
          label: "样品名称",
          prop: "sample",
        },
        {
          label: "规格型号",
          prop: "model",
        },
        {
          label: "样品数量",
          prop: "num",
        },
        {
          label: "总价",
          prop: "price",
        },
        {
          label: "试验项目",
          prop: "inspectionItem",
        },
        {
          label: "委托单位",
          prop: "company",
        },
        {
          label: "委托人",
          prop: "name",
        },
      ],
      tableLoading: false,
      page: {
        current: 1,
        size: 20,
        total: 0,
      },
      entity: {
        company: null,
        dates: null,
      },
      entityCopy: {},
      upIndex: 0,
      claimVisible: false,
      dates: [],
      index2: 0,
      total: 0,
      companyOptions: [], // 委托单位枚举值
      outLoading: false,
    };
  },
  mounted() {
    this.getDates();
    this.refreshTable();
    this.entityCopy = this.HaveJson(this.entity);
  },
  methods: {
    getData() {
      this.tableLoading = true;
      let params = { ...this.page, ...this.entity };
      costStatistics(params).then((res) => {
        this.tableData = res.data.records;
        this.page.total = res.data.total;
        this.tableLoading = false;
      });
    },
    pagination({ cutPage, size }) {
      this.page.current = cutPage;
      this.page.size = size;
      this.refreshTable();
    },

    handleDown() {
      let data = {
        company: this.entity.company ? this.entity.company : '',
        startTime: this.dates[0],
        endTime: this.dates[1],
      };
      this.outLoading = true;
      exportCommissionFees(data).then((res) => {
        const blod = new Blob([res], { type: "application/octet-stream" });
        const url = URL.createObjectURL(blod);
        const link = document.createElement("a");
        link.href = url;
        link.download = "委托费用统计.xlsx";
        document.body.appendChild(link);
        link.click();
        this.$nextTick(() => {
          this.$message.success("导出成功");
          this.outLoading = false;
        });
      });
    },
    getTotal() {
      costStatistics2(this.entity).then((res) => {
        this.total = res.data.total;
      });
    },
    getDates() {
      //当前月第一天
      var y = new Date().getFullYear(); //获取年份
      var m = new Date().getMonth() + 1; //获取月份
      var d = "01";
      m = m < 10 ? "0" + m : m; //月份补 0
      let startDate = [y, m, d].join("-");
      //当前月最后一天
      var y = new Date().getFullYear(); //获取年份
      var m = new Date().getMonth() + 1; //获取月份
      var d = new Date(y, m, 0).getDate(); //获取当月最后一日
      m = m < 10 ? "0" + m : m; //月份补 0
      d = d < 10 ? "0" + d : d; //日数补 0
      let endDate = [y, m, d].join("-");
      this.dates = [startDate, endDate];
      this.index2++;
      this.entity.dates = `["${startDate}","${endDate}"]`;
    },
    getCompanyOptions() {
      selectCustomPageList({ ...this.page, ...this.entity })
        .then((res) => {
          const list = res.data.records;
          this.companyOptions = [];
          list.map((item) => {
            const obj = Object.assign({
              value: item.id,
              label: item.company,
            });
            this.companyOptions.push(obj);
          });
        })
        .catch((e) => {
          this.$message.error("查询失败");
        });
    },
    refreshTable() {
      this.entity.dates = JSON.stringify(this.dates);
      this.getData();
      this.getTotal();
    },
    refresh() {
      this.entity = this.HaveJson(this.entityCopy);
      this.getDates();
      this.getTotal();
      this.$nextTick(() => {
        this.getData();
      });
    },
    handleWeave() {
      this.claimVisible = true;
    },
    // 权限分配
    getPower(radio) {
      let power = JSON.parse(sessionStorage.getItem("power"));
      let up = false;
      let del = false;
      let add = false;
      for (var i = 0; i < power.length; i++) {
        if (power[i].menuMethod == "upInsOrder") {
          up = true;
        }
        if (power[i].menuMethod == "addInsOrder") {
          add = true;
        }
      }
      if (!up) {
        this.componentData.do.splice(4, 1);
      }
    },
    handleClose() {
      this.upLoad = false;
    },
    confirmClaim() {
      console.log(11111111111, this.$refs.Word.getValue());
    },
    datesChange(val) {
      if (val == null) {
        return;
      }
      this.componentData.entity.dates = JSON.stringify(val);
      this.$refs["ValueTable"].selectList();
      this.getTotal();
    },
  },
};
</script>