55e77f1f668dcfc52ffb67c351baed5daea116d8.svn-base 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <!-- -->
  2. <template>
  3. <div id="popupContainer" class=''>
  4. <el-dialog :title="currentObjectName" @close="closeDialog" width="50%" :visible.sync="dialogFormVisible">
  5. <el-tabs v-model="currentViewId" type="card">
  6. <el-tab-pane
  7. :label="option.label"
  8. :name="option.label"
  9. v-for="option in options"
  10. :key="option.value">
  11. <component
  12. :is="option.value"
  13. :currentObjectRgstrId="currentObjectRgstrId"
  14. :currentObjectName="currentObjectName"
  15. :currentObjectId="currentObjectId">
  16. </component>
  17. </el-tab-pane>
  18. </el-tabs>
  19. </el-dialog>
  20. </div>
  21. </template>
  22. <script>
  23. export default {
  24. components: {
  25. jichuxinxi:resolve => {require(['./jichuxinxi.vue'], resolve)},//基础信息
  26. dengjixinxi:resolve => {require(['./dengjixinxi.vue'], resolve)}//登记信息
  27. },
  28. props: ["currentObjectRgstrId","currentObjectId","currentObjectName","activeName"],
  29. data() {
  30. return {
  31. currentViewId: '基础信息',
  32. dialogFormVisible:true,
  33. options: [
  34. {
  35. value: "jichuxinxi",
  36. label: "基础信息"
  37. },{
  38. value: "dengjixinxi",
  39. label: "登记信息"
  40. }
  41. ]
  42. };
  43. },
  44. computed: {},
  45. watch: {
  46. },
  47. //生命周期 - 创建完成(可以访问当前this实例)
  48. created() {
  49. },
  50. //生命周期 - 挂载完成(可以访问DOM元素)
  51. mounted() {
  52. this.$nextTick(()=>{
  53. this.currentViewId = this.activeName;
  54. })
  55. },
  56. beforeCreate() {}, //生命周期 - 创建之前
  57. beforeMount() {}, //生命周期 - 挂载之前
  58. beforeUpdate() {}, //生命周期 - 更新之前
  59. updated() {}, //生命周期 - 更新之后
  60. beforeDestroy() {}, //生命周期 - 销毁之前
  61. destroyed() {}, //生命周期 - 销毁完成
  62. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  63. methods: {
  64. closeDialog() {
  65. this.$emit("cancelHandler");
  66. },
  67. showDialog() {
  68. this.dialogFormVisible = true;
  69. },
  70. },
  71. }
  72. </script>
  73. <style scoped>
  74. /*@import url(); 引入公共css类*/
  75. .el-dialog__header{
  76. text-align: center !important;
  77. border-bottom: 1px dashed #C5C6C8 !important;
  78. }
  79. .el-dialog{
  80. border-radius: 4px !important;
  81. }
  82. </style>