2 changed files with 371 additions and 13 deletions
@ -1,19 +1,372 @@ |
|||||
<template> |
<template> |
||||
<div> |
<!-- 项目滞留超期提醒 --> |
||||
|
<div class="m-body"> |
||||
|
<el-tag class="mh"> |
||||
|
<div class="h-left"> |
||||
|
项目滞留超期提醒 |
||||
|
</div> |
||||
|
<div class="h-right"> |
||||
|
<button class="h-right-one">恢复默认</button> |
||||
|
<button class="h-right-two">保存设置</button> |
||||
|
</div> |
||||
|
</el-tag> |
||||
|
<!-- 设定核算单位 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-accont">设定核算单位天/日起止时间:</el-tag> |
||||
|
<el-time-picker |
||||
|
is-range |
||||
|
prefix-icon="el-icon-date" |
||||
|
arrow-control |
||||
|
v-model="value1" |
||||
|
range-separator="至" |
||||
|
start-placeholder="开始时间" |
||||
|
end-placeholder="结束时间" |
||||
|
placeholder="选择时间范围" > |
||||
|
</el-time-picker> |
||||
|
</div> |
||||
|
<!-- 设定滞留超期时间 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">设定滞留超期时间:</el-tag> |
||||
|
|
||||
|
<el-from-item class="el-from-item"> |
||||
|
|
||||
ffffffffff |
<button class="btn btn-delet" @click="staytime_subtract()">-</button> |
||||
|
</el-from-item> |
||||
|
<el-input class="overtime-input" v-model="overtime"></el-input> |
||||
|
<el-from-item class="el-from-item"> |
||||
|
<button class="btn btn-add" @click="staytime_add()">+</button> |
||||
|
</el-from-item> |
||||
|
<el-tag style="padding-left: 14px;padding-right: 14px;font-size: 15px;background-color: white;border: 0px;color: #000000;">/</el-tag> |
||||
|
<el-select v-model="value" placeholder="请选择"> |
||||
|
<el-option |
||||
|
v-for="item in options" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 设定即将超期时间提醒 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">设定即将超期时间提醒:</el-tag> |
||||
|
<el-from-item class="el-from-item"> |
||||
|
|
||||
|
<button class="btn btn-delet" @click="subtract_remind()">-</button> |
||||
|
</el-from-item> |
||||
|
<el-from-item> |
||||
|
<el-input class="overtime-input" v-model="timeremind"></el-input> |
||||
|
</el-from-item> |
||||
|
<el-from-item class="el-from-item"> |
||||
|
|
||||
|
<button class="btn btn-add" @click="add_remind()">+</button> |
||||
|
</el-from-item> |
||||
|
<el-tag style="font-size: 14px; background-color: white;border: white;color: black;">单位天</el-tag> |
||||
|
</div> |
||||
|
<!-- 统一定时消息推送时间 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">统一定时消息推送时间:</el-tag> |
||||
|
<el-time-picker |
||||
|
arrow-control |
||||
|
prefix-icon="el-icon-date" |
||||
|
v-model="value2" |
||||
|
:picker-options="{ |
||||
|
selectableRange: '18:30:00 - 20:30:00' |
||||
|
}" |
||||
|
placeholder="任意时间点"> |
||||
|
</el-time-picker> |
||||
</div> |
</div> |
||||
|
|
||||
|
<!-- 议题发布前经网络员审核--> |
||||
|
|
||||
|
<el-tag class="mh"> |
||||
|
<div class="h-left"> |
||||
|
议题发布前经网络员审核 |
||||
|
</div> |
||||
|
<div class="h-right"> |
||||
|
<button class="h-right-one">恢复默认</button> |
||||
|
<button class="h-right-two">保存设置</button> |
||||
|
</div> |
||||
|
</el-tag> |
||||
|
<!-- 议题发布前经网络员审核 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">议题发布前经网络员审核:</el-tag> |
||||
|
<el-switch |
||||
|
v-model="button1" |
||||
|
active-text="开启" |
||||
|
inactive-text="关闭" |
||||
|
element style="width: 200px;"> |
||||
|
</el-switch> |
||||
|
</div> |
||||
|
<!-- 待办事项短信通知 --> |
||||
|
<el-tag class="mh"> |
||||
|
<div class="h-left"> |
||||
|
待办事项短信通知 |
||||
|
</div> |
||||
|
<div class="h-right"> |
||||
|
<button class="h-right-one">恢复默认</button> |
||||
|
<button class="h-right-two">保存设置</button> |
||||
|
</div> |
||||
|
</el-tag> |
||||
|
<!-- 代办事项发送短信通知 --> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">待办事项发送短信通知:</el-tag> |
||||
|
<el-switch |
||||
|
v-model="button2" |
||||
|
active-text="开启" |
||||
|
inactive-text="关闭"> |
||||
|
</el-switch> |
||||
|
</div> |
||||
|
<!-- 剩余短信数量--> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">剩余短信数量:</el-tag> |
||||
|
<el-input |
||||
|
placeholder="请输入内容" |
||||
|
v-model="input" |
||||
|
clearable |
||||
|
class="set-overtime"> |
||||
|
</el-input> |
||||
|
<el-tag style="font-size: 14px; background-color: white;border: white;color: black;">单位条</el-tag> |
||||
|
</div> |
||||
|
<!-- 小组审核机制--> |
||||
|
<el-tag class="mh"> |
||||
|
<div class="h-left"> |
||||
|
小组审核机制 |
||||
|
</div> |
||||
|
<div class="h-right"> |
||||
|
<button class="h-right-one">恢复默认</button> |
||||
|
<button class="h-right-two">保存设置</button> |
||||
|
</div> |
||||
|
</el-tag> |
||||
|
<!-- 新建小组进组需小组审核--> |
||||
|
<div class="mh-child"> |
||||
|
<el-tag class="set-overtime">新建小组进组需小组审核:</el-tag> |
||||
|
<el-switch |
||||
|
v-model="button3" |
||||
|
active-text="开启" |
||||
|
inactive-text="关闭"> |
||||
|
</el-switch> |
||||
|
</div> |
||||
|
<!-- 其他设置--> |
||||
|
<el-tag class="mh"> |
||||
|
<div class="h-left"> |
||||
|
其他设置 |
||||
|
</div> |
||||
|
<div class="h-right"> |
||||
|
<button class="h-right-one">恢复默认</button> |
||||
|
<button class="h-right-two">保存设置</button> |
||||
|
</div> |
||||
|
</el-tag> |
||||
|
</div> |
||||
|
|
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
value1: [new Date(2021, 1, 6, 0, 0), new Date(2021, 1, 6, 23, 59,59)], |
||||
|
options:[{ |
||||
|
value: '选项1', |
||||
|
label: '工作日' |
||||
|
}, { |
||||
|
value: '选项2', |
||||
|
label: '休息日' |
||||
|
}], |
||||
|
value: '', |
||||
|
value2: new Date(2016, 9, 10, 18, 40), |
||||
|
button1: true, |
||||
|
button2: true, |
||||
|
button3: true, |
||||
|
input: 2, |
||||
|
overtime: 1, |
||||
|
timeremind: 3 |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
methods:{ |
||||
|
staytime_subtract:function(overtime){ |
||||
|
|
||||
|
if(this.overtime>=1){ |
||||
|
this.overtime-- |
||||
|
|
||||
|
} |
||||
|
else if(this.overtime==0){ |
||||
|
alert("已达最小值","注意","ss"); |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
staytime_add:function(overtime){ |
||||
|
this.overtime++; |
||||
|
}, |
||||
|
subtract_remind:function(timeremind){ |
||||
|
|
||||
|
if(this.timeremind>=1){ |
||||
|
this.timeremind--; |
||||
|
|
||||
|
} |
||||
|
else if(this.timeremind==0){ |
||||
|
alert("已达最小值","注意","ss"); |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
add_remind:function(timeremind){ |
||||
|
this.timeremind++; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
</script> |
</script> |
||||
|
|
||||
<style> |
<style> |
||||
|
.el-card__body{ |
||||
|
padding-top: 0px; |
||||
|
margin-left: ; |
||||
|
} |
||||
|
.m-body{ |
||||
|
height: 790px; |
||||
|
width: 100%; |
||||
|
padding-top: 0px; |
||||
|
} |
||||
|
.select-date{ |
||||
|
margin-left: 100px; |
||||
|
} |
||||
|
|
||||
|
.mh{ |
||||
|
width: 100%; |
||||
|
height: 50px; |
||||
|
display: flex; |
||||
|
background-color: white; |
||||
|
border-color: white; |
||||
|
color: black; |
||||
|
padding: 0px; |
||||
|
border-bottom: 2px solid #eeeeee; |
||||
|
|
||||
|
} |
||||
|
.mh-child{ |
||||
|
margin-top: 30px; |
||||
|
position: relative; |
||||
|
|
||||
|
} |
||||
|
/* div.el-switch.is-checked{ |
||||
|
|
||||
|
} */ |
||||
|
div.el-switch{ |
||||
|
margin-left: 60px; |
||||
|
|
||||
|
} |
||||
|
.el-switch__core{ |
||||
|
height: 25px; |
||||
|
width: 50px; |
||||
|
border-radius: 25px; |
||||
|
} |
||||
|
.el-switch__core:after{ |
||||
|
width: 20px; |
||||
|
height: 20px; |
||||
|
} |
||||
|
.el-switch.is-checked .el-switch__core::after{ |
||||
|
margin-left: -20px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.h-right{ |
||||
|
position: absolute; |
||||
|
margin-left: 1420px; |
||||
|
margin-top: 5px; |
||||
|
padding: 0px; |
||||
|
|
||||
|
border: 0px; |
||||
|
} |
||||
|
.h-right-two{ |
||||
|
background-color: #17b3a3; |
||||
|
color: white; |
||||
|
width:90px; |
||||
|
height: 30px; |
||||
|
border: 0px; |
||||
|
margin-left: 15px; |
||||
|
} |
||||
|
.h-right-one{ |
||||
|
background-color: #d4d2ce; |
||||
|
color: black; |
||||
|
border: 0px; |
||||
|
width:90px; |
||||
|
height: 30px; |
||||
|
} |
||||
|
.h-left{ |
||||
|
|
||||
|
padding: 9px; |
||||
|
margin: auto 0; |
||||
|
font-size: 15px; |
||||
|
position: absolute; |
||||
|
width: 120px; |
||||
|
padding-left: 0px; |
||||
|
padding-top: 18px; |
||||
|
padding-bottom: 2px; |
||||
|
border-bottom: 3px solid #17b3a3; |
||||
|
} |
||||
|
|
||||
|
.set-accont{ |
||||
|
width: 250px; |
||||
|
text-align: right; |
||||
|
font-size: 15px; |
||||
|
padding-right: 30px; |
||||
|
background-color: white; |
||||
|
color: black; |
||||
|
border-color: white; |
||||
|
} |
||||
|
.set-overtime{ |
||||
|
width: 250px; |
||||
|
text-align: right; |
||||
|
font-size: 16px; |
||||
|
padding-right: 30px; |
||||
|
background-color: white; |
||||
|
color: black; |
||||
|
border-color: white; |
||||
|
|
||||
|
} |
||||
|
.overtime-input{ |
||||
|
width: 300px; |
||||
|
|
||||
|
} |
||||
|
.el-input__inner{ |
||||
|
border-radius: 0px; |
||||
|
text-align: center; |
||||
|
padding-right: 5px; |
||||
|
} |
||||
|
.btn{ |
||||
|
background-color: #f1f1f1; |
||||
|
border: 1px solid #DCDFE6; |
||||
|
} |
||||
|
.el-from-item :hover { |
||||
|
background-color:#f7f7f7 !important; |
||||
|
border: 1px solid #DCDFE6; |
||||
|
} |
||||
|
.btn-add{ |
||||
|
font-size: 20px; |
||||
|
height: 36px; |
||||
|
padding-left: 8px; |
||||
|
padding-right: 22px; |
||||
|
padding-bottom: 6px; |
||||
|
border-radius: 0px; |
||||
|
border-bottom-right-radius: 5px; |
||||
|
border-top-right-radius: 5px; |
||||
|
width: 10px; |
||||
|
|
||||
|
} |
||||
|
.btn-delet{ |
||||
|
font-size: 20px; |
||||
|
height: 36px; |
||||
|
padding-left: 12px; |
||||
|
padding-right: 18px; |
||||
|
padding-bottom: 6px; |
||||
|
border-radius: 0px; |
||||
|
border-bottom-left-radius: 5px; |
||||
|
border-top-left-radius: 5px; |
||||
|
width: 10px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
div.set-overtime.el-input.el-input--medium.el-input--suffix{ |
||||
|
padding-right: 0px; |
||||
|
} |
||||
</style> |
</style> |
||||
|
|||||
Loading…
Reference in new issue