zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:工单回退后编辑PC端

This commit is contained in:
shijing 2023-06-21 17:52:50 +08:00
parent 2e1411ce04
commit 268c512273
15 changed files with 305 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@ -7,9 +7,9 @@ VUE_APP_TITLE = '曲阳金隅安全智能管控平台'
# 接口地址
#VUE_APP_API_BASEURL = http://1.203.161.103:2800/api
#VUE_APP_WS_API = 'ws://localhost:8000'
VUE_APP_API_BASEURL = http://222.222.144.147:6013/api
# VUE_APP_API_BASEURL = http://222.222.144.147:6013/api
#VUE_APP_API_BASEURL = http://10.99.5.79:20309/api
# VUE_APP_API_BASEURL = http://49.232.14.174:2226/api
VUE_APP_API_BASEURL = http://49.232.14.174:2226/api
# VUE_APP_API_BASEURL = http://127.0.0.1:2226/api
#VUE_APP_BASEURL = http://127.0.0.1:8000

24
src/views/home/widgets/components/ticket.vue
View File

@ -93,9 +93,9 @@
</el-row>
<el-row :gutter="6">
<el-col :md="8" :sm="24">
<el-card shadow="hover" header="工单待办" style="">
<div class="card-body" v-if="dutyAgg.length>0" :style="{height:divHeight}">
<div v-for="item in dutyAgg" :key="item.workflow" style="margin-bottom: 10px;height: fit-content;">
<el-card shadow="hover" header="工单待办" >
<div class="card-body opl_card_body" v-if="dutyAgg.length>0" :style="{height:divHeight,}">
<div v-for="item in dutyAgg" :key="item.workflow" class="oplItem">
<el-badge :value="item.count" class="item workItemImg">
<el-button icon="el-icon-promotion" type="primary" size="small" @click="toDutyTicket"></el-button>
</el-badge>
@ -103,7 +103,7 @@
</div>
</div>
<div class="card-body" v-else :style="{height:divHeight}">
<div style="width:100%;line-height: 200px;color: #606266;text-align: center;">暂无待办工单</div>
<div class="noOpl">暂无待办工单</div>
</div>
</el-card>
</el-col>
@ -704,8 +704,24 @@ export default {
.card-body {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
justify-content: space-around;
align-items: center;
height: 80px;
}
.card-body.opl_card_body{
justify-content:flex-start
}
.oplItem{
height:66px;
width: 70px;
margin-bottom: 10px;
}
.noOpl{
width:100%;
line-height: 200px;
color: #606266;
text-align: center;
}
</style>

15
src/views/opm/clear.vue
View File

@ -898,10 +898,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/cooler.vue
View File

@ -891,10 +891,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/fire.vue
View File

@ -903,10 +903,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/high.vue
View File

@ -725,10 +725,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/hoisting.vue
View File

@ -727,10 +727,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/normal.vue
View File

@ -710,10 +710,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

3
src/views/opm/opl.vue
View File

@ -77,7 +77,7 @@
<el-table-column label="操作" fixed="right" width="100">
<template #default="scope">
<el-button v-if="scope.row.ticket == null" link type="warning" size="small" v-auth="'opl.update'"
<el-button v-if="(scope.row.ticket==null&&scope.row.create_by==userId)||(scope.row.ticket!==null&&scope.row.create_by==userId&&scope.row.ticket_.state_.type==1)" link type="warning" size="small" v-auth="'opl.update'"
@click="table_edit(scope.row, scope.$index)">编辑
</el-button>
<el-button link type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看
@ -131,6 +131,7 @@ export default {
4: "已完成",
5: "已关闭",
},
userId:this.$TOOL.data.get("USER_INFO").id
};
},

16
src/views/opm/soil.vue
View File

@ -734,10 +734,18 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.oplId!= ""){
this.$API.wf.ticket.update.req(this.oplId,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/space.vue
View File

@ -915,10 +915,17 @@
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.tLoading = true;
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.oplId!= ""){
this.$API.wf.ticket.update.req(this.oplId,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面

15
src/views/opm/usecl.vue
View File

@ -710,10 +710,17 @@ export default {
ticket.ticket_data = {opl: this.oplId};
ticket.transition = id;
ticket.title = this.form.name + '-申请';
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
if(this.form.ticket!= null&&this.form.ticket!= undefined){
this.$API.wf.ticket.ticketHandle.req(this.form.ticket,ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}else{
this.$API.wf.ticket.create.req(ticket).then((res) => {
this.$message.success("提交成功");
this.submitOut()
}).catch(e=>{this.tLoading=false});
}
},
//退出界面
submitOut(){

9
src/views/wf/details.vue
View File

@ -6,16 +6,9 @@
fit
stripe
style="width: 100%"
height="400"
max-height="300"
highlight-current-row
>
<!-- <el-table-column label="工单标题" min-width="100">
<template #default="scope">
<span v-if="scope.row.ticket_data.title">{{
scope.row.ticket_data.title
}}</span>
</template>
</el-table-column> -->
<el-table-column label="进行状态">
<template #default="scope">
<span>{{ scope.row.state_.name }}</span>

10
src/views/wf/ownerwork.vue
View File

@ -75,7 +75,7 @@
>查看</el-button
>
<!--创建人在初始状态-->
<el-button
<!-- <el-button
v-if="
scope.row.state_.type === 1 && userId === scope.row.create_by
"
@ -85,9 +85,9 @@
@click="handleClose(scope, '2')"
>
关闭
</el-button>
</el-button> -->
<!--如果state_.retreat/state_.type==1处于草稿状态 -->
<el-button
<!-- <el-button
v-if="
scope.row.state_.enable_retreat &&
userId === scope.row.create_by &&
@ -99,7 +99,7 @@
link
>
撤回
</el-button>
</el-button> -->
</template>
</el-table-column>
</scTable>
@ -179,7 +179,7 @@ export default {
path: "ticketdetail",
query: {
id: row.id,
type: "show",
type: "showMy",
projectId: projectId,
catetype: cateType,
},

218
src/views/wf/ticketdetail.vue
View File

@ -12,7 +12,7 @@
重新执行
</el-button>
</el-card>
<el-card style="margin-top: 4px">
<el-card style="margin-top: 4px;position:relative">
<el-descriptions title="工单信息" :column="3">
<el-descriptions-item label="工单流水号:">
{{ticketDetail.sn }}
@ -28,36 +28,36 @@
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card style="margin-top: 4px" v-if="cateType==='visit'">
<el-card style="margin-top: 4px;position:relative" v-if="cateType==='visit'">
<el-descriptions title="来访信息" :column="3">
<el-descriptions-item label="来访概述:">
{{visitDetail.name }}
{{itemDetail.name }}
</el-descriptions-item>
<el-descriptions-item label="来访级别:">
{{levelOptions[visitDetail.level] }}
{{levelOptions[itemDetail.level] }}
</el-descriptions-item>
<el-descriptions-item label="来访事由:">
{{purpose_[visitDetail.purpose] }}
{{purpose_[itemDetail.purpose] }}
</el-descriptions-item>
<el-descriptions-item label="来访人数:">
<el-tag size="small">{{ visitDetail.count_people }}人</el-tag>
<el-tag size="small">{{ itemDetail.count_people }}人</el-tag>
</el-descriptions-item>
<el-descriptions-item label="来访人员:">
<el-tag v-for="item in visitDetail.visitors_" :key='item.id' size="small">
<el-tag v-for="item in itemDetail.visitors_" :key='item.id' size="small">
{{ item.visitor_.name }}
</el-tag>
</el-descriptions-item>
<el-descriptions-item label="状态:">
{{state_[visitDetail.state] }}
{{state_[itemDetail.state] }}
</el-descriptions-item>
<el-descriptions-item label="来访时间:">
{{visitDetail.visit_time }}
{{itemDetail.visit_time }}
</el-descriptions-item>
<el-descriptions-item label="离访时间:">
{{visitDetail.leave_time }}
{{itemDetail.leave_time }}
</el-descriptions-item>
<el-descriptions-item label="接待人:" v-if="visitDetail.receptionist_">
{{ visitDetail.receptionist_.name }}
<el-descriptions-item label="接待人:" v-if="itemDetail.receptionist_">
{{ itemDetail.receptionist_.name }}
</el-descriptions-item>
</el-descriptions>
<div style="text-align: center">
@ -65,31 +65,31 @@
</div>
<visit-dialog v-if="visitShow" ref="visitDialog"></visit-dialog>
</el-card>
<el-card style="margin-top: 4px" v-if="cateType==='rpj'">
<el-card style="margin-top: 4px;position:relative" v-if="cateType==='rpj'">
<el-descriptions title="入厂项目" :column="3">
<el-descriptions-item label="相关方:">
{{rpjDetail.rparty_name}}
{{itemDetail.rparty_name}}
</el-descriptions-item>
<el-descriptions-item label="入厂项目:">
{{rpjDetail.name }}
{{itemDetail.name }}
</el-descriptions-item>
<el-descriptions-item label="项目类型:">
<el-tag size="small">{{rpjType_[rpjDetail.type]}}</el-tag>
<el-tag size="small">{{rpjType_[itemDetail.type]}}</el-tag>
</el-descriptions-item>
<el-descriptions-item label="合同编号:">
{{rpjDetail.contract_number }}
{{itemDetail.contract_number }}
</el-descriptions-item>
<el-descriptions-item label="状态:">
{{state_[rpjDetail.state] }}
{{state_[itemDetail.state] }}
</el-descriptions-item>
<el-descriptions-item label="进厂时间:">
{{rpjDetail.come_time }}
{{itemDetail.come_time }}
</el-descriptions-item>
<el-descriptions-item label="离厂时间:">
{{rpjDetail.leave_time }}
{{itemDetail.leave_time }}
</el-descriptions-item>
<el-descriptions-item label="所属部门:">
{{rpjDetail.belong_dept_name }}
{{itemDetail.belong_dept_name }}
</el-descriptions-item>
</el-descriptions>
<div style="text-align: center">
@ -97,28 +97,28 @@
</div>
<show-dialog v-if="rpjShow" ref="showDialog"></show-dialog>
</el-card>
<el-card style="margin-top: 4px" v-if="cateType==='opl'">
<el-card style="margin-top: 4px;position:relative" v-if="cateType==='opl'">
<el-descriptions title="作业许可证" :column="3">
<el-descriptions-item label="所属作业:">
<span v-if="oplDetail.operation">{{oplDetail.operation_.name }}</span>
<span v-if="itemDetail.operation">{{itemDetail.operation_.name }}</span>
</el-descriptions-item>
<el-descriptions-item label="许可证类型:">
{{oplDetail.cate_name }}
{{itemDetail.cate_name }}
</el-descriptions-item>
<el-descriptions-item label="作业区域:">
<span v-if="oplDetail.operation">{{oplDetail.operation_.area_.name}}</span>
<span v-if="itemDetail.operation">{{itemDetail.operation_.area_.name}}</span>
</el-descriptions-item>
<el-descriptions-item label="作业状态:">
<span v-if="oplDetail.operation">{{state2_[oplDetail.operation_.state]}}</span>
<span v-if="itemDetail.operation">{{state2_[itemDetail.operation_.state]}}</span>
</el-descriptions-item>
<el-descriptions-item label="生产状态:">
<span v-if="oplDetail.operation">{{oplDetail.operation_.state_work }}</span>
<span v-if="itemDetail.operation">{{itemDetail.operation_.state_work }}</span>
</el-descriptions-item>
<el-descriptions-item label="开始时间:">
{{oplDetail.start_time }}
{{itemDetail.start_time }}
</el-descriptions-item>
<el-descriptions-item label="结束时间:">
{{oplDetail.end_time }}
{{itemDetail.end_time }}
</el-descriptions-item>
</el-descriptions>
<div style="text-align: center">
@ -126,8 +126,10 @@
</div>
<show-dialog v-if="rpjShow" ref="showDialog"></show-dialog>
</el-card>
<el-card style="margin-top: 4px" v-if="type!=='show'">
<el-card style="margin-top: 4px;position:relative" header="处理日志">
<work-details ref="workDetails" :ticket="ticketId"></work-details>
</el-card>
<el-card class="handleWrap" v-if="type!=='show'&&type!=='showMy'">
<scTitle title="处理"></scTitle>
<el-form :model="form" ref="addForm" label-width="100px" label-position="left">
<el-form-item label="作业情况：" v-if="ticketDetail.state_&&ticketDetail.state_.key==='opl_close'">
@ -167,6 +169,12 @@
</el-button>
</div>
<div>
<el-button
v-if="(itemDetail.ticket_&&itemDetail.ticket_.act_state==2 && itemDetail.ticket_.state && itemDetail.ticket_.state_.type==1) || itemDetail.ticket_&&itemDetail.ticket_.act_state==0 || itemDetail.ticket_&&itemDetail.ticket_.act_state==3"
type="primary" plain
@click="itemDetailEdtil">编辑许可证
</el-button>
<el-button :loading="submitLoading" :disabled="submitLoading" v-for="item in operationBtn" :key="item.id" class="filter-item"
:type="item.attribute_type===2?'danger':'primary'" @click="operationSubmit(item.id)">
{{item.name}}
@ -174,8 +182,35 @@
</div>
</div>
</el-card>
<el-card style="margin-top: 4px" header="处理日志">
<work-details ref="workDetails" :ticket="ticketId"></work-details>
<el-card class="handleWrap" v-if="type!=='show'&&type=='showMy'">
<scTitle title="处理"></scTitle>
<div style="display: flex;justify-content: space-between;">
<div>
<el-button
v-if="itemDetail.ticket_&&itemDetail.ticket_.state_.type === 1 && userId === itemDetail.create_by"
type="danger"
size="small"
@click="handleClose('2')"
>关闭
</el-button>
<el-button
v-if="itemDetail.ticket_&&itemDetail.ticket_.state_.enable_retreat &&userId ===itemDetail.ticket_.create_by &&itemDetail.ticket_.state_.type !== 1"
type="danger"
@click="handleClose('1')"
size="small"
>
撤回
</el-button>
</div>
<div>
<el-button
v-if="(itemDetail.ticket_&&itemDetail.ticket_.act_state==2 && itemDetail.ticket_.state && itemDetail.ticket_.state_.type==1) || itemDetail.ticket_&&itemDetail.ticket_.act_state==0 || itemDetail.ticket_&&itemDetail.ticket_.act_state==3"
type="primary" plain
@click="itemDetailEdtil">编辑许可证
</el-button>
</div>
</div>
</el-card>
</el-main>
</el-container>
@ -213,8 +248,32 @@
<el-drawer :size="'50%'" v-model="showLimited" title="作业许可证详情" :close-on-click-modal="false">
<sc-fire :id="projectId"></sc-fire>
</el-drawer>
<el-dialog v-model="limitedRetreat" :title="handleTitle">
<el-form
ref="Form"
:model="handleForm"
label-width="100px"
label-position="right"
>
<el-form-item :label="handleLabel">
<el-input
type="textarea"
:rows="3"
v-model="handleForm.suggestion"
placeholder="原因"
/>
</el-form-item>
</el-form>
<div style="text-align: center">
<el-button class="filter-item" type="" @click="handleCancel"
>取消</el-button
>
<el-button class="filter-item" type="primary" @click="handleSubmit"
>确定</el-button
>
</div>
</el-dialog>
</template>
<script>
import workDetails from "./details.vue";
import workStep from "./steps.vue";
@ -231,14 +290,18 @@
name: "ticketdetail",
data() {
return {
handleForm: {
suggestion: "",
},
handleLabel: "撤回原因",
handleTitle: "撤回工单",
limitedRetreat: false,
ticketId: "",//工单id
projectId: "",//对应项目的id
mainLoading: false,
userName: "",
rpjDetail: {},
oplDetail: {},
itemDetail:{},
ticketDetail: {},
visitDetail: {},
employeeLists: [],
operationBtn: [],
form: {
@ -299,6 +362,7 @@
],
dosOption: [],
submitLoading: false,
userId: this.$TOOL.data.get("USER_INFO").id,
};
},
created() {
@ -308,7 +372,6 @@
this.cateType = this.$route.query.catetype;
},
mounted() {
debugger;
this.submitLoading = false;
if (this.cateType === 'visit') {
this.getVisit();
@ -321,6 +384,57 @@
this.getBtns();
},
methods: {
itemDetailEdtil(){
let itemDetail = this.itemDetail;
this.$router.push({
name: itemDetail.cate_code,
query: {oplId:itemDetail.id}
})
},
handleClose(index) {
if (index === "1") {
this.handleTitle = "撤回工单";
this.handleLabel = "撤回原因";
} else {
this.handleTitle = "关闭工单";
this.handleLabel = "关闭原因";
}
this.limitedRetreat = true;
this.ticketId = this.itemDetail.id;
},
handleCancel() {
this.limitedRetreat = false;
},
handleSubmit() {
let res = "";
let that = this;
that.$confirm("确认" + that.handleTitle + "吗?", "温馨提示", {
confirmButtonText: "确认",
cancelButtonText: "取消",
type: "warning",
})
.then(async () => {
if (that.handleTitle === "撤回工单") {
res = that.$API.wf.ticket.ticketRetreat.req(
that.ticketId,
that.handleForm
);
} else {
res = that.$API.wf.ticket.ticketClose.req(
that.ticketId,
that.handleForm
);
}
if (res.err_msg) {
} else {
that.limitedRetreat = false;
}
})
.catch((err) => {
console.error(err);
});
},
//关闭工作
getCloseDos() {
this.$API.system.dict.list
@ -348,7 +462,7 @@
getticketItem() {
this.mainLoading = true
this.$API.wf.ticket.ticketItem.req(this.ticketId).then((res) => {
this.mainLoading = false
this.mainLoading = false;
this.ticketDetail = res;
if(this.ticketDetail.state_.key == 'opl_close'){
// 如果是作业关闭,展示需要提交的表单
@ -366,22 +480,23 @@
//访客详情
getVisit() {
this.$API.vm.visit.read.req(this.projectId).then((res) => {
this.visitDetail = res;
this.itemDetail = res;
});
},
//入厂项目详情
getRpj() {
this.$API.rpm.rpj.item.req(this.projectId).then((res) => {
debugger;
this.rpjDetail = res;
// debugger;
this.itemDetail = res;
});
},
//许可证详情
getOpl() {
this.$API.opm.opl.read.req(this.projectId).then((res) => {
debugger;
this.oplDetail = res;
console.log(res)
this.itemDetail = res;
this.operationId = res.operation;
});
},
@ -465,9 +580,26 @@
</script>
<style scoped>
#adminui-main>.el-container{
position: relative !important;
}
.el-main{
padding-bottom: 200px;
}
.ticketRetry {
right: 20px;
top: 30px;
position: absolute;
}
.handleWrap{
position: absolute;
min-height: 100px;
padding: 10px;
width:100%;
margin: 0;
bottom: 0;
left: 0px;
right: 0px;
z-index: 10
}
</style>