时间颗粒度选择(通过选择时间范围和颗粒度展示选项)

<template>

<div>

<el-time-select

placeholder="起始时间"

v-model="startTime"

:picker-options="startPickerOptions"

@change="changeStartTime"

>

</el-time-select>

<el-time-select

placeholder="结束时间"

v-model="endTime"

@change="changeEndTime"

:picker-options="endPickerOptions">

</el-time-select>

<el-select v-model="timeValue" placeholder="请选择" @change="changeTimeValue" value-key="label">

<el-option

v-for="item in timeOptions"

:key="item.value"

:label="item.label"

:value="item.value">

</el-option>

</el-select>

<el-table

:data="formatData"

ref="flowTable"

max-height="100%"

border

style="width:100%"

class="el_table"

>

<el-table-column

:key="i"

v-for="(item, i) in tableColumnData2"

:prop="item.value"

:label="item.time"

width="100"

align="center"

>

</el-table-column>

</el-table>

</div>

</template>

<script>

export default {

name: 'test',

data(){

return {

formatData: [],

tableColumnData2: [],

startTime: '07:00',

endTime: '09:00',

startPickerOptions: {

start: "00:00",

step: "01:00",

end: "24:00",

},

endPickerOptions: {

start: "00:00",

step: "01:00",

end: "24:00",

},

timeValue: '选项1',

timeOptions: [

{

value: '选项1',

label: '5分钟'

},

{

value: '选项2',

label: '10分钟'

},

{

value: '选项3',

label: '15分钟'

}

],

timeSection: 5,

}

},

mounted(){

this.getTableTimeColumn(this.timeSection, this.startTime, this.endTime)

},

methods:{

changeTimeValue(e){

switch(e){

case('选项1'):

this.timeSection = 5

break;

case('选项2'):

this.timeSection = 10

break;

case('选项3'):

this.timeSection = 15

break;

}

this.getTableTimeColumn(this.timeSection, this.startTime, this.endTime)

},

// 拿到各个时间区间

getTableTimeColumn(timeSection = 5, startTime, endTime){

this.tableColumnData2 = []

let start = this.getHour(startTime)

let end = this.getHour(endTime)

let key = 0

let hour

for(let i = start; i < end; i++){

for(let j = 0; j < 60; j+= timeSection){

let k = j + timeSection

hour = i

if(k == 60 && i < end){

k = 0

hour = i + 1

}

let secondJ = this.setMinute(j)

let secondK = this.setMinute(k)

this.tableColumnData2.push({

time: `${i}: ${secondJ}~${hour}: ${secondK}`,

timekey: `time${++key}`,

timetype: `${key}`

})

}

}

},

// 返回小时

getHour(time){

if(time){

let first = time.split(':')

return Number(first[0])

} else {

return ''

}

},

// 时间格式转换

setMinute(n) {

return n < 10 ? "0" + n : n;

},

changeStartTime() {

this.endTime = ''

if (this.startTime == null) {

} else {

let startTimeArr = this.startTime.split(":")

let start0 = Number(startTimeArr[0]) + 1

let start1 = Number(startTimeArr[1])

let endStr = ""

endStr = this.setMinute(start0) + ":" + '00'

this.endPickerOptions = {

start: endStr,

step: "01:00",

end: '24:00'

};

}

},

changeEndTime(){

if(this.startTime && this.endTime){

this.getTableTimeColumn(this.timeSection, this.startTime, this.endTime)

// this.getSelTurnFlowFun(this.fData.roadHlInterId, this.directionArrNo, this.directionArr)

}

},

}

}

</script>

<style scoped>

</style>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
edem颗粒堆积是一种用于研究和模拟颗粒流动和物料堆积行为的软件系统。下面是一个简单的edem颗粒堆积教程。 首先,我们需要安装edem软件并打开它。在打开的界面上,我们可以看到不同的工具栏和选项卡,它们用于定义颗粒系统的属性和进行模拟。 接下来,我们需要创建一个颗粒堆积场景。选择“New Scene”选项创建一个新场景。在场景中我们可以定义颗粒的物理属性,如粒径、密、摩擦系数等。我们还可以添加边界和障碍物来模拟真实的堆积环境。 然后,我们需要定义颗粒的初始分布和运动。在“Particles”选项卡中,我们可以选择粒子的初始状态,如位置、速、角等。我们可以使用随机分布或者自定义分布来生成颗粒。 接下来,我们需要设置颗粒的相互作用力。在“Physics”选项卡中,我们可以选择不同的物理模型来模拟颗粒之间的碰撞、摩擦和聚集力。我们可以调整这些参数以控制颗粒的运动和堆积行为。 最后,我们可以运行模拟并观察颗粒的堆积过程。在“Simulation”选项卡中,我们可以设置模拟的时间步长和结束时间。点击“Run”按钮开始模拟,然后我们可以观察颗粒如何在堆积过程中相互作用并形成堆积。 edem颗粒堆积教程范围很大,以上只是简单介绍了一些基本步骤。实际应用中,我们还可以使用更多高级功能和分析工具来研究颗粒的流动性、堆积性、堆积形状等问题。希望这个简要教程能够帮助您入门edem颗粒堆积建模和模拟。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值