projects/mesxc-dy #159

Merged
gtz217 merged 2 commits from projects/mesxc-dy into projects/mesxc-test 2023-12-28 09:04:53 +08:00
2 changed files with 57 additions and 7 deletions

View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2021-11-18 14:16:25 * @Date: 2021-11-18 14:16:25
* @LastEditors: DY * @LastEditors: DY
* @LastEditTime: 2023-12-22 16:02:25 * @LastEditTime: 2023-12-26 16:59:25
* @Description: * @Description:
--> -->
<template> <template>
@ -16,8 +16,17 @@
<!-- <small-title slot="title" :no-padding="true"> <!-- <small-title slot="title" :no-padding="true">
{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }} {{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }}
</small-title> --> </small-title> -->
<div v-show="workOrderButton.length"> <div v-show="workOrderButton.length" class="buttonDiv">
<el-button v-for="(work, index) in workOrderButton" :key="index" type="primary" @click="init(work.id, true)">{{ work.name }}</el-button> <div style="display: flex; width: 100%;">
<el-button v-show="showScroll" type="text" style="width: 30px; background: white; margin-right: 8px" @click="scrollLeft" icon="el-icon-caret-left"></el-button>
<div ref="content" class="scrollDiv">
<el-button style="border: none" v-for="(work, index) in workOrderButton" :key="index" @click="init(work.id, true)">{{ work.name }}</el-button>
</div>
<el-button v-show="showScroll" type="text" @click="scrolRight" style="width: 30px; background: white; margin-left: 8px" icon="el-icon-caret-right"></el-button>
<el-button style="float: right" type="primary" size="small" plain @click="goback()">
<svg-icon icon-class="return"/>返回
</el-button>
</div>
</div> </div>
<div class="content"> <div class="content">
<div class="card"> <div class="card">
@ -25,7 +34,7 @@
<span class="blueTitle"></span> <span class="blueTitle"></span>
<span>工单编码{{ dataForm.code }}</span> <span>工单编码{{ dataForm.code }}</span>
</div> </div>
<el-button style="float: right" type="primary" size="small" plain @click="goback()"> <el-button v-if="!workOrderButton.length" style="float: right" type="primary" size="small" plain @click="goback()">
<svg-icon icon-class="return"/>返回 <svg-icon icon-class="return"/>返回
</el-button> </el-button>
<div class="formContent"> <div class="formContent">
@ -293,8 +302,10 @@ export default {
// orderArray: [], // orderArray: [],
visible: false, visible: false,
isdetail: false, isdetail: false,
showScroll: false,
workOrderButton: [], workOrderButton: [],
processFlowList: [], processFlowList: [],
timer: null
// tableH: this.tableHeight(510) / 2 // tableH: this.tableHeight(510) / 2
}; };
}, },
@ -311,6 +322,13 @@ export default {
name: work.name name: work.name
} }
}) })
const contentRef = this.$refs.content
if (contentRef.scrollWidth > contentRef.clientWidth) {
this.showScroll = true
} else {
this.showScroll = false
}
console.log(contentRef.scrollWidth, contentRef.clientWidth)
this.init(this.workOrderButton[0].id, true) this.init(this.workOrderButton[0].id, true)
}) })
} else { } else {
@ -318,6 +336,24 @@ export default {
} }
}, },
methods: { methods: {
scrolRight() {
// let contentRef = this.$refs.content
// console.log('', contentRef.scrollWidth, contentRef.clientWidth)
this.stopScroll()
this.timer = setTimeout(() => {
this.$refs.content.scrollLeft += 50
}, 100)
// if (contentRef.scrollWidth > contentRef.clientWi)
},
scrollLeft() {
this.stopScroll()
this.timer = setTimeout(() => {
this.$refs.content.scrollLeft -= 50
}, 100)
},
stopScroll() {
clearTimeout(this.timer)
},
getDict() { getDict() {
// //
getProcessFlowList().then(res => { getProcessFlowList().then(res => {
@ -458,6 +494,20 @@ export default {
}; };
</script> </script>
<style scoped> <style scoped>
.scrollDiv {
width: 100%;
overflow-x: hidden;
/* height: 50px; */
display: flex;
/* padding-bottom: -10px; */
}
.scrollDiv::-webkit-scrollbar-track {
display: none;
}
.buttonDiv {
margin-bottom: 8px;
display: flex;
}
.formContent { .formContent {
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
@ -481,7 +531,7 @@ export default {
margin-bottom: 8px; margin-bottom: 8px;
} }
.lightTip { .lightTip {
height: 16px; /* height: 16px; */
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
color: rgba(102,102,102,0.75); color: rgba(102,102,102,0.75);

View File

@ -84,7 +84,7 @@ export default {
label: '时间', label: '时间',
dateType: 'monthrange', dateType: 'monthrange',
format: 'yyyy-MM', format: 'yyyy-MM',
valueFormat: 'yyyy-MM-ddTHH:mm:ss', valueFormat: 'timestamp',
rangeSeparator: '-', rangeSeparator: '-',
startPlaceholder: '开始时间', startPlaceholder: '开始时间',
endPlaceholder: '结束时间', endPlaceholder: '结束时间',