Newer
Older
KaiFengPC / src / views / floodSys / scada / areaInfo / tableDalgo.vue
@zhangdeliang zhangdeliang on 23 May 3 KB 初始化项目
  1. <template>
  2. <div class="water-analysis-page">
  3. <div class="top">
  4. <el-form label-width="auto" :rules="areaInfoRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
  5. <el-form-item
  6. :label="i.label"
  7. :style="{ width: i.prop == 'remark' ? '93%' : '45%' }"
  8. :prop="i.prop"
  9. v-for="i in areaInfoForm"
  10. :disabled="typeList.type == 1 || typeList.type == 2"
  11. >
  12. <el-select style="width: 100%" clearable v-model="FormList.parentId" v-if="i.prop == 'parentId'" :placeholder="i.placeholder">
  13. <el-option v-for="dict in typeLista.plc_station_type" :key="dict.id" :label="dict.areaName" :value="dict.id" />
  14. </el-select>
  15.  
  16. <el-select
  17. style="width: 100%"
  18. clearable
  19. v-model="FormList.stationName"
  20. v-else-if="i.prop == 'stationName'"
  21. :placeholder="i.placeholder"
  22. @change="stationNameChange"
  23. >
  24. <el-option
  25. v-for="dict in typeLista.stationName_type"
  26. :key="dict.stationCode"
  27. :label="dict.stationName"
  28. :value="dict.stationCode"
  29. />
  30. </el-select>
  31. <el-input
  32. v-else
  33. v-model="FormList[i.prop]"
  34. :placeholder="i.placeholder"
  35. :disabled="(i.prop == 'areaCode' && typeList.type == 2) || i.prop == 'stationCode'"
  36. :type="i.prop == 'remark' ? 'textarea' : ''"
  37. >
  38. <template #append v-if="i.prop == 'budget'"> 万元 </template>
  39. </el-input>
  40. </el-form-item>
  41. <el-form-item label="图片:">
  42. <ImageFileUpload :limit="3" :saveFileArr="FormList.fileSaveRequestList" :listType="'picture-card'" />
  43. </el-form-item>
  44. </el-form>
  45. </div>
  46. </div>
  47. </template>
  48. <script setup>
  49. import { projectInfoAdd, projectInfoEdit, stationInfolist, getInfolist } from '@/api/scada/areaInfo';
  50. import { areaInfoRules } from '@/utils/rules';
  51. import { areaInfoForm } from '@/utils/form';
  52. import ImageFileUpload from '@/components/ImageFileUpload/index.vue'; //图片文件上传
  53. const typeLista = ref({});
  54. const { proxy } = getCurrentInstance();
  55. const { typeList } = defineProps(['typeList']);
  56. const emits = defineEmits();
  57. defineExpose({ submit, closed, resetFiled });
  58. let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
  59.  
  60. function submit() {
  61. proxy.$refs.ruleForm.validate(valid => {
  62. if (valid) {
  63. let params = { ...FormList.value };
  64. if (typeList.type == 4) {
  65. projectInfoAdd(params).then(({ code }) => {
  66. if (code == 200) {
  67. proxy.$modal.msgSuccess('新增成功');
  68. emits('onModalClose');
  69. }
  70. });
  71. } else {
  72. projectInfoEdit(params).then(({ code }) => {
  73. if (code == 200) {
  74. proxy.$modal.msgSuccess('修改成功');
  75. emits('onModalClose');
  76. }
  77. });
  78. }
  79. }
  80. });
  81. }
  82. function resetFiled() {
  83. proxy.$refs.ruleForm.resetFields();
  84. FormList.value.fileSaveRequestList = [];
  85. }
  86. function closed() {
  87. emits('onModalClose');
  88. }
  89.  
  90. function stationNameChange(v) {
  91. FormList.value.stationCode = v;
  92. FormList.value.parentId = '';
  93. getInfolistM({ stationCode: v });
  94. }
  95. const stationInfolistM = async () => {
  96. let { data } = await stationInfolist();
  97. typeLista.value.stationName_type = data;
  98. };
  99. const getInfolistM = async p => {
  100. let { data } = await getInfolist(p);
  101. if (!!!data) return;
  102. typeLista.value.plc_station_type = data.filter(i => {
  103. return i.id != typeList.id;
  104. });
  105. };
  106. onMounted(() => {
  107. FormList.value = typeList;
  108. FormList.value.stationName = typeList.stationCode;
  109. stationInfolistM();
  110. getInfolistM({ stationCode: typeList.stationCode });
  111. });
  112. </script>
  113. <style lang="scss" scoped>
  114. .water-analysis-page {
  115. padding: 10px;
  116. }
  117. </style>