jiliangxiaochengxu/pagesB/Ledger/verificationHistory.vue

<!-- @format -->

<template>
  <view class="container">
    <view class="">
      <view style="" v-if="recordList.length">
        <!-- <u-search
          :showAction="false"
          bgColor="#fff"
          placeholder="请输入检定单编号"
          style="width: 95%; margin: 30rpx auto"
        ></u-search> -->

        <view
          class="contentItems"
          @click="handleVerDetails"
          v-for="item of recordList"
        >
          <view class="title">
            <span class="name">{{ item.name }}</span>
            <span
              class="createTime"
              :style="{
                color: verificationColor[recordStatus(item.checkRecordStatus)],
              }"
              >检定状态：{{ recordStatus(item.checkRecordStatus) }}</span
            >
          </view>
          <view class="contentItem">
            <view class="item">
              <span
                style="color: #fa3534; font-size: 28rpx; margin-right: 40rpx"
                >检定编号：{{ item.number }}</span
              >
            </view>
            <view class="item">
              <span>唯一标识：{{ item.instrNo }}</span>
            </view>
            <view class="item">
              <view>审核机构：{{ item.organizationName }}</view>
            </view>
            <view class="item">
              <view>检定部门：{{ item.deptName }}</view>
            </view>
            <view class="item">
              <span>检定部门联系电话：{{ item.phone }}</span>
            </view>
            <view class="item">
              <span>申请时间：{{ item.createTime }}</span>
            </view>

            <u-divider></u-divider>
            <view style="display: flex">
              <view v-if="item.checkCertPath != null && item.checkCertPath != ''" style="margin-left: auto; width: 200rpx; margin-right: 20rpx">
                <u-button
                        @click="downloadCert(item.checkCertPath)"
                        type="primary"
                        size="small"
                >证书下载</u-button
                >
              </view>
              <view style="margin-left: auto; width: 200rpx">
                <u-button
                        @click="handleCirculation(item)"
                        size="small"
                        type="primary"
                >器具流转记录</u-button
                >
              </view>
            </view>
          </view>
        </view>
      </view>

      <view v-else>
        <u-empty mode="data" text="当前没有检定记录"> </u-empty>
      </view>
    </view>
  </view>
</template>
<script>
import { getCheckRecordList } from "@/api/Ledger";
import { useDict, paraseDict } from "@/utils/index";
export default {
  data() {
    return {
      recordId: null,
      recordList: [],
      verificationColor: {
        未检定: "#909399",
        已校准: "#19be6b",
        已检定: "#19be6b",
        不合格: "#fa3534",
        已完成: "#19be6b",
        已分发: "#2979ff",
        不受理: "#fa3534",
        已中止: "#fa3534",
      },
      verification: [], //备案字典
      baseUrl: this.$baseUrl,
    };
  },
  computed: {
    //备案状态
    recordStatus() {
      return (row) => {
        return paraseDict(this.verification, row);
      };
    },
  },
  async onLoad(options) {
    useDict("ejian_instrCheckRecordStatus").then((res) => {
      this.verification = res;
    });
    this.recordId = options.id;
    try {
      let { data } = await getCheckRecordList({
        instrumentId: this.recordId,
      });
      this.recordList = data;
    } catch (error) {}
  },
  methods: {
    handleCirculation(item) {
      console.log(item.orderInstrumentId);
      uni.navigateTo({
        url: "/pages/verification/circulation?id=" + item.orderInstrumentId,
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
    downloadCert: function (path) {
      uni.showLoading({
        title: "加载中",
      });
      uni.downloadFile({
        url: this.baseUrl + "/api/instrument/sysFileDownload?path=" + path,
        success: (res) => {
          var filePath = res.tempFilePath;
          uni.openDocument({
            filePath: filePath,
            showMenu: true,
            success: function (res) {
              console.log("打开文档成功");
              uni.hideLoading();
            },
          });
        },
      });
    }
  }
};
</script>
<style lang="scss">
.item {
  color: #909399;
  font-size: 24rpx;
  margin: 15rpx 0;
}
.title {
  padding-bottom: 10rpx;
  border-bottom: 1px solid rgb(242, 242, 242);
  display: flex;
  align-items: center;
  justify-content: space-between;

  .name {
    font-size: 30rpx;
    color: black;
    font-weight: bold;
  }
  .createTime {
    color: #909399;
    font-size: 28rpx;
    font-weight: bold;
  }
}
.container {
  height: 100vh;
  background: rgb(248, 249, 250);
  padding: 30rpx;
}
.contentItems {
  width: 97%;
  border-radius: 6px;
  background: #fff;
  margin: 0rpx auto 30rpx;
  padding: 20rpx 30rpx 20rpx;

  .content {
    border-bottom: 1px solid rgb(242, 242, 242);
    padding: 24rpx 0;
    display: flex;
    justify-content: space-between;
  }

  .content:last-child {
    border-bottom: none;
  }

  .title {
    font-size: 26rpx;
    color: black;
    letter-spacing: 3rpx;
  }

  .message {
    font-size: 26rpx;
    color: rgb(146, 146, 146);
  }
}
</style>