1b89d7fe225b1d6df0c8ac2b2c52405faac978a4.svn-base 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <!-- -->
  2. <template>
  3. <div id="popupContainer" class=''>
  4. <el-dialog :title="ryTitle" @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. :ryEngid="ryEngid"
  14. :ryInfoContent="ryInfoContent"
  15. :ryObjId="ryObjId">
  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. yunxingguanli:resolve => {require(['./yunxingguanli.vue'], resolve)},//农村饮水工程运行管理情况表
  27. anfangdiaoyan:resolve => {require(['./anfangdiaoyan.vue'], resolve)},//暗访调研行政村统计表
  28. yunxingweihu:resolve => {require(['./yunxingweihu.vue'], resolve)},//村内农村饮水工程设施运行维护情况表
  29. yongshuihu:resolve => {require(['./yongshuihu.vue'], resolve)},//用水户情况表
  30. qianrengongshui:resolve => {require(['./qianrengongshui.vue'], resolve)},//千人以上供水工程水源地保护情况表
  31. },
  32. props:['ryEngid',"ryInfoContent",'ryTitle','ryObjId'],
  33. data() {
  34. return {
  35. currentViewId:'基础信息',
  36. dialogFormVisible:true,
  37. options: [
  38. {
  39. value: "jichuxinxi",
  40. label: "基础信息"
  41. },{
  42. value: "yunxingguanli",
  43. label: "农村饮水工程运行管理情况表"
  44. },{
  45. value: "anfangdiaoyan",
  46. label: "暗访调研行政村统计表"
  47. },{
  48. value: "yunxingweihu",
  49. label: "村内农村饮水工程设施运行维护情况表"
  50. },{
  51. value: "yongshuihu",
  52. label: "用水户情况表"
  53. },{
  54. value: "qianrengongshui",
  55. label: "千人以上供水工程水源地保护情况表"
  56. }
  57. ]
  58. };
  59. },
  60. computed: {},
  61. watch: {},
  62. //生命周期 - 创建完成(可以访问当前this实例)
  63. created() {
  64. },
  65. //生命周期 - 挂载完成(可以访问DOM元素)
  66. mounted() {
  67. },
  68. beforeCreate() {}, //生命周期 - 创建之前
  69. beforeMount() {}, //生命周期 - 挂载之前
  70. beforeUpdate() {}, //生命周期 - 更新之前
  71. updated() {}, //生命周期 - 更新之后
  72. beforeDestroy() {}, //生命周期 - 销毁之前
  73. destroyed() {}, //生命周期 - 销毁完成
  74. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  75. methods: {
  76. closeDialog() {
  77. this.$emit("cancelHandler");
  78. },
  79. showDialog() {
  80. this.dialogFormVisible = true;
  81. },
  82. },
  83. }
  84. </script>
  85. <style scoped>
  86. /*@import url(); 引入公共css类*/
  87. </style>