jiliangxiaochengxu/pages/assay/assayDetails.vue

<template>
  <view class="container">
    <view class="contentItems">
      <view class="content">
        <view style="font-size: 32rpx" class="title">器具名称 </view>
        <view style="font-size: 32rpx" class="title">验光</view>
      </view>
      <div></div>
      <view class="content">
        <view class="title">检定状态</view>
        <view class="message">未检定</view>
      </view>
      <view class="content">
        <view class="title">备案状态</view>
        <!-- <view :style="{
			  color: recordColor[recordStatus(item)],
			}">{{ recordStatus(item) }}</view> -->
      </view>
      <view class="content">
        <view class="title">制造单位</view>
        <view class="message">上海光正</view>
      </view>
      <view class="content">
        <view class="title">出厂编号</view>
        <view class="message">2</view>
      </view>
      <view class="content">
        <view class="title">内部编号</view>
        <view class="message">ygjpx-05</view>
      </view>
      <view class="content">
        <view class="title">责任人员</view>
        <view class="message"></view>
      </view>
      <view class="content">
        <view class="title">器具项别</view>
        <view class="message">顶焦度</view>
      </view>
      <view class="content">
        <view class="title">器具种别</view>
        <view class="message">眼科光学</view>
      </view>
      <view class="content">
        <view class="title">专业类别</view>
        <view class="message">光学</view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      recordColor: {
        已撤回: "#fa3534",
        已接收: "#2979ff",
        待提交: "#2979ff",
        备案中: "#2979ff",
        已拒绝: "#fa3534",
        勿备案: "#fa3534",
        未备案: "#909399",
        免备案: "#909399",
        已退回: "#fa3534",
      },
      record: [],
    };
  },
  onLoad() {
    useDict("ejian_instrFillingStatus").then((res) => {
      this.record = res;
    });
  },
  computed: {
    // //检定状态
    // verificationStatus() {
    // 	return (row) => {
    // 		return paraseDict(this.verification, row);
    // 	};
    // },
    // //申请状态
    // applicationStatus() {
    // 	return (row) => {
    // 		return paraseDict(this.application, row);
    // 	};
    // },
    //备案状态
    recordStatus() {
      return (row) => {
        return paraseDict(this.record, row);
      };
    },
  },
  methods: {},
};
</script>

<style lang="scss">
.container {
  height: 100vh;
  background: rgb(243, 244, 249);
  padding: 0rpx 0 110rpx;
  margin-top: 20rpx;

  .contentItems {
    width: 95%;
    border-radius: 6px;
    background: #fff;
    margin: 0rpx auto 20rpx;
    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>