联调承载能力评估 技术监督ui绘制

src/views/pqs/supervise/interfere/components/undocumented.vue

@@ -24,7 +24,7 @@
         </template>
         <template #operation>
             <el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
-            <el-button icon="el-icon-Upload" type="primary">上传</el-button>
+            <el-button icon="el-icon-Upload" type="primary" @click="clcUpload">上传</el-button>
             <el-button icon="el-icon-Sort" type="primary">关联</el-button>
             <el-button icon="el-icon-Download" type="primary">导出</el-button>
         </template>
@@ -72,15 +72,106 @@
             <el-button type="primary" class="ml20" @click="userAdd = false">取消</el-button>
         </div>
     </el-dialog>
+    <!-- 上传 -->
+    <el-dialog title="未建档干扰源用户入网报告结论上传" v-model="uploadConclusions" width="1600px">
+        <el-divider content-position="left">基本信息</el-divider>
+        <el-form :inline="true" label-width="100px">
+            <el-form-item label="所属单位:">
+                <el-input v-model="addData.orgNo" clearable placeholder="请输入所属单位" disabled></el-input>
+            </el-form-item>
+            <el-form-item label="干扰源类型:">
+                <el-select v-model="addData.loadType" clearable collapse-tags placeholder="请选择" disabled>
+                    <el-option
+                        v-for="item in interferenceType"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                    ></el-option>
+                </el-select>
+            </el-form-item>
+
+            <el-form-item label="干扰源用户名称:">
+                <el-input v-model="addData.userName" clearable placeholder="请输入关键字" disabled></el-input>
+            </el-form-item>
+            <el-form-item label="建档时间:">
+                <el-date-picker
+                    value-format="yyyy-MM-dd HH:mm:ss"
+                    v-model="addData.recordTime"
+                    disabled
+                    type="datetime"
+                    placeholder="选择日期时间"
+                ></el-date-picker>
+            </el-form-item>
+
+            <el-divider content-position="left" style="font-weight: bolder; font-size: 18px">
+                入网评估报告上传
+            </el-divider>
+            <el-form-item class="item" label="上传文件:">
+                <el-upload
+                    v-model:file-list="fileList"
+                    ref="upload"
+                    action=""
+                    :limit="1"
+                    :on-exceed="handleExceed"
+                    :auto-upload="false"
+                >
+                    <template #trigger>
+                        <el-button type="primary">上传文件</el-button>
+                    </template>
+                </el-upload>
+            </el-form-item>
+            <el-divider content-position="left" style="font-weight: bolder; font-size: 18px">
+                入网评估结论填报
+            </el-divider>
+            <el-form-item label="是否超标:" style="margin-top: 20px">
+                <el-radio v-model="addForm.iIsOverLimit" label="0">是</el-radio>
+                <el-radio v-model="addForm.iIsOverLimit" label="1">否</el-radio>
+            </el-form-item>
+            <br />
+            <el-form-item label="超标指标:" style="margin-top: 20px">
+                <el-checkbox-group v-model="addForm.IOverLimitTarget">
+                    <el-checkbox v-for="(item, ind) in exceeded" :label="item.id">
+                        {{ item.name }}
+                    </el-checkbox>
+                </el-checkbox-group>
+            </el-form-item>
+            <br />
+            <el-form-item label="计划采取措施:" style="margin-top: 20px">
+                <el-select v-model="addForm.IPlanStep" placeholder="请选择">
+                    <el-option
+                        v-for="item in takeMeasures"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                    ></el-option>
+                </el-select>
+            </el-form-item>
+            <br />
+            <el-form-item label="入网详情:" style="margin-top: 20px">
+                <el-input
+                    v-model="addForm.IDescription"
+                    :autosize="{ minRows: 2, maxRows: 4 }"
+                    placeholder="请输入入网详情"
+                    type="textarea"
+                    style="width: 500px"
+                ></el-input>
+            </el-form-item>
+        </el-form>
+        <div style="display: flex; justify-content: center; margin-top: 30px">
+            <el-button type="primary" class="ml20" @click="submit">提交</el-button>
+            <el-button type="primary" class="ml20" @click="preservation">保存</el-button>
+            <el-button type="primary" class="ml20" @click="uploadConclusions = false">取消</el-button>
+        </div>
+    </el-dialog>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, provide, nextTick } from 'vue'
 import TableStore from '@/utils/tableStore'
 import Table from '@/components/table/index.vue'
 import TableHeader from '@/components/table/header/index.vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
 import Area from '@/components/form/area/index.vue'
-
+import type { UploadInstance, UploadProps, UploadRawFile, ElMessage, ElMessageBox } from 'element-plus'
+import { genFileId } from 'element-plus'
 import { mainHeight } from '@/utils/layout'
 import { useDictData } from '@/stores/dictData'
 import { addUse, updateUse, removeUse } from '@/api/advance-boot/bearingCapacity'
@@ -98,17 +189,26 @@ const process = [
     }
 ]
 
-const dialogVisible = ref(false)
+const uploadConclusions = ref(false)
 const TableHeaderRef = ref()
 const interferenceType = dictData.getBasicData('Interference_Source')
+const exceeded = dictData.getBasicData('Steady_Statis')
+const takeMeasures = dictData.getBasicData('Plan_Take')
 const addData = ref({
     orgNo: dictData.state.area[0].id,
     loadType: '',
     userName: '',
     recordTime: ''
 })
-
+const addForm: any = ref({
+    IDescription: '',
+    iIsOverLimit: '',
+    IPlanStep: '',
+    IOverLimitTarget: []
+})
+const upload = ref()
 const ruleFormRef = ref()
+const fileList = ref([])
 const tableStore = new TableStore({
     url: '/system-boot/area/areaSelect',
     publicHeight: 65,
@@ -187,8 +287,31 @@ provide('tableStore', tableStore)
 const add = () => {
     userAdd.value = true
 }
+// 提交
+const submit = () => {
+    console.log(123, fileList.value)
+}
+// 保存
+const preservation = () => {}
+
+const handleExceed: UploadProps['onExceed'] = files => {
+    upload.value!.clearFiles()
+    const file = files[0] as UploadRawFile
+    file.uid = genFileId()
+    upload.value!.handleStart(file)
+}
+// 点击上传
+const clcUpload = () => {
+    uploadConclusions.value = true
+}
 
 onMounted(() => {
     tableStore.index()
 })
 </script>
+
+<style scoped lang="scss">
+::v-deep .el-upload-list__item {
+    width: 400px;
+}
+</style>