338 lines
10 KiB
Vue
338 lines
10 KiB
Vue
<script>
|
||
import {invoke} from "@tauri-apps/api/tauri";
|
||
import { dialog, fs } from "@tauri-apps/api";
|
||
import * as echarts from "echarts";
|
||
import SerialportMethod from "../SerialPort/SerialportMethod.js";
|
||
|
||
export default {
|
||
name: "SetWavelenth",
|
||
data() {
|
||
return {
|
||
option: {},
|
||
Devinfo: {
|
||
work_mode: 0,
|
||
bochangxishu: {
|
||
a0: 0,
|
||
a1: 0,
|
||
a2: 0,
|
||
a3: 0
|
||
},
|
||
|
||
},
|
||
shutter_time_up: 0,
|
||
Data:{}
|
||
}
|
||
},
|
||
async mounted() {
|
||
let that=this;
|
||
//await
|
||
await setTimeout(function() {
|
||
that.GetSenSorInfo();
|
||
// 这里是你要在100毫秒后执行的代码
|
||
|
||
}, 100);
|
||
await setTimeout(function() {
|
||
that.GetSenSorInfo();
|
||
// 这里是你要在100毫秒后执行的代码
|
||
that.initChart();
|
||
}, 1000);
|
||
|
||
},
|
||
|
||
|
||
methods: {
|
||
async GetSenSorInfo() {
|
||
var Command = {command: "get_sensor_info"};
|
||
let data = {
|
||
data: Command,
|
||
datatype: "json"
|
||
}
|
||
let message = await invoke("sendtoport_andgetreturn", data);
|
||
this.Devinfo = JSON.parse(message.content);
|
||
|
||
},
|
||
async OPT_devic(){
|
||
var shuttertime = await SerialportMethod.Dev_Opt();
|
||
this.shutter_time_up = shuttertime;
|
||
|
||
},
|
||
async initChart() {
|
||
await this.$nextTick();
|
||
const chartDom = this.$refs.chart_weavelenth;
|
||
// chartDom.style.width = '100%';
|
||
// chartDom.style.height = '100%';
|
||
let height = chartDom.offsetHeight;
|
||
let width = chartDom.clientWidth;
|
||
let chart = echarts.init(chartDom);
|
||
var coeff=[];
|
||
coeff[0]=this.Devinfo.bochangxishu.a0;
|
||
coeff[1]=this.Devinfo.bochangxishu.a1;
|
||
coeff[2]=this.Devinfo.bochangxishu.a2;
|
||
coeff[3]=this.Devinfo.bochangxishu.a3;
|
||
this.option = {
|
||
// ECharts 配置选项
|
||
xAxis: {
|
||
type: 'value',
|
||
boundaryGap: false,// 显示连续的刻度
|
||
min: 0,
|
||
max: 510,
|
||
dataZoom: [
|
||
{
|
||
type: 'inside', // 内置数据区域缩放
|
||
start: 0, // 初始缩放范围的起始位置（0%）
|
||
end: 100 // 初始缩放范围的结束位置（100%）
|
||
}
|
||
]
|
||
},
|
||
animation: false,
|
||
yAxis: {
|
||
type: 'value',
|
||
//min:0,
|
||
},
|
||
grid: {
|
||
left: 60,
|
||
right: '5%',
|
||
bottom: '5%',
|
||
top: '5%'
|
||
},
|
||
dataZoom: [
|
||
{
|
||
type: 'inside', // 内置数据区域缩放，包括滚轮缩放
|
||
xAxisIndex: [0], // 对应 x 轴
|
||
filterMode: 'none' // 不过滤数据
|
||
},
|
||
{
|
||
type: 'inside', // 内置数据区域缩放，包括滚轮缩放
|
||
yAxisIndex: [0], // 对应 y 轴
|
||
filterMode: 'none' // 不过滤数据
|
||
}
|
||
],
|
||
|
||
|
||
// legend: {
|
||
// data: ['曲线'], // 图例名称
|
||
// show: true ,// 显示图例
|
||
// //selectedMode: 'multiple', // 图例的选择模式。默认开启图例开关，可选single，multiple
|
||
// },
|
||
series: [
|
||
{
|
||
data: [[1, 150], [2, 230], [3, 224], [4, 218], [5, 135], [6, 147], [7, 260]], // 使用二维数组表示数据点的坐标
|
||
type: 'line',
|
||
symbol: 'none', // 不显示数据点
|
||
smooth: false, // 不使用平滑处理
|
||
step: 'start' // 设置 step 类型的起始位置
|
||
}
|
||
]
|
||
};
|
||
let bandnum=this.Devinfo.bandnum-1;
|
||
this.option.xAxis.max =coeff[3];
|
||
|
||
this.option.xAxis.min = bandnum*bandnum*bandnum*coeff[0]+bandnum*bandnum*coeff[1]+bandnum*coeff[2]+coeff[3];
|
||
|
||
chart.setOption(this.option);
|
||
chart.dispatchAction({
|
||
type: 'resize',
|
||
|
||
// 可以指定宽和高，如果不指定则默认取容器的大小
|
||
// width: '新的宽度',
|
||
// height: '新的高度'
|
||
});
|
||
chart.resize();
|
||
},
|
||
async findpeak(){
|
||
let dataforpeak=this.Data.data;
|
||
var peaks=await invoke("find_peek",{data:dataforpeak,minheigh:1000});
|
||
console.log(peaks);
|
||
let peaksforshow=[];
|
||
let coeffweave1=this.Devinfo.bochangxishu.a0;
|
||
let coeffweave2=this.Devinfo.bochangxishu.a1;
|
||
let coeffweave3=this.Devinfo.bochangxishu.a2;
|
||
let coeffweave4=this.Devinfo.bochangxishu.a3;
|
||
|
||
peaks.forEach(element => {
|
||
var weave=coeffweave1*element[0]*element[0]*element[0]+coeffweave2*element[0]*element[0]+coeffweave3*element[0]+coeffweave4;
|
||
peaksforshow.push([weave,element[1],element[0]]);
|
||
});
|
||
|
||
|
||
|
||
|
||
|
||
let chartpeak=
|
||
{
|
||
data:peaksforshow, // 使用二维数组表示数据点的坐标
|
||
type: 'scatter',
|
||
label: {
|
||
show: true,
|
||
position: 'top',
|
||
formatter: function (params) {
|
||
return params.value[2]
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
if (this.option.series.length<2)
|
||
{
|
||
this.option.series.push(chartpeak);
|
||
}
|
||
else
|
||
{
|
||
this.option.series[1]=chartpeak;
|
||
}
|
||
var chart_up = echarts.getInstanceByDom(this.$refs.chart_weavelenth);
|
||
chart_up.setOption(this.option);
|
||
|
||
|
||
|
||
},
|
||
async GetOneData(){
|
||
let coeffweave1=this.Devinfo.bochangxishu.a0;
|
||
let coeffweave2=this.Devinfo.bochangxishu.a1;
|
||
let coeffweave3=this.Devinfo.bochangxishu.a2;
|
||
let coeffweave4=this.Devinfo.bochangxishu.a3;
|
||
|
||
var data = await SerialportMethod.Get_Date_on_Derction("UP",this.shutter_time_up,false,1)
|
||
this.Data=data; //获取波长系数
|
||
var lenthofdata=data.data.length;
|
||
let dataforshow=[];
|
||
for (var i=0;i<lenthofdata;i++)
|
||
{
|
||
var weave=coeffweave1*i*i*i+coeffweave2*i*i+coeffweave3*i+coeffweave4;
|
||
dataforshow.push([weave,data.data[i]]);
|
||
}
|
||
this.option.series[0].data = dataforshow;
|
||
|
||
var chart_up = echarts.getInstanceByDom(this.$refs.chart_weavelenth);
|
||
chart_up.setOption(this.option);
|
||
|
||
// console.log(dataforshow);
|
||
|
||
},
|
||
async Set_Weave_Coeff() {
|
||
await SerialportMethod.Set_Weave_Coeff(0, this.Devinfo.bochangxishu.a0, this.Devinfo.bochangxishu.a1, this.Devinfo.bochangxishu.a2, this.Devinfo.bochangxishu.a3);
|
||
await this.saveCoeffToFile();
|
||
},
|
||
async saveCoeffToFile() {
|
||
const now = new Date();
|
||
const pad = n => String(n).padStart(2, '0');
|
||
const dateStr = `${now.getFullYear()}${pad(now.getMonth()+1)}${pad(now.getDate())}_${pad(now.getHours())}${pad(now.getMinutes())}${pad(now.getSeconds())}`;
|
||
const serial = this.Devinfo?.serialnumber || this.Devinfo?.SerilNumber || "Unknown";
|
||
const defaultName = `${serial}_${dateStr}.json`;
|
||
|
||
const savePath = await dialog.save({
|
||
defaultPath: defaultName,
|
||
filters: [{ name: "JSON文件", extensions: ["json"] }]
|
||
});
|
||
if (!savePath) return;
|
||
|
||
const data = {
|
||
serialnumber: serial,
|
||
saveTime: now.toISOString(),
|
||
sensor_type: this.Devinfo?.sensor_type || "",
|
||
bochangxishu: {
|
||
a0: this.Devinfo.bochangxishu.a0,
|
||
a1: this.Devinfo.bochangxishu.a1,
|
||
a2: this.Devinfo.bochangxishu.a2,
|
||
a3: this.Devinfo.bochangxishu.a3,
|
||
}
|
||
};
|
||
|
||
await fs.writeTextFile(savePath, JSON.stringify(data, null, 2));
|
||
}
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
|
||
<template >
|
||
<div class="container" style="width: 100%;height: 100%;margin: 0px;padding: 0px">
|
||
<div class="row" style="height: 100%">
|
||
|
||
|
||
<div class="col-2">
|
||
<b-input-group class="my-1" >
|
||
<BInputGroupPrepend is-text class="myinputprepend">a0</BInputGroupPrepend>
|
||
<b-form-input type="number" step="0.00000000000001" v-model="Devinfo.bochangxishu.a0" ></b-form-input>
|
||
</b-input-group>
|
||
|
||
<b-input-group class="my-1" >
|
||
<BInputGroupPrepend is-text class="myinputprepend">a1</BInputGroupPrepend>
|
||
<b-form-input type="number" step="0.00000000000001" v-model="Devinfo.bochangxishu.a1" ></b-form-input>
|
||
</b-input-group>
|
||
|
||
<b-input-group class="my-1" >
|
||
<BInputGroupPrepend is-text class="myinputprepend">a2</BInputGroupPrepend>
|
||
<b-form-input type="number" step="0.00000000000001" v-model="Devinfo.bochangxishu.a2" ></b-form-input>
|
||
</b-input-group>
|
||
|
||
<b-input-group class="my-1" >
|
||
<BInputGroupPrepend is-text class="myinputprepend">a3</BInputGroupPrepend>
|
||
<b-form-input type="number" step="0.00000000000001" v-model="Devinfo.bochangxishu.a3" ></b-form-input>
|
||
</b-input-group>
|
||
|
||
<p style="position:absolute ;bottom: 10px;width: 100%;height: 30px" >
|
||
<b-button @click="GetSenSorInfo" style="position:absolute;right: 20px ">恢复</b-button>
|
||
</p>
|
||
|
||
</div>
|
||
<div class="col-10">
|
||
|
||
<div style="position: relative; height: 90%;width: 100%;">
|
||
<b-button @click="findpeak()" style="position:absolute;right: 20px;z-index: 10; ">寻峰</b-button>
|
||
<div class="chart-container" ref="chart_weavelenth"></div>
|
||
</div>
|
||
<p style="position:absolute ;bottom: 10px;width: 100%;height: 30px" >
|
||
<b-input-group append="ms" style="position:absolute;left: 20px;width:20% ">
|
||
<b-input-group-prepend>
|
||
<b-button variant="secondary" style="margin: auto" @click="OPT_devic(0)">OPT</b-button>
|
||
</b-input-group-prepend>
|
||
<b-form-input v-model="shutter_time_up"></b-form-input>
|
||
|
||
|
||
</b-input-group>
|
||
<b-button @click="GetOneData" style="position:absolute;left: 25% ">获取数据</b-button>
|
||
<b-button @click="updataName" style="position:absolute; right: 50% ">计算</b-button>
|
||
<b-button @click="Set_Weave_Coeff" style="position:absolute;right: 20px ">设置</b-button>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
|
||
|
||
|
||
</template>
|
||
|
||
<style scoped>
|
||
.col-2 {
|
||
background-color: #f8f9fa;
|
||
padding-top: 0px;
|
||
padding-bottom: 0px;
|
||
padding: 0px;
|
||
border-right: 1px solid #d2dede;
|
||
position: relative;
|
||
|
||
}
|
||
|
||
.col-10 {
|
||
padding: 0px;
|
||
position: relative;
|
||
|
||
}
|
||
.chart-container {
|
||
background-color: #f8f9fa;
|
||
width:100%;
|
||
height: 100%;
|
||
|
||
}
|
||
.container {
|
||
background-color: #f8f9fa;
|
||
width:100%;
|
||
height: 100%;
|
||
max-width: 100%;
|
||
}
|
||
</style>
|