wszhyWx/src/views/page/history.vue

129 lines
4.3 KiB
Vue

<template>
<div class="formula history">
<!-- 历史记录 -->
<div class="page-content">
<div class="table-title">
<img src="../../assets/image/history.png" alt="" />
智慧水肥(历史数据)
</div>
<div class="search-flex">
<div class="search-left">
<span>快速查询</span>
<div class="">
<div :class="timeSel==index?'active':''" @click="timeSel=index" v-for="item,index in timeList" :key="index">{{ item }}</div>
</div>
</div>
<div class="search-right" v-if="timeSel==2">
<span>快速查询</span>
<el-date-picker
v-model="value1"
unlink-panels
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
<div class="input-btn">
<div class="btn green">
<img src="../../assets/image/irrigateSet1.png" alt="" />查询
</div>
<div class="btn blue">
<img src="../../assets/image/irrigateSet3.png" alt="" />下载
</div>
<div class="btn blue" >
<img src="../../assets/image/irrigateSet2.png" alt="" />统计
</div>
</div>
</div>
</div>
<div class="table-view">
<el-table :data="tableData" :row-class-name="tableRowClassName" height="420" style="width: 100%">
<el-table-column prop="data0" width="180" label="时间">
<template slot-scope="scope">
<div>2023-09-23 14:08:19</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="目标水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="200" label="1#肥EC(mS/cm)">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="200" label="目标水肥EC(mS/cm)">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="2#水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="水肥EC(mS/cm)">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="1#水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="200" label="2#水肥EC(mS/cm)">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="1#水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
<el-table-column prop="data0" width="160" label="1#水肥PH">
<template slot-scope="scope">
<div>111</div>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
tableData:[{},{},{},{},{},{},],
timeList:['今日','昨日','自定义'],
timeSel:0,
value1:''
}
},
mounted() { },
methods: {
tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 == 1) {
return 'warning-row';
} else if (rowIndex % 2 == 0) {
return 'success-row';
}
return '';
}
},
}
</script>
<style lang="scss"></style>