Commit e8b6bf31 authored by 康振飞's avatar 康振飞

工时分配css样式+页面

parent a6f9a5ea
...@@ -172,7 +172,7 @@ ...@@ -172,7 +172,7 @@
} }
} }
.gs_set{ .gs_set{
height: 100vh; height: calc(100vh - 165px);
.gs_top{ .gs_top{
margin: 15px auto; margin: 15px auto;
width: 1000px; width: 1000px;
...@@ -180,24 +180,27 @@ ...@@ -180,24 +180,27 @@
background: #2680EB; background: #2680EB;
color: #fff; color: #fff;
border-radius:4px; border-radius:4px;
padding: 20px 0 0;
.line_slit{ .line_slit{
height: 5em; height: 5em;
float: left; float: left;
margin: 5px 0 0;
} }
.gs_top_box{ .gs_top_box{
float: left; float: left;
width: 46%; width: calc(50% - 1px);
text-align: center; text-align: center;
line-height: 140px;
i{ i{
font-size: 71px; font-size: 71px;
} }
.gs_bo01{ .gs_bo01{
display: inline-block; display: inline-block;
height: 62px;
text-align: left;
padding: 0 0 0 10px;
} }
span{ span{
display: inline-block; display: block;
} }
.shi{ .shi{
...@@ -207,4 +210,65 @@ ...@@ -207,4 +210,65 @@
} }
} }
} }
.gs_card_box{
padding: 15px 50px;
.gs_card{
float: left;
margin: 20px 72px;
width: 300px;
height: 240px;
.ivu-card-head{
background: #d3e6fb;
border-radius: 4px 4px 0px 0px;
border-bottom: 1px dashed #2680EB;
.gs_title{
color: #2680EB;
}
}
.gs_p{
height: 32px;
line-height: 32px;
}
.gs_time{
text-align: center;
color: #2680EB;
.b_size{
font-size: 32px;
}
}
.gs_footer{
background: #d3e6fb;
margin: 0 -16px;
height: 59px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-top: 1px solid #2680eb;
a{
display: inline-block;
height: 59px;
line-height: 60px;
text-align: center;
width: calc(50% - 2px);
}
.gs_del{
background: #2680EB;
color: #fff;
border-bottom-right-radius: 4px;
}
}
}
.gs_card:hover {
border-color: #2680EB;
}
.gs_add{
border: 1px dashed #2680EB;
color: #2680EB;
text-align: center;
line-height: 275px;
border-radius: 4px;
i{
font-size: 80px;
}
}
}
} }
\ No newline at end of file
<template>
<div>
<Form ref="form" :model="entity" :rules="rules" :label-width="100">
<Row>
<Col span="12">
<FormItem label="所属车间">
<Input v-model="entity.projectNo" disabled></Input>
</FormItem>
</Col>
<Col span="12">
<FormItem label="所属班组">
<Input v-model="entity.productName" disabled></Input>
</FormItem>
</Col>
<Col span="12">
<FormItem label="数字">
<InputNumber v-model="entity.outSideTime" style="width:150px;" :min="0"></InputNumber>
</FormItem>
</Col>
</Row>
</Form>
<Row>
<Col span="24" style="text-align:right;height:60px;line-height:60px">
<Button @click="handleClose" class="mr20">取消</Button>
<Button type="primary" @click="handleSubmit">确定</Button>
</Col>
</Row>
</div>
</template>
<script>
export default {
data(){
return{
admor:1,
entity: {
},
rules: {
outSideTime: [
{ required: true, message: "必填", type: "number", trigger: "change" }
]
}
}
},
methods: {
handleSubmit(){
this.$emit("on-ok", this.entity);
},
handleClose(){
this.$emit("on-close");
},
},
}
</script>
\ No newline at end of file
...@@ -3,7 +3,8 @@ ...@@ -3,7 +3,8 @@
<div class="gs_set"> <div class="gs_set">
<div class="gs_top"> <div class="gs_top">
<div class="gs_top_box total_time"> <div class="gs_top_box total_time">
<Icon type="md-pie" /> <!-- <Icon type="md-pie" /> -->
<Icon type="ios-time" />
<div class="gs_bo01"> <div class="gs_bo01">
<span class="shi">总工时</span> <span class="shi">总工时</span>
<span class="number">250</span> <span class="number">250</span>
...@@ -18,15 +19,49 @@ ...@@ -18,15 +19,49 @@
</div> </div>
</div> </div>
</div> </div>
<div class="gs_card_box"></div> <div class="gs_card_box">
<Card class="gs_card" v-for="i of 5" :key="i">
<p slot="title" class="gs_title">
张三
<span class="fr">02816335{{i}}</span>
</p>
<p class="gs_p">所属车间:车间A{{i}}</p>
<p class="gs_p">所属班组:班组B{{i}}</p>
<p class="gs_time">
<span class="b_size">100</span> 工时
</p>
<p class="gs_footer">
<a class="gs_edit" @click="editItem">
<Icon type="md-create" />
编辑</a>
<a class="gs_del" @click="delItem">
<Icon type="ios-trash-outline" />
删除</a>
</p>
</Card>
<a class="gs_card gs_add" @click="addItem">
<Icon type="ios-add" />
</a>
</div>
<!-- 新增弹框 -->
<Modal
v-model="addmodal" width='1100' :mask-closable="false"
title="添加人员" footer-hide >
<addview ref="addview" @on-close="cancel" @on-ok="addInfo"></addview>
</Modal>
</div> </div>
</template> </template>
<script> <script>
import addview from "./add";
export default { export default {
name:'starOrder', name:'starOrder',
components: {addview,},
data(){ data(){
return{ return{
starmodal: false, starmodal: false,
msg:'确认要删除吗?',
title:'删除确认',
addmodal: false,
} }
}, },
created() { created() {
...@@ -44,9 +79,27 @@ export default { ...@@ -44,9 +79,27 @@ export default {
}; };
}, },
methods: { methods: {
starFun(){ addItem(){
this.$Message.success("开工...") this.addmodal = true
},
editItem(){
this.$Message.success("编辑工时...")
}, },
delItem(){
this.$Modal.confirm({
title: this.title,
content: "<p>" + this.msg + "</p>",
onOk: () => {
this.$Message.success("删除工时...")
}
});
},
cancel(){
this.addmodal = false
},
addInfo(){
this.addmodal = false
}
}, },
} }
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment