Commit 0f19bfef authored by 康振飞's avatar 康振飞

工艺案例

parent dce3e1fd
<template> <template>
<div class=""> <div class="wu_bg">
<div class="star" v-if="!starmodal"> <div class="case_top">
<a class="start" @click="starFun" > <div class="sear_btn">
<Icon type="md-play" /> <Input search class="search_box mr10" enter-button placeholder="请输入文件名" />
工艺案例</a> <a @click="allChecked" ><Icon type="md-checkbox-outline" />全选</a>
<a @click="copyCard" ><Icon type="ios-browsers-outline" />复制</a>
<a @click="deliteCard" ><Icon type="ios-trash-outline" />删除</a>
<a @click="importCard" ><Icon type="ios-log-in" />导入</a>
<a @click="exportCard" ><Icon type="ios-log-out" />导出</a>
<a @click="addCard" ><Icon type="ios-add-circle-outline" />新建</a>
<span>{{cardlist.length}} 个案例;</span>
<span>已选择 {{checkCards}} 个案例</span>
</div> </div>
<div class="star flex fc-b" v-else-if="starmodal"> <a class="slip fr" @click="starFun" ><Icon type="md-swap" /></a>
<Button class="button" size='large' type="primary"><Icon type="ios-pause" /> 暂停</Button>
<Button class="button" size='large' type="primary"><Icon type="logo-angular" /> 交检</Button>
<Button class="button" size='large' type="primary"><Icon type="ios-checkmark-circle-outline" /> 完工</Button>
<Button class="button" size='large' type="primary"><Icon type="md-swap" /> 转序交接</Button>
</div> </div>
<div class="footer_box"> <div class="case_box">
<div class="ul_box fl"> <!-- <Row>
<Col span="6" v-for="i of 10" :key="i"> -->
<!-- <Card class="file_card" @click="checkCard">
<div class="file">
<Icon type="ios-paper" v-if="i%2==0"/>
<Icon type="ios-film" v-else/>
</div>
<div class="list">
<ul> <ul>
<li>名称:名称1</li> <li>工艺文档名称</li>
<li>图号:UIGT-763245</li> <li>张三</li>
<li>状态:未开工</li> <li>2020-02-12</li>
<li>订单编号:097543346</li>
<li>订单属性1:</li>
<li>订单属性2:</li>
<li>订单属性3:</li>
<li>计划数量:10</li>
<li>节点日期:2020-02-25</li>
</ul> </ul>
</div> </div>
<div class="ul_box fl"> </Card> -->
<!-- </Col>
</Row> -->
<CheckboxGroup v-model="caseLise" @on-change="changeCards">
<Checkbox class="file_card" border @on-change="changeCard"
v-for="(item,index) in cardlist" :label="item.id" :key="index">
<div class="file">
<Icon type="ios-paper" v-if="item.id%3==0"/>
<Icon type="ios-film" v-else/>
</div>
<div class="list">
<ul> <ul>
<li>工序名称:名称1</li> <li>{{item.name}}</li>
<li>工序序号:UIGT-763245</li> <li>{{item.userName}}</li>
<li>派工数量:66</li> <li>{{item.time}}</li>
<li>资源名称:23366</li>
<li>资源编号:986732038</li>
<li>人员信息:</li>
<li>开始时间:</li>
<li>结束时间:</li>
<li>单件工时:10</li>
<li>准备工时:2020-02-25</li>
</ul> </ul>
</div> </div>
<div class="img_box fl"> </Checkbox>
图片区 </CheckboxGroup>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -51,26 +58,205 @@ export default { ...@@ -51,26 +58,205 @@ export default {
name:'starOrder', name:'starOrder',
data(){ data(){
return{ return{
starmodal: false, caseLise:[],
checkCards:0,
cardlist:[
{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:1,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:2,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:3,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:4,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:5,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:6,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:7,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:8,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:9,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:10,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:11,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:12,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:13,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:14,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:15,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:16,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:17,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:18,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:19,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:20,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:21,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:22,
checked:false
},{
name:'工艺文档名称',
userName:'张三',
time:'2020-02-06',
id:23,
checked:false
},
],
} }
}, },
created() { created() {
// this.treeHeight = window.innerHeight - 120; //
}, },
async fetch({ store, params }) { async fetch({ store, params }) {
await store.dispatch("loadDictionary"); // 加载数据字典 await store.dispatch("loadDictionary"); // 加载数据字典
}, },
mounted() { mounted() { },
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
this.treeHeight = window.innerHeight - 120;
})();
};
},
methods: { methods: {
starFun(){ starFun(){
this.$Message.success("开工...") this.$Message.success("排序...")
},
allChecked(){
let items = this.cardlist;
let item = [];
items.map(u=>{ item.push(u.id) } )
if(this.caseLise.length==0){
this.caseLise = item
this.checkCards = item.length
}else{
this.caseLise = []
this.checkCards = 0
}
},
copyCard(){
this.$Message.success("复制工艺案例")
},
deliteCard(){
if(this.checkCards==0){
this.$Message.warning("请选择工艺案例 !")
return
}else{
this.$Modal.confirm({
title: "删除确认",
content: "<p>确认要删除这 " + this.checkCards +" 个工艺案例吗?</p>",
onOk: () => {
this.$Message.success("删除工艺案例...")
}
});
}
},
importCard(){
this.$Message.success("导入工艺案例")
},
exportCard(){
this.$Message.success("导出工艺案例")
},
addCard(){
this.$Message.success("新建工艺案例")
},
changeCards(list){
this.checkCards = list.length
},
changeCard(value){
console.log(111)
}, },
}, },
} }
......
...@@ -333,3 +333,60 @@ ...@@ -333,3 +333,60 @@
.wu_bg{ .wu_bg{
height: calc(100vh - 165px); height: calc(100vh - 165px);
} }
.case_top{
padding: 15px 40px 10px;
.sear_btn{
width: calc(100% - 50px);
display: inline-block;
.search_box{
width: 200px;
float: left;
}
a{
display: inline-block;
width: 65px;
height: 33px;
line-height: 40px;
text-align: center;
i{
font-size: 24px;
}
}
}
.slip{
i.ivu-icon{
font-size: 32px;
transform:rotate(90deg);
-ms-transform:rotate(90deg); /* Internet Explorer */
-moz-transform:rotate(90deg); /* Firefox */
-webkit-transform:rotate(90deg); /* Safari 和 Chrome */
-o-transform:rotate(90deg); /* Opera */
}
}
}
.case_box{
padding: 10px 20px;
height: calc(100vh - 210px);
overflow-y: auto;
.file_card{
background: #F5F6FA;
margin: 20px 20px;
width: calc(25% - 40px);//
padding: 18px;//
height: auto;
line-height: 20px;
.ivu-checkbox {
display: none;
}
.file {
display: block;
width: 60px;
height: 64px;
float: left;
margin: 0 8px 0 0;
i{
font-size: 58px;
}
}
}
}
\ No newline at end of file
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