wt_project_web_bak/src/views/home/component/left_bar.vue

<template>
  <div>
    <div class="white-bg top full-height flex flex-col hide-scrollbar" style='overflow-y: auto;'>
      <div class="flex flex-col flex-center mt-15 padding">
        <span class='font-15 bold  mb-10'>{{ data.name }}</span>
        <span class="font-15 bold mt-5" style="color:#787C90;">项目总投资额</span>
        <span class="mt-5 font-15 bold main-color">{{
            data.totalAmount ? data.totalAmount.toLocaleString() : '-'
          }}万元</span>
        <main-button :width="200" type="0" @click="proInfo"/>
        <el-divider></el-divider>
        <div class="flex flex-center flex-justify-between full-width">
          <span class="title ml-20">项目阶段-文件管理</span>
          <span class="title mr-20 pointer" @click="record">授权记录</span>
        </div>
      </div>
      <div style='margin-left: 30px'>
        <el-empty v-if='stage && stage.length === 0 '></el-empty>
        <basic-step v-else style='margin-top: 20px' :active="active" :steps='stage'/>
      </div>
    </div>
  </div>
</template>

<script>
import mainButton from '../../../components/main-button.vue'
import basicStep from '@/components/basic-step/index.vue'

export default {
  name: 'left_bar',
  components: {mainButton, basicStep},
  props: {
    data: Object,
    stage: Array,
    active: {
      type: Number,
      default: -1
    }
  },
  watch: {
    active: {
      handler(val) {
        // this.change(0)
      },
      immediate: true
    }
  },
  data() {
    return {
      height: 0
    }
  },
  created() {
  },
  methods: {
    proInfo() {
      this.$emit('typeChange')
    },
    record() {
      this.$emit('typeChange1')
    }
  }
}
</script>

<style lang="scss" scoped>
.top {
  width: 300px;
  position: fixed;
  background-color: #FAF9FA
}

.down {
  width: 300px;
  position: fixed;
  bottom: 0;
  padding-bottom: 20px;
  background-color: #FAF9FA
}

.tip {
  border-radius: 10px;
  background-color: #F4F4F1;
  height: 75px;
  width: 240px
}

.middle {
  width: 270px;
  position: fixed;
  bottom: 175px;
  top: 280px;
  padding-left: 30px;
  background-color: #FAF9FA
}

.title {
  color: #ECAB56;
  font-size: 16px;
  font-weight: 500;
}
</style>