101 lines
3.1 KiB
Vue
101 lines
3.1 KiB
Vue
<template>
|
|
<div>
|
|
<div class="down">
|
|
<el-dropdown trigger="click" @command="handleCommand">
|
|
<span>编辑<i class="el-icon-caret-bottom"></i></span>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item command="show">查看详情</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</div>
|
|
<el-dialog title="编辑" :visible.sync="dialogVisible" width="40%" :before-close="handleClose">
|
|
<el-form :model="msg" label-width="80px">
|
|
<el-form-item label="val1">
|
|
<el-time-select placeholder="起始时间" v-model="startTime"
|
|
:picker-options="{ start: '08:30', step: '00:15', end: '18:30' }">
|
|
</el-time-select>
|
|
<el-time-select placeholder="结束时间" v-model="endTime"
|
|
:picker-options="{ start: '08:30', step: '00:15', end: '18:30', minTime: startTime }">
|
|
</el-time-select>
|
|
</el-form-item>
|
|
<el-form-item label="val2">
|
|
<el-select>
|
|
<el-option>
|
|
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="val3">
|
|
<el-input v-model="msg[0].val3"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="val4">
|
|
<el-checkbox-group v-model="checkList">
|
|
<el-checkbox label="数值"></el-checkbox>
|
|
<el-checkbox label="表格"></el-checkbox>
|
|
<el-checkbox label="时间曲线图"></el-checkbox>
|
|
<el-checkbox label="均值图"></el-checkbox>
|
|
</el-checkbox-group>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="onSubmit">确认</el-button>
|
|
<el-button @click="dialogVisible = false">取消</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
name: 'detailDialog',//速度组件
|
|
props: {
|
|
msg: {
|
|
type: Array,
|
|
default() {
|
|
return []
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
dialogVisible: false,
|
|
startTime: '',
|
|
endTime: '',
|
|
checkList: ['复选框 A']
|
|
}
|
|
},
|
|
methods: {
|
|
onSubmit(){
|
|
|
|
},
|
|
handleCommand(command) { // 用户名下拉菜单选择事件
|
|
if (command == 'show') {
|
|
this.dialogVisible = true
|
|
}
|
|
},
|
|
handleClose(done) {
|
|
this.$confirm('确认关闭？')
|
|
.then(_ => {
|
|
done();
|
|
})
|
|
.catch(_ => { });
|
|
},
|
|
|
|
},
|
|
mounted() {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.down {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 10px;
|
|
z-index: 100;
|
|
}
|
|
.el-form-item{
|
|
margin-bottom: 20px;
|
|
}
|
|
</style> |