Commit 65bc0a53 authored by 李苏's avatar 李苏 💬

改easytextbox为普通textbox,适用vue

parent 7116e4d1
......@@ -28,13 +28,23 @@ function exitFullscreen() {
}
}
function dbenlarge(domid,isTrue) {
function dbenlarge(domid,isTrue,func) {
let is=isTrue
document.getElementById(domid).style.backgroundColor="#FFFFFF"
document.getElementById(domid).addEventListener('dblclick', function(e) {
fullScreen(document.getElementById(domid));
setTimeout(()=>{
if(func){
func()
}
},300)
}, false);
if(isTrue){
fullScreen(document.getElementById(domid));
setTimeout(()=>{
if(func){
func()
}
},300)
}
}
<script src="js/pdfshow.js" type="text/javascript" charset="utf-8"></script>
<script src="js/pdfshow.js" type="text/javascript" charset="utf-8"></script>
<script src="js/dbenlarge.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
*{
* {
margin: 0;
padding: 0;
}
#kwrkb01{
#kwrkb01 {
height: 100%;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items:stretch
align-items: stretch
}
#kwrkb01 div {
box-sizing:border-box;
box-sizing: border-box;
}
.toptitle{
.toptitle {
height: 50px;
width: 100%;
background-color: #00aaff;
color: #FFFFFF;text-align: center;line-height: 50px;
color: #FFFFFF;
text-align: center;
line-height: 50px;
}
.left{
.left {
height: calc(100% - 60px);
width: 40%;
}
.right{
.right {
height: calc(100% - 60px);
width: calc(60% - 10px);
border: #EEEEEE 1px solid;
}
.rightPdf{
.rightPdf {
height: 100%;
width: 100%;
}
.cbinfor{
.cbinfor {
width: 100%;
height: 40%;
}
.tab{
.tab {
width: 100%;
height: 60%;
padding-top: 10px;
}
.cpif{
.cpif {
width: 100%;
height: 50%;
border: 1px solid #EEEEEE;
}
.cprz{
.cprz {
width: 100%;
height: 50%;
border: 1px solid #EEEEEE;
}
.cpiftop{
.cpiftop {
width: 100%;
height: 40px;
border-bottom: 1px solid #EEEEEE;
......@@ -63,43 +76,57 @@
display: flex;
justify-content: center;
}
.cpifbot{
.cpifbot {
height: calc(100% - 40px);
}
.ery{
.ery {
width: 50%;
height: 50%;
display: flex;
align-items: center;
}
.ery span {
padding-left: 20px;
display: inline-block;
width: 70px;
}
.tipul>li{
.tipul>li {
width: 150px;
padding-left: 20px;
float: left;
line-height: 50px;
}
.tipuli2{
float: right!important;
.tipuli2 {
float: right !important;
}
.maintab{
.maintab {
height: 100%;
width: 100%;
overflow: auto;
border: 0.5px solid #EEEEEE;
}
.showtab{
.showtab {
height: 100%;
width: 100%;
}
.easyuitext{
height: 30px;
border: 0.5px solid #D3D3D3;
}
.wid70{
width: 70%;
}
</style>
<div id="kwrkb01">
<!-- 顶部信息条 -->
<div class="toptitle" >
<div class="toptitle">
<ul class="tipul" style="height: 100%;">
<li>ADMIN</li>
<li>系统管理员</li>
......@@ -116,34 +143,35 @@
<div class="cpif">
<!-- top -->
<div class="cpiftop" style="display: flex;align-items: center;">
<span>序列号</span><input name="xlh" />
<span>序列号</span><input style="width: 84%;" class="easyuitext" name="xlh" @keydown="scanxlh()" v-model="xlh" />
</div>
<!-- bot -->
<div class="cpifbot" style="display: flex;flex-wrap: wrap;">
<div class="ery">
<span>工序</span><input name="gx" />
<span>工序</span><input class="easyuitext wid70" v-model="gx" name="gx" />
</div>
<div class="ery">
<span>工单</span><input name="gd" />
<span>工单</span><input class="easyuitext wid70" v-model="gd" name="gd" />
</div>
<div class="ery">
<span>产品SN</span><input name="cpsn" />
<span>产品SN</span><input class="easyuitext wid70" v-model="cpsn" name="cpsn" />
</div>
<div class="ery">
<span>品号</span><input name="ph" />
<span>品号</span><input class="easyuitext wid70" v-model="ph" name="ph" />
</div>
</div>
</div>
<!-- 日志 -->
<div class="cprz" >
<div class="cprz">
<div style="height: 20px;line-height: 20px;background-color: grey;color: white;text-align: center;">
日志
</div>
<div style="height: calc(100% - 20px);display: flex;">
<div style="width: 80%;height: 100%;background-color: #393456;color: #FFFFFF;">
<div class="rz" style="width: 80%;height: 100%;background-color: #393456;color: #FFFFFF;overflow: auto;">
<span>>>Tips</span>
</div>
<div style="width: 20%;height: 100%;background-color: #1890FF;color: white;display: flex;align-items: center;justify-content: center;font-size: 30px;">
<div
style="width: 20%;height: 100%;background-color: #1890FF;color: white;display: flex;align-items: center;justify-content: center;font-size: 30px;">
<b>ok</b>
</div>
</div>
......@@ -164,15 +192,14 @@
</div>
</div>
<script type="text/javascript">
let Vkwrkb01= new Vue({
el:"#kwrkb01",
let Vkwrkb01 = new Vue({
el: "#kwrkb01",
mounted() {
dbenlarge('kwrkb01',1)
pdfshow("pdf/dcAcess.pdf","gphy",5000).then(e=>{
this.sivpdf=e
})
// this.sivpdf=
this.initpage()
dbenlarge('kwrkb01', 1, this.initpage)
pdfshow("pdf/dcAcess.pdf", "gphy", 5000).then(e => {
this.sivpdf = e
})
this.gettime()
this.appdestory()
},
......@@ -181,112 +208,133 @@
clearInterval(this.sivpdf)
clearInterval(this.sivtimer)
},
data:function(){
return{
systime:"",
tabdata:[
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
{ph:10,pm:"GT-RBZ6",ggxh:"RBG-AK",sl:13,zpsl:12},
data: function() {
return {
addtop:0,
xlh:"",
gx:"",
gd:"",
cpsn:"",
ph:"",
systime: "",
tabdata: [{
ph: 10,
pm: "GT-RBZ6",
ggxh: "RBG-AK",
sl: 13,
zpsl: 12
},
{
ph: 10,
pm: "GT-RBZ6",
ggxh: "RBG-AK",
sl: 13,
zpsl: 12
}
],
sivtimer:null,//时间计数器
sivpdf:null,
sivdestory:null
sivtimer: null, //时间计数器
sivpdf: null,
sivdestory: null
}
},
methods: {
// 扫码事件
scanxlh(e){
var evt = window.event || e;
if (evt.keyCode == 13) {
console.log(this.xlh)
$("#kwrkb01").find(".rz").append("<br>>" + "<span>" +"正在查询:"+this.xlh+"</sapn>")
this.addtop = this.addtop + 600
$("#kwrkb01").find(".rz").scrollTop(this.addtop)
this.xlh=""
}
},
methods:{
// 初始化页面
initpage(){
let $xlh=$("#kwrkb01").find('input[name="xlh"]')
let $gx=$("#kwrkb01").find('input[name="gx"]')
let $gd=$("#kwrkb01").find('input[name="gd"]')
let $cpsn=$("#kwrkb01").find('input[name="cpsn"]')
let $ph=$("#kwrkb01").find('input[name="ph"]')
let $tab=$("#kwrkb01").find('.showtab')
$xlh.textbox({
width:'84%'
})
$gx.textbox({
width:'200'
})
$gd.textbox({
width:'200'
})
$cpsn.textbox({
width:'200'
})
$ph.textbox({
width:'200'
})
$tab.datagrid({
height:'100%',
fitColumns:true,
columns:[[
{field:'ph',title:'品号',width:'21%',
styler: function(value,row,index){
if (index < 3){
initpage() {
let that=this
let $tab = $("#kwrkb01").find('.showtab')
this.$tab=$tab
this.taboptions = {
height: '100%',
fitColumns: true,
columns: [
[{
field: 'ph',
title: '品号',
width: '21%',
styler: function(value, row, index) {
if (index < 3) {
return 'background-color:mediumturquoise;color:#fff;';
}},
}
},
},
{field:'pm',title:'品名',width:'21%',
styler: function(value,row,index){
if (index < 3){
{
field: 'pm',
title: '品名',
width: '21%',
styler: function(value, row, index) {
if (index < 3) {
return 'background-color:mediumturquoise;color:#fff;';
}},
}
},
{field:'ggxh',title:'规格型号',width:'21.5%',
styler: function(value,row,index){
if (index < 3){
},
{
field: 'ggxh',
title: '规格型号',
width: '21.5%',
styler: function(value, row, index) {
if (index < 3) {
return 'background-color:mediumturquoise;color:#fff;';
}},
}
},
},
{field:'sl',title:'数量',width:'20%',
styler: function(value,row,index){
if (index < 3){
{
field: 'sl',
title: '数量',
width: '20%',
styler: function(value, row, index) {
if (index < 3) {
return 'background-color:mediumturquoise;color:#fff;';
}},
}
},
},
{field:'zpsl',title:'装配数量',width:'20%',
styler: function(value,row,index){
if (index < 3){
{
field: 'zpsl',
title: '装配数量',
width: '20%',
styler: function(value, row, index) {
if (index < 3) {
return 'background-color:mediumturquoise;color:#fff;';
}},
}
},
]],
data:this.tabdata
});
},
]
],
data: this.tabdata
}
$tab.datagrid(this.taboptions);
},
/* 展示时间 */
gettime(){
let that=this
gettime() {
let that = this
let nowtime
nowtime=new Date().getTime()
that.systime=new Date(nowtime).Format("yyyy-MM-dd hh:mm")
this.sivtimer=setInterval(function(){
nowtime=new Date().getTime()
that.systime=new Date(nowtime).Format("yyyy-MM-dd hh:mm")
},20000)
nowtime = new Date().getTime()
that.systime = new Date(nowtime).Format("yyyy-MM-dd hh:mm")
this.sivtimer = setInterval(function() {
nowtime = new Date().getTime()
that.systime = new Date(nowtime).Format("yyyy-MM-dd hh:mm")
}, 20000)
},
appdestory(){
let that=this
this.sivdestory=setInterval(function(){
if(!$("#kwrkb01").height()){
appdestory() {
let that = this
this.sivdestory = setInterval(function() {
if (!$("#kwrkb01").height()) {
Vkwrkb01.$destroy()
}
},3000)
}, 3000)
}
}
})
</script>
......@@ -96,6 +96,13 @@
height: 100%;
width: 100%;
}
.easyuitext{
height: 30px;
border: 0.5px solid #D3D3D3;
}
.wid70{
width: 70%;
}
</style>
<div id="gpjykb">
<!-- 顶部信息条 -->
......@@ -117,21 +124,21 @@
<div class="cpif">
<!-- top -->
<div class="cpiftop" style="display: flex;align-items: center;">
<span>序列号</span><input name="xlh" />
<span>序列号</span><input class="easyuitext " style="width: 84%;" v-model="xlh" @keydown="scanxlh()" name="xlh" />
</div>
<!-- bot -->
<div class="cpifbot" style="display: flex;flex-wrap: wrap;">
<div class="ery">
<span>工序</span><input name="gx" />
<span>工序</span><input class="easyuitext wid70" v-model="gx" name="gx" />
</div>
<div class="ery">
<span>工单</span><input name="gd" />
<span>工单</span><input class="easyuitext wid70" v-model="gd" name="gd" />
</div>
<div class="ery">
<span>产品SN</span><input name="cpsn" />
<span>产品SN</span><input class="easyuitext wid70" v-model="cpsn" name="cpsn" />
</div>
<div class="ery">
<span>品号</span><input name="ph" />
<span>品号</span><input class="easyuitext wid70" v-model="ph" name="ph" />
</div>
</div>
</div>
......@@ -159,7 +166,7 @@
日志
</div>
<div style="height: calc(100% - 20px);display: flex;">
<div style="width: 100%;height: 100%;background-color: #393456;color: #FFFFFF;">
<div class="rz" style="width: 100%;height: 100%;background-color: #393456;color: #FFFFFF;overflow: auto;">
<span>>>Tips</span>
</div>
</div>
......@@ -191,6 +198,11 @@
},
data:function(){
return{
xlh:"",
gx:"",
gd:"",
cpsn:"",
ph:"",
systime:"",
tabdata:[
......@@ -201,28 +213,20 @@
}
},
methods:{
// 扫码事件
scanxlh(e){
var evt = window.event || e;
if (evt.keyCode == 13) {
console.log(this.xlh)
$("#gpjykb").find(".rz").append("<br>>" + "<span>" +"正在查询:"+this.xlh+"</sapn>")
this.addtop = this.addtop + 600
$("#gpjykb").find(".rz").scrollTop(this.addtop)
this.xlh=""
}
},
// 初始化页面
initpage(){
let $xlh=$("#gpjykb").find('input[name="xlh"]')
let $gx=$("#gpjykb").find('input[name="gx"]')
let $gd=$("#gpjykb").find('input[name="gd"]')
let $cpsn=$("#gpjykb").find('input[name="cpsn"]')
let $ph=$("#gpjykb").find('input[name="ph"]')
$xlh.textbox({
width:'84%'
})
$gx.textbox({
width:'200'
})
$gd.textbox({
width:'200'
})
$cpsn.textbox({
width:'200'
})
$ph.textbox({
width:'200'
})
},
/* 展示时间 */
gettime(){
......
<script src="js/pdfshow.js" type="text/javascript" charset="utf-8"></script>
<script src="js/dbenlarge.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
#kwrkb04{
#gpwxkb{
height: 100%;
width: 100%;
display: flex;
......@@ -11,7 +13,7 @@
justify-content: space-between;
align-items:stretch
}
#kwrkb04 div {
#gpwxkb div {
box-sizing:border-box;
}
.toptitle{
......@@ -94,8 +96,15 @@
height: 100%;
width: 100%;
}
.easyuitext{
height: 30px;
border: 0.5px solid #D3D3D3;
}
.wid70{
width: 70%;
}
</style>
<div id="kwrkb04">
<div id="gpwxkb">
<!-- 顶部信息条 -->
<div class="toptitle" >
<ul class="tipul" style="height: 100%;">
......@@ -115,21 +124,21 @@
<div class="cpif">
<!-- top -->
<div class="cpiftop" style="display: flex;align-items: center;">
<span>序列号</span><input name="xlh" />
<span>序列号</span><input class="easyuitext " style="width: 84%;" v-model="xlh" @keydown="scanxlh()" name="xlh" />
</div>
<!-- bot -->
<div class="cpifbot" style="display: flex;flex-wrap: wrap;">
<div class="ery">
<span>工序</span><input name="gx" />
<span>工序</span><input class="easyuitext wid70" v-model="gx" name="gx" />
</div>
<div class="ery">
<span>工单</span><input name="gd" />
<span>工单</span><input class="easyuitext wid70" v-model="gd" name="gd" />
</div>
<div class="ery">
<span>产品SN</span><input name="cpsn" />
<span>产品SN</span><input class="easyuitext wid70" v-model="cpsn" name="cpsn" />
</div>
<div class="ery">
<span>品号</span><input name="ph" />
<span>品号</span><input class="easyuitext wid70" v-model="ph" name="ph" />
</div>
</div>
</div>
......@@ -157,7 +166,7 @@
日志
</div>
<div style="height: calc(100% - 20px);display: flex;">
<div style="width: 100%;height: 100%;background-color: #393456;color: #FFFFFF;">
<div class="rz" style="width: 100%;height: 100%;background-color: #393456;color: #FFFFFF;overflow: auto;">
<span>>>Tips</span>
</div>
</div>
......@@ -166,15 +175,15 @@
</div>
<!-- 右侧信息pdf -->
<div class="right">
<canvas id="pdf" class="rightPdf"></canvas>
<canvas id="gpwxpdf" class="rightPdf"></canvas>
</div>
</div>
<script type="text/javascript">
let Vkwrkb04= new Vue({
el:"#kwrkb04",
let Vgpwxkb= new Vue({
el:"#gpwxkb",
mounted() {
dbenlarge('kwrkb04',1)
pdfshow("pdf/dcAcess.pdf","pdf",5000).then(e=>{
dbenlarge('gpwxkb',1)
pdfshow("pdf/dcAcess.pdf","gpwxpdf",5000).then(e=>{
this.sivpdf=e
})
// this.sivpdf=
......@@ -189,6 +198,11 @@
},
data:function(){
return{
xlh:"",
gx:"",
gd:"",
cpsn:"",
ph:"",
systime:"",
tabdata:[
......@@ -199,28 +213,20 @@
}
},
methods:{
// 扫码事件
scanxlh(e){
var evt = window.event || e;
if (evt.keyCode == 13) {
console.log(this.xlh)
$("#gpwxkb").find(".rz").append("<br>>" + "<span>" +"正在查询:"+this.xlh+"</sapn>")
this.addtop = this.addtop + 600
$("#gpwxkb").find(".rz").scrollTop(this.addtop)
this.xlh=""
}
},
// 初始化页面
initpage(){
let $xlh=$("#kwrkb04").find('input[name="xlh"]')
let $gx=$("#kwrkb04").find('input[name="gx"]')
let $gd=$("#kwrkb04").find('input[name="gd"]')
let $cpsn=$("#kwrkb04").find('input[name="cpsn"]')
let $ph=$("#kwrkb04").find('input[name="ph"]')
$xlh.textbox({
width:'84%'
})
$gx.textbox({
width:'200'
})
$gd.textbox({
width:'200'
})
$cpsn.textbox({
width:'200'
})
$ph.textbox({
width:'200'
})
},
/* 展示时间 */
gettime(){
......@@ -236,8 +242,8 @@
appdestory(){
let that=this
this.sivdestory=setInterval(function(){
if(!$("#kwrkb04").height()){
Vkwrkb04.$destroy()
if(!$("#gpwxkb").height()){
Vgpwxkb.$destroy()
}
},3000)
}
......
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