|
|
@@ -0,0 +1,252 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <div class="_blank">
|
|
|
+ <div class="el-toolbar-body" style="justify-content: flex-start">
|
|
|
+ <el-button type="primary" @click="exportData" icon="el-icon-upload2"
|
|
|
+ ><i class="fa fa-plus" /> 导出</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 列表数据 -->
|
|
|
+ <el-table
|
|
|
+ :key="tableKey"
|
|
|
+ ref="table"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ fit
|
|
|
+ stripe
|
|
|
+ style="width: 100%"
|
|
|
+ @selection-change="onSelectChange"
|
|
|
+ @cell-click="cellClick"
|
|
|
+ >
|
|
|
+ <el-table-column label="#" width="50">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ (page - 1) * limit + scope.$index + 1 }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="产品流转详情表" :resizable="false" align="center">
|
|
|
+ <!--订单编号-->
|
|
|
+ <el-table-column
|
|
|
+ prop="orderNo"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.orderNo')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--产品名称-->
|
|
|
+ <el-table-column
|
|
|
+ prop="bomName"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.bomName')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--分配设备ID-->
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.name')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--计划开始时间-->
|
|
|
+ <el-table-column
|
|
|
+ prop="planStartTime"
|
|
|
+ :label="
|
|
|
+ $t('statisticalAnalysis.table.productInfoStatistics.planStartTime')
|
|
|
+ "
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--计划结束时间-->
|
|
|
+ <el-table-column
|
|
|
+ prop="planEndTime"
|
|
|
+ :label="
|
|
|
+ $t('statisticalAnalysis.table.productInfoStatistics.planEndTime')
|
|
|
+ "
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--开始时间-->
|
|
|
+ <el-table-column
|
|
|
+ prop="startTime"
|
|
|
+ :label="
|
|
|
+ $t('statisticalAnalysis.table.productInfoStatistics.startTime')
|
|
|
+ "
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--结束时间-->
|
|
|
+ <el-table-column
|
|
|
+ prop="endTime"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.endTime')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--时长（小时）-->
|
|
|
+ <el-table-column
|
|
|
+ prop="hour"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.hour')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <!--说明-->
|
|
|
+ <el-table-column
|
|
|
+ prop="remark"
|
|
|
+ :label="$t('statisticalAnalysis.table.productInfoStatistics.remark')"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页组件 -->
|
|
|
+ <el-pagination
|
|
|
+ :current-page="page"
|
|
|
+ :total="total"
|
|
|
+ :page-size="limit"
|
|
|
+ :page-sizes="[5, 10, 20, 30, 40, 50, 100]"
|
|
|
+ style="padding: 30px 0; text-align: center"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ @size-change="changePageSize"
|
|
|
+ @current-change="changeCurrentPage"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// 【产品流转汇总】-API
|
|
|
+import productlineAvailabilityApi from "@/api/statisticalAnalysis/productlineAvailability";
|
|
|
+// 【弹出框】elementui组件
|
|
|
+import elDragDialog from "@/directive/el-drag-dialog";
|
|
|
+export default {
|
|
|
+ name: "productInfoStatistics",
|
|
|
+ directives: {
|
|
|
+ elDragDialog,
|
|
|
+ },
|
|
|
+ components: {},
|
|
|
+ // props: {
|
|
|
+ // loadingId: {
|
|
|
+ // type: String,
|
|
|
+ // default: "",
|
|
|
+ // },
|
|
|
+ // loadingDate: {
|
|
|
+ // type: String,
|
|
|
+ // default: "",
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableData: [], // 讲师列表
|
|
|
+ total: 0, // 总记录数
|
|
|
+ page: 1, // 当前页码
|
|
|
+ limit: 10, // 每页记录数
|
|
|
+ searchObj: {}, // 查询条件
|
|
|
+ // operatorPerformanceVisible: false, // 产线人员工时管理
|
|
|
+ // rowData: {}, // row数据
|
|
|
+ // tableKey: 0,
|
|
|
+ // selection: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ // 实例已经在内存中创建好，此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法，最早只能在created中操作
|
|
|
+ created() {
|
|
|
+ // 加载列表数据
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ loadingId: {
|
|
|
+ handler(val, oldVal) {
|
|
|
+ // 加载列表数据
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ loadingDate: {
|
|
|
+ handler(val, oldVal) {
|
|
|
+ // 加载列表数据
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ view(row) {
|
|
|
+ this.$refs.view.setOperatorDetailPerformance(row);
|
|
|
+ this.operatorViewVisible = true;
|
|
|
+ },
|
|
|
+ fetch() {
|
|
|
+ this.tableKey = !this.tableKey;
|
|
|
+ productlineAvailabilityApi
|
|
|
+ .getProductInfoStatistics(this.page, this.limit, this.searchObj)
|
|
|
+ .then((response) => {
|
|
|
+ const res = response.data;
|
|
|
+ this.tableData = res.data.records;
|
|
|
+ this.total = res.data.total;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 每页记录数改变，size：回调参数，表示当前选中的“每页条数”
|
|
|
+ changePageSize(size) {
|
|
|
+ this.limit = size;
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+
|
|
|
+ // 改变页码，page：回调参数，表示当前选中的“页码”
|
|
|
+ changeCurrentPage(page) {
|
|
|
+ this.page = page;
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ //导出
|
|
|
+ exportData() {
|
|
|
+ productlineAvailabilityApi.expectProductInfo().then((res) => {
|
|
|
+ if (!res) return;
|
|
|
+ const blob = new Blob([res.data], {
|
|
|
+ type: "application/vnd.ms-excel;",
|
|
|
+ });
|
|
|
+ const a = document.createElement("a");
|
|
|
+ // 生成文件路径
|
|
|
+ let href = window.URL.createObjectURL(blob);
|
|
|
+ a.href = href;
|
|
|
+ // 文件名中有中文 则对文件名进行转码
|
|
|
+ a.download = decodeURIComponent("产品流转详情");
|
|
|
+ // 利用a标签做下载
|
|
|
+ document.body.appendChild(a);
|
|
|
+ a.click();
|
|
|
+ document.body.removeChild(a);
|
|
|
+ window.URL.revokeObjectURL(href);
|
|
|
+ this.allloading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ cellClick(row, column) {
|
|
|
+ if (column["columnKey"] === "operation") {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let flag = false;
|
|
|
+ this.selection.forEach((item) => {
|
|
|
+ if (item.id === row.id) {
|
|
|
+ flag = true;
|
|
|
+ this.$refs.table.toggleRowSelection(row);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ if (!flag) {
|
|
|
+ this.$refs.table.toggleRowSelection(row, true);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSelectChange(selection) {
|
|
|
+ this.selection = selection;
|
|
|
+ },
|
|
|
+ //清空
|
|
|
+ resetData() {
|
|
|
+ this.searchObj = {};
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.rowBtn {
|
|
|
+ margin: 0 5px;
|
|
|
+ color: #1890ff;
|
|
|
+}
|
|
|
+
|
|
|
+.rowBtn:hover {
|
|
|
+ opacity: 0.7;
|
|
|
+}
|
|
|
+</style>
|
paidaxin666