Newer
Older
VueSharedPrinting / src / views / explain.vue
hanfei on 20 Dec 2023 2 KB han
<template>
<!--说明-->
  <div class="explain">
    <navbar :name="name"/>
    <div class="box">
      <div v-if="name=='使用教程'">
        <div class="content">使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程使用教程</div>
      </div>
      <div v-if="name=='打印价格'">
        <div class="content">A4纸[文件打印、扫描复印、身份证打印] :单面+黑白: 0.5元/张单面+彩色: 1.0元/张双面+黑白: 0.8元/张双面+彩色: 1.8元/张</div>
        <div class="content">6寸相纸/热升华相纸 [照片、 证件照打印]:证件照: XXX 元/ 张(版)照 片: XXX元/张</div>
      </div>
      <div v-if="name=='客服助手'">
        <div class="content">尊敬的会员朋友,您在使用自助打印软件过程中遇到任何问题或困难,欢迎随时拨打国内客服电话 400 -12345678,我们将为您提供耐心解答和及时帮助,谢谢。</div>
      </div>
    </div>
    <div class="btn flex-center">确定</div>
  </div>
</template>

<script>
import navbar from '@/components/nav'

export default {
  name: "explain",
  components: {
    navbar
  },
  provide() {
    return {
      title: this.name,
      type: ''
    }
  },
  data() {
    return {
      name: this.$route.params.name,
    }
  },
}
</script>

<style scoped lang="less">
.explain {
  .box {
    width: 114.06rem;
    height: 21rem;
    padding: 6rem 0;
    background: #FFFFFF;
    box-shadow: 0rem 0.31rem 0.63rem 0.06rem rgba(0,0,0,0.14);
    border-radius: 1.63rem;
    margin: 0 auto;
    .content {
      width: 93.81rem;
      font-size: 2.25rem;
      font-weight: bold;
      color: #323232;
      line-height: 3.1rem;
      margin: 0 auto;
      text-align: left;
    }
  }
  .btn {
    width: 114.06rem;
    height: 5.5rem;
    background: linear-gradient(132deg, #52A39D 0%, #A1C553 50%, #81D012 100%);
    border-radius: 1.25rem;
    font-size: 1.88rem;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 2.63rem;
    margin: 3.19rem auto 0;
  }
}
</style>