合并

Your Name

2022-09-08 5a1616f169d75ece07d2d12a8edac3e5f660a920

 src/views/contingencyManagement/abolishDialog/abolishDialog.vue

@@ -0,0 +1,139 @@
<template>
  <div class="system-user-container">
  <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">流程图
        <!-- <img src=""> -->
      </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<any>('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;
  padding: 15px;
}
.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;
}

/*弹窗底部边框线*/
::v-deep .el-dialog__footer{
  border-top: 1px solid #e8e8e8;
  border-radius: 0 0 4px 4px;
}
/*弹窗顶部边框线*/
::v-deep .el-dialog__header {
  border-bottom: 1px solid #e8e8e8;
  margin-right: 0;
  border-radius: 4px 4px 0 0;
}
</style>