| | |
| | | <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> |