|
|
@@ -2,226 +2,299 @@
|
|
|
<!-- 激光测距仪页面 -->
|
|
|
<div class="global-variable">
|
|
|
<el-card class="box-card">
|
|
|
- <div class="searchbox">
|
|
|
- <el-collapse v-model="activeNames">
|
|
|
- <el-button
|
|
|
- size="small"
|
|
|
- @click="validateAndHandleChange"
|
|
|
- type="primary"
|
|
|
- >导入测量数据</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- size="small"
|
|
|
- @click="validateAndHandleChange"
|
|
|
- type="primary"
|
|
|
- >导入定位数据</el-button
|
|
|
+ <div>
|
|
|
+ <el-steps :active="stepsActive">
|
|
|
+ <el-step
|
|
|
+ title="导入数据"
|
|
|
+ :icon="UploadFilled"
|
|
|
+ @click="() => (stepsActive = 0)"
|
|
|
>
|
|
|
- <el-collapse-item title="数据筛选" name="1">
|
|
|
- <template #title>
|
|
|
- <div class="titleLeft">数据筛选</div>
|
|
|
- <div class="titleRight">
|
|
|
- <el-button type="primary" @click.stop="getTableData">
|
|
|
- 查询
|
|
|
- </el-button>
|
|
|
+ </el-step>
|
|
|
+ <el-step
|
|
|
+ title="数据计算"
|
|
|
+ :icon="Setting"
|
|
|
+ @click="() => (stepsActive = 1)"
|
|
|
+ ></el-step>
|
|
|
+ <el-step
|
|
|
+ title="查看结果"
|
|
|
+ :icon="Histogram"
|
|
|
+ @click="() => (stepsActive = 2)"
|
|
|
+ ></el-step>
|
|
|
+ </el-steps>
|
|
|
+ </div>
|
|
|
+ <div class="stepOne" v-if="stepsActive === 0">
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ drag
|
|
|
+ action=""
|
|
|
+ show-file-list
|
|
|
+ :accept="'.csv, .xlsx, .xls'"
|
|
|
+ :auto-upload="false"
|
|
|
+ limit="1"
|
|
|
+ >
|
|
|
+ <div class="iconText">
|
|
|
+ <app-icon icon="UploadFilled" size="50px" />
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 导入测量数据 <em>点击选择文件</em>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <template #tip>
|
|
|
+ <div class="el-upload__tip">
|
|
|
+ 导入测量数据 ，文件格式只能上传xlsx/xls、Excel、CSV 格式
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-upload>
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ drag
|
|
|
+ action=""
|
|
|
+ show-file-list
|
|
|
+ :accept="'.csv, .xlsx, .xls'"
|
|
|
+ :auto-upload="false"
|
|
|
+ limit="1"
|
|
|
+ >
|
|
|
+ <div class="iconText">
|
|
|
+ <app-icon icon="UploadFilled" size="50px" />
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 导入定位数据 <em>点击选择文件</em>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-button
|
|
|
- v-if="tabActiveName === 'list'"
|
|
|
- type="primary"
|
|
|
- @click.stop="onSubmit"
|
|
|
- >
|
|
|
- 导出
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <el-form
|
|
|
- :inline="true"
|
|
|
- :model="formInline"
|
|
|
- class="demo-form-inline"
|
|
|
- >
|
|
|
- <el-row :gutter="10">
|
|
|
- <el-col :xs="16" :sm="8" :md="7" :lg="6" :xl="4">
|
|
|
- <el-form-item label="场站">
|
|
|
- <selecttree
|
|
|
- style="width: 220px"
|
|
|
- placeholder="请选择场站"
|
|
|
- :list="parentOpt"
|
|
|
- type="1"
|
|
|
- v-model="formInline.companyCode"
|
|
|
- @change="parentChange"
|
|
|
- :defaultParentProps="{
|
|
|
- children: 'children',
|
|
|
- label: 'companyName',
|
|
|
- value: 'codeNumber',
|
|
|
- }"
|
|
|
- >
|
|
|
- </selecttree>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="16" :sm="8" :md="7" :lg="6" :xl="4">
|
|
|
- <el-form-item label="风机">
|
|
|
- <el-select
|
|
|
- v-model="formInline.unitvalue"
|
|
|
- placeholder="请选择"
|
|
|
- @change="handleWindTuebineData"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in unitoptions"
|
|
|
- :key="item.engineCode"
|
|
|
- :label="item.engineName"
|
|
|
- :value="item.engineCode"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :xs="24" :sm="14" :md="12" :lg="10" :xl="6">
|
|
|
- <el-form-item label="时间">
|
|
|
- <el-date-picker
|
|
|
- v-model="formInline.timevalue"
|
|
|
- type="daterange"
|
|
|
- range-separator="至"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
- </el-collapse-item>
|
|
|
- </el-collapse>
|
|
|
+ <template #tip>
|
|
|
+ <div class="el-upload__tip">
|
|
|
+ 导入定位数据 ，文件格式只能上传xlsx/xls、Excel、CSV 格式
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-upload>
|
|
|
+ <!-- <el-button @click="validateAndHandleChange" type="primary"
|
|
|
+ >导入测量数据</el-button
|
|
|
+ > -->
|
|
|
+ <!-- <el-button @click="validateAndHandleChange" type="primary"
|
|
|
+ >导入定位数据</el-button
|
|
|
+ > -->
|
|
|
</div>
|
|
|
- <div class="main-body">
|
|
|
- <div class="data-map">
|
|
|
- <el-tabs
|
|
|
- type="border-card"
|
|
|
- v-model="tabActiveName"
|
|
|
- @tab-click="handleTabChange"
|
|
|
+ <div class="stepTwo" v-if="stepsActive === 1">
|
|
|
+ <el-empty
|
|
|
+ :image-size="300"
|
|
|
+ v-loading="true"
|
|
|
+ element-loading-text="数据测量中..."
|
|
|
+ element-loading-background="rgba(255, 255, 255, 0.3)"
|
|
|
+ class="loadingView"
|
|
|
+ description=" "
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="stepThree" v-if="stepsActive === 2">
|
|
|
+ <div class="searchbox">
|
|
|
+ <el-collapse
|
|
|
+ v-model="activeNames"
|
|
|
+ v-if="tabActiveName !== 'copy' && tabActiveName !== 'init'"
|
|
|
>
|
|
|
- <el-tab-pane label="原始图" name="init">
|
|
|
- <template #label>
|
|
|
- <img
|
|
|
- style="width: 30px; height: 20px; display: inline-block"
|
|
|
- src="@/assets/analyse/04.png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- 原始图
|
|
|
- </template>
|
|
|
- <div class="boxContent">
|
|
|
- <div class="left" v-if="tabActiveName === 'init'">
|
|
|
- <el-empty
|
|
|
- description="暂无数据，请先进行数据筛选"
|
|
|
- :image-size="200"
|
|
|
- v-if="currentInitRow === null"
|
|
|
- ></el-empty>
|
|
|
- <div
|
|
|
- v-else-if="
|
|
|
- currentInitRow !== null && tabActiveName === 'init'
|
|
|
- "
|
|
|
+ <el-collapse-item title="数据筛选" name="1">
|
|
|
+ <template #title>
|
|
|
+ <div class="titleLeft">数据筛选</div>
|
|
|
+ <div class="titleRight">
|
|
|
+ <el-button type="primary" @click.stop="getTableData">
|
|
|
+ 查询
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ v-if="tabActiveName === 'list'"
|
|
|
+ type="primary"
|
|
|
+ @click.stop="onSubmit"
|
|
|
>
|
|
|
- <InitCharts
|
|
|
- ref="initCharts"
|
|
|
- :type="tabActiveName"
|
|
|
- :key="chartKey"
|
|
|
- ></InitCharts>
|
|
|
- <CylinderOfTower
|
|
|
- ref="waveformDiagram"
|
|
|
- type="Waveformdiagram"
|
|
|
- :key="chartKey"
|
|
|
- ></CylinderOfTower>
|
|
|
- <CylinderOfTower
|
|
|
- ref="spectrogram"
|
|
|
- type="spectrogram"
|
|
|
- :key="chartKey"
|
|
|
- ></CylinderOfTower>
|
|
|
- </div>
|
|
|
+ 导出
|
|
|
+ </el-button>
|
|
|
</div>
|
|
|
- <div class="right">
|
|
|
- <DescrBox
|
|
|
- type="init"
|
|
|
- :tableData="tableData"
|
|
|
- ref="initTable"
|
|
|
- :windName="windName"
|
|
|
- :windTurbineName="windTurbineName"
|
|
|
- :currentIndex="currentInitIndex"
|
|
|
- :currentRow="currentInitRow"
|
|
|
- @handleInitCurrentChange="handleInitCurrentChange"
|
|
|
- ></DescrBox>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="拟合图" name="copy">
|
|
|
- <template #label>
|
|
|
- <img
|
|
|
- style="width: 25px; height: 20px; display: inline-block"
|
|
|
- src="@/assets/analyse/01.png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- 拟合图
|
|
|
</template>
|
|
|
- <div class="boxContent" v-if="tabActiveName === 'copy'">
|
|
|
- <div class="left">
|
|
|
- <el-empty
|
|
|
- description="暂无数据，请先进行数据筛选"
|
|
|
- :image-size="200"
|
|
|
- v-if="currentCopyRow === null"
|
|
|
- ></el-empty>
|
|
|
- <div
|
|
|
- v-else-if="
|
|
|
- currentCopyRow !== null && tabActiveName === 'copy'
|
|
|
- "
|
|
|
- >
|
|
|
- <PlotOfFit
|
|
|
- type="LeafRootOutline"
|
|
|
- :key="chartKey"
|
|
|
- ></PlotOfFit>
|
|
|
- <PlotOfFit
|
|
|
- type="LeafRootRelativeOutline"
|
|
|
- :key="chartKey"
|
|
|
- ></PlotOfFit>
|
|
|
- <PlotOfFit
|
|
|
- type="LeafTipProfile"
|
|
|
- :key="chartKey"
|
|
|
- ></PlotOfFit>
|
|
|
- <PlotOfFit
|
|
|
- type="LeafTipRelativeProfile"
|
|
|
- :key="chartKey"
|
|
|
- ></PlotOfFit>
|
|
|
+ <el-form
|
|
|
+ :inline="true"
|
|
|
+ :model="formInline"
|
|
|
+ class="demo-form-inline"
|
|
|
+ >
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :xs="16" :sm="8" :md="7" :lg="6" :xl="4">
|
|
|
+ <el-form-item label="场站">
|
|
|
+ <selecttree
|
|
|
+ style="width: 220px"
|
|
|
+ placeholder="请选择场站"
|
|
|
+ :list="parentOpt"
|
|
|
+ type="1"
|
|
|
+ v-model="formInline.companyCode"
|
|
|
+ @change="parentChange"
|
|
|
+ :defaultParentProps="{
|
|
|
+ children: 'children',
|
|
|
+ label: 'companyName',
|
|
|
+ value: 'codeNumber',
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ </selecttree>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="16" :sm="8" :md="7" :lg="6" :xl="4">
|
|
|
+ <el-form-item label="风机">
|
|
|
+ <el-select
|
|
|
+ v-model="formInline.unitvalue"
|
|
|
+ placeholder="请选择"
|
|
|
+ @change="handleWindTuebineData"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in unitoptions"
|
|
|
+ :key="item.engineCode"
|
|
|
+ :label="item.engineName"
|
|
|
+ :value="item.engineCode"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="14" :md="12" :lg="10" :xl="6">
|
|
|
+ <el-form-item label="时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="formInline.timevalue"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
+ </div>
|
|
|
+ <div class="main-body">
|
|
|
+ <div class="data-map">
|
|
|
+ <el-tabs
|
|
|
+ type="border-card"
|
|
|
+ v-model="tabActiveName"
|
|
|
+ @tab-click="handleTabChange"
|
|
|
+ >
|
|
|
+ <el-tab-pane label="原始图" name="init">
|
|
|
+ <template #label>
|
|
|
+ <img
|
|
|
+ style="width: 30px; height: 20px; display: inline-block"
|
|
|
+ src="@/assets/analyse/04.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ 原始图
|
|
|
+ </template>
|
|
|
+ <div class="boxContent">
|
|
|
+ <div class="left" v-if="tabActiveName === 'init'">
|
|
|
+ <el-empty
|
|
|
+ description="暂无数据，请先进行数据筛选"
|
|
|
+ :image-size="200"
|
|
|
+ v-if="currentInitRow === null"
|
|
|
+ ></el-empty>
|
|
|
+ <div
|
|
|
+ v-else-if="
|
|
|
+ currentInitRow !== null && tabActiveName === 'init'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <InitCharts
|
|
|
+ ref="initCharts"
|
|
|
+ :type="tabActiveName"
|
|
|
+ :key="chartKey"
|
|
|
+ ></InitCharts>
|
|
|
+ <CylinderOfTower
|
|
|
+ ref="waveformDiagram"
|
|
|
+ type="Waveformdiagram"
|
|
|
+ :key="chartKey"
|
|
|
+ ></CylinderOfTower>
|
|
|
+ <CylinderOfTower
|
|
|
+ ref="spectrogram"
|
|
|
+ type="spectrogram"
|
|
|
+ :key="chartKey"
|
|
|
+ ></CylinderOfTower>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ <DescrBox
|
|
|
+ type="init"
|
|
|
+ :tableData="tableData"
|
|
|
+ ref="initTable"
|
|
|
+ :windName="windName"
|
|
|
+ :windTurbineName="windTurbineName"
|
|
|
+ :currentIndex="currentInitIndex"
|
|
|
+ :currentRow="currentInitRow"
|
|
|
+ @handleInitCurrentChange="handleInitCurrentChange"
|
|
|
+ ></DescrBox>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="right">
|
|
|
- <DescrBox
|
|
|
- type="copy"
|
|
|
- ref="copyTable"
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="拟合图" name="copy">
|
|
|
+ <template #label>
|
|
|
+ <img
|
|
|
+ style="width: 25px; height: 20px; display: inline-block"
|
|
|
+ src="@/assets/analyse/01.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ 拟合图
|
|
|
+ </template>
|
|
|
+ <div class="boxContent" v-if="tabActiveName === 'copy'">
|
|
|
+ <div class="left">
|
|
|
+ <el-empty
|
|
|
+ description="暂无数据，请先进行数据筛选"
|
|
|
+ :image-size="200"
|
|
|
+ v-if="currentCopyRow === null"
|
|
|
+ ></el-empty>
|
|
|
+ <div
|
|
|
+ v-else-if="
|
|
|
+ currentCopyRow !== null && tabActiveName === 'copy'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <PlotOfFit
|
|
|
+ type="LeafRootOutline"
|
|
|
+ :key="chartKey"
|
|
|
+ ></PlotOfFit>
|
|
|
+ <PlotOfFit
|
|
|
+ type="LeafRootRelativeOutline"
|
|
|
+ :key="chartKey"
|
|
|
+ ></PlotOfFit>
|
|
|
+ <PlotOfFit
|
|
|
+ type="LeafTipProfile"
|
|
|
+ :key="chartKey"
|
|
|
+ ></PlotOfFit>
|
|
|
+ <PlotOfFit
|
|
|
+ type="LeafTipRelativeProfile"
|
|
|
+ :key="chartKey"
|
|
|
+ ></PlotOfFit>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="right">
|
|
|
+ <DescrBox
|
|
|
+ type="copy"
|
|
|
+ ref="copyTable"
|
|
|
+ :windName="windName"
|
|
|
+ :windTurbineName="windTurbineName"
|
|
|
+ :tableData="tableData"
|
|
|
+ :currentRow="currentCopyRow"
|
|
|
+ :currentIndex="currentCopyIndex"
|
|
|
+ @handleCopyCurrentChange="handleCopyCurrentChange"
|
|
|
+ ></DescrBox>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="数据列表" name="list">
|
|
|
+ <template #label>
|
|
|
+ <img
|
|
|
+ style="width: 20px; height: 20px; display: inline-block"
|
|
|
+ src="@/assets/analyse/dataList1.png"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ 数据列表
|
|
|
+ </template>
|
|
|
+ <div>
|
|
|
+ <MultilevelTable
|
|
|
+ ref="multilevelTable"
|
|
|
:windName="windName"
|
|
|
:windTurbineName="windTurbineName"
|
|
|
:tableData="tableData"
|
|
|
- :currentRow="currentCopyRow"
|
|
|
- :currentIndex="currentCopyIndex"
|
|
|
- @handleCopyCurrentChange="handleCopyCurrentChange"
|
|
|
- ></DescrBox>
|
|
|
+ ></MultilevelTable>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="数据列表" name="list">
|
|
|
- <template #label>
|
|
|
- <img
|
|
|
- style="width: 20px; height: 20px; display: inline-block"
|
|
|
- src="@/assets/analyse/dataList1.png"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- 数据列表
|
|
|
- </template>
|
|
|
- <div>
|
|
|
- <MultilevelTable
|
|
|
- ref="multilevelTable"
|
|
|
- :windName="windName"
|
|
|
- :windTurbineName="windTurbineName"
|
|
|
- :tableData="tableData"
|
|
|
- ></MultilevelTable>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
@@ -245,6 +318,7 @@ import axios from "axios";
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ stepsActive: 0,
|
|
|
chartKey: 0, // 用于强制重新渲染子组件
|
|
|
activeNames: ["1"],
|
|
|
tabActiveName: "init",
|
|
|
@@ -440,6 +514,50 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+.global-variable {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .box-card {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ :deep(.el-card__body) {
|
|
|
+ height: 100% !important;
|
|
|
+ width: 100%;
|
|
|
+ // background-color: aqua;
|
|
|
+ }
|
|
|
+ .stepOne {
|
|
|
+ margin-top: 30px;
|
|
|
+ height: calc(100% - 150px);
|
|
|
+ // height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ display: flex !important;
|
|
|
+ justify-content: space-around;
|
|
|
+
|
|
|
+ .upload-demo {
|
|
|
+ width: 48%;
|
|
|
+ height: 100%;
|
|
|
+ :deep(.el-upload) {
|
|
|
+ width: 100%;
|
|
|
+ height: 80%;
|
|
|
+ }
|
|
|
+ :deep(.el-upload-dragger) {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .stepTwo {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ height: calc(100% - 100px);
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
.searchbox {
|
|
|
p {
|
|
|
margin-right: 20px;
|
|
|
@@ -448,15 +566,13 @@ export default {
|
|
|
width: 180px;
|
|
|
}
|
|
|
|
|
|
- .titleLeft {
|
|
|
- }
|
|
|
::v-deep .el-collapse-item__header {
|
|
|
position: relative !important;
|
|
|
}
|
|
|
.titleRight {
|
|
|
display: flex;
|
|
|
position: absolute;
|
|
|
- right: 100px;
|
|
|
+ right: 50px;
|
|
|
}
|
|
|
}
|
|
|
.dialog-actions {
|
