Your Name
2022-09-08 5a1616f169d75ece07d2d12a8edac3e5f660a920
src/views/goalManagement/processForms/processForms.vue
@@ -0,0 +1,124 @@
<template>
   <div>
   <h4 class="title">胡海涛2022-07-01 16:08:42发起了目标检查上报(检查)--检查</h4>
   <div class="box">
   <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      background-color="#ebeef5"
      text-color="#fff"
      active-text-color="#fff"
      mode="horizontal"
      @select="handleSelect"
   >
      <el-menu-item index="1">表单信息</el-menu-item>
      <!-- <el-menu-item index="2">流程图</el-menu-item> -->
   </el-menu>
   <div v-if="activeIndex == 1" class="navType">
      <formInformationTop v-if="false"></formInformationTop>
      <formInformationTops></formInformationTops>
   </div>
   <!-- <div v-if="activeIndex == 2" class="navType" style="padding:20px 20px 0 20px">
      <div class="title2">流程图</div>
      <div style="width:100%;height:400px"></div>
   </div> -->
   </div>
   <lowerPlate></lowerPlate>
   <div class="btns">
      <el-button type="primary">发起上报</el-button>
   </div>
   </div>
</template>
<script lang="ts">
import { defineComponent, reactive, ref,onMounted } from 'vue';
import { useRouter } from 'vue-router';
import formInformationTop from './component/formInformationTop.vue'
import formInformationTops from './component/formInformationTops.vue'
import lowerPlate from './component/lowerPlate.vue'
export default defineComponent({
   components:{lowerPlate,formInformationTop,formInformationTops},
   setup() {
      const activeIndex = ref('1');
      const handleSelect = (key: string, keyPath: string[]) => {
         // console.log(key, keyPath);
         activeIndex.value = key;
      };
      const form = reactive({
         name: '',
         region: '',
         date1: '',
         date2: '',
         delivery: false,
         type: [],
         resource: '',
         desc: '',
      });
      const router=useRouter()
      const Type=onMounted(()=>{
         console.log("xxxxxxx",router)
      })
      return {
         activeIndex,
         handleSelect,
         form,
         router,
         Type
      };
   },
});
</script>
<style scoped>
.title {
   text-align: center;
   font-size: 16px;
   margin-bottom: 20px;
}
.box{
   border: 1px solid #dcdfe6;
   box-shadow: 0 2px 4px 0 rgb(0 0 0 / 12%), 0 0 6px 0 rgb(0 0 0 / 4%);
}
.navType {
   background-color: #fff;
}
.tiao{
   width: 100%;
   height: 1px;
   background-color: #dcdfe6;
   margin: 30px 0 ;
   position: relative;
}
.typeS{
   width: 80px;
   background-color: #fff;
   position: absolute;
    left: 30px;
   top: -9px;
   font-size: 14px;
   text-align: center;
}
.logoColor{
   background-color: #67c23a;
   color: #fff;
   padding:  5px 8px;
   border-radius: 5px;
   margin-right: 5px;
}
.btns{
   width: 100%;
   padding:20px 0;
   background-color: #fff;
   position: fixed;
   bottom: 0px;
   left: 0px;
   text-align: center;
   box-shadow: 0 -3px 5px 0 rgb(0 0 0 / 12%);
}
.title2{
   padding: 20px 0 20px 10px;
   width: 100%;
   border: 1px solid #dcdfe6;
}
</style>