Newer
Older
KaiFengPC / src / views / floodSys / scada / stationInfo / index.vue
@鲁yixuan 鲁yixuan on 19 Aug 3 KB updata
  1. <template>
  2. <!-- PLC 站点管理 -->
  3. <div class="water-analysis-page">
  4. <div class="top">
  5. <el-form ref="ruleForm" inline :model="tableData" v-show="showSearch">
  6. <el-form-item v-for="i in queryClouns" :label="i.label" :prop="i.prop">
  7. <el-select
  8. style="width: 100%"
  9. clearable
  10. v-model="tableData.plcStationType"
  11. class="m-2"
  12. v-if="i.prop == 'plcStationType'"
  13. :placeholder="i.placeholder"
  14. >
  15. <el-option v-for="dict in plc_station_type" :key="dict.value" :label="dict.label" :value="dict.value" />
  16. </el-select>
  17. <el-select
  18. style="width: 100%"
  19. clearable
  20. v-model="tableData.status"
  21. class="m-2"
  22. v-else-if="i.prop == 'status'"
  23. :placeholder="i.placeholder"
  24. >
  25. <el-option v-for="dict in status_source" :key="dict.value" :label="dict.label" :value="dict.value" />
  26. </el-select>
  27. <el-input v-else style="width: 240px" clearable v-model="tableData[i.prop]" :placeholder="i.placeholder"></el-input>
  28. </el-form-item>
  29. <el-form-item>
  30. <el-button type="primary" icon="Search" @click="searchForm"> 搜索</el-button>
  31. <el-button icon="Refresh" @click="resectClcik"> 重置</el-button>
  32. </el-form-item>
  33. </el-form>
  34. <el-row :gutter="10" class="mb8">
  35. <el-col :span="1.5">
  36. <el-button type="primary" plain icon="Plus" @click="onCheck(4)">新增</el-button>
  37. </el-col>
  38. <right-toolbar v-model:showSearch="showSearch" @queryTable="searchForm"></right-toolbar>
  39. </el-row>
  40. </div>
  41. <todoDon ref="todoDonRef"></todoDon>
  42. <el-dialog v-model="visible" title="PLC站点信息新增" :modal-append-to-body="false" :close-on-click-modal="false" width="51%">
  43. <tableDalgo :key="isFlag" ref="tableDalgoRef" :typeList="typeList" @onModalClose="onModalClose" v-if="visible"></tableDalgo>
  44. <template #footer>
  45. <div class="dialog-footer">
  46. <el-button @click="open2" type="primary">保 存</el-button>
  47. <el-button @click="visible = false">关闭</el-button>
  48. </div>
  49. </template>
  50. </el-dialog>
  51. </div>
  52. </template>
  53. <script setup>
  54. import tableDalgo from './tableDalgo.vue';
  55. import todoDon from './todoDon.vue';
  56. const { proxy } = getCurrentInstance();
  57. import { status_source } from '@/utils/form';
  58. const { plc_station_type } = proxy.useDict('plc_station_type');
  59. const todoDonRef = ref(null);
  60. const ruleForm = ref(null);
  61. let typeList = ref({});
  62. const tableDalgoRef = ref();
  63. const showSearch = ref(true);
  64. let visible = ref(false);
  65. let isFlag = ref(1);
  66. const queryClouns = [
  67. { label: '站点名称:', prop: 'stationName', placeholder: '站请输入点名称' },
  68. { label: '站点类型:', prop: 'plcStationType', placeholder: '请选择站点类型' },
  69. { label: '状态:', prop: 'status', placeholder: '请选择状态' },
  70. ];
  71. //动态组件
  72. let dataForm = reactive({
  73. tableData: {
  74. pageNum: 1,
  75. pageSize: 10,
  76. plcStationType: null,
  77. stationName: null,
  78. status: null,
  79. },
  80. tableDateTwo: '',
  81. tableLoading: true,
  82. });
  83. let { tableData } = toRefs(dataForm);
  84. //获取列表数据
  85. //搜索
  86. const searchForm = () => {
  87. todoDonRef.value.search(tableData.value);
  88. };
  89. //重置
  90. const resectClcik = () => {
  91. ruleForm.value.resetFields();
  92. todoDonRef.value.search(tableData.value);
  93. };
  94. // 新增
  95. const onCheck = ty => {
  96. visible.value = true;
  97. typeList.value.type = ty;
  98. nextTick(() => {
  99. tableDalgoRef.value.resetFiled();
  100. });
  101. };
  102. //确定
  103. function open2() {
  104. tableDalgoRef.value.submit();
  105. }
  106. function onModalClose() {
  107. visible.value = false;
  108. todoDonRef.value.search(tableData.value);
  109. }
  110. onMounted(() => {
  111. searchForm();
  112. });
  113. </script>
  114. <style lang="scss" scoped>
  115. .water-analysis-page {
  116. padding: 20px;
  117. overflow-y: hidden;
  118. }
  119. </style>