From 6613785ce4eb0823cd5442ed0bb0987b0eae2069 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期六, 11 五月 2024 13:08:28 +0800
Subject: [PATCH] 1.时间组件DateType封装完成
---
src/views/workOrder/produceOrderList.vue | 286 ++++-----------------------------------------------------
1 files changed, 20 insertions(+), 266 deletions(-)
diff --git a/src/views/workOrder/produceOrderList.vue b/src/views/workOrder/produceOrderList.vue
index f6009d5..e8e656e 100644
--- a/src/views/workOrder/produceOrderList.vue
+++ b/src/views/workOrder/produceOrderList.vue
@@ -81,148 +81,13 @@
<el-input v-model="form.partspec" style="width: 200px" placeholder="璇疯緭鍏�" />
</el-form-item>
- <div v-show="isExpandForm" style="display:flex;justify-content: center;align-items: center;position: relative">
-
- <el-popover
- v-model="cycleTimePopoverIsShow"
- placement="bottom"
- width="500"
- trigger="hover"
- @show="cycleTimePopoverIsShow=true"
- >
- <div class="popoverList">
- <div class="popoverListItem">
- <div style="width: 40px">鍛�</div>
- <el-button
- :class="cycleTime===1?'selectButton':''"
- @click="cycleTimeClick(1)"
- >鏈� 鍛�</el-button>
- <el-button
- :class="cycleTime===2?'selectButton':''"
- @click="cycleTimeClick(2)"
- >涓� 鍛�</el-button>
- </div>
- <div class="popoverListItem">
- <div style="width: 40px">鏈�</div>
- <el-button
- :class="cycleTime===3?'selectButton':''"
- @click="cycleTimeClick(3)"
- >鏈� 鏈�</el-button>
- <el-button
- :class="cycleTime===4?'selectButton':''"
- @click="cycleTimeClick(4)"
- >涓� 鏈�</el-button>
- </div>
- <div class="popoverListItem">
- <div style="width: 40px">瀛�</div>
- <el-button
- :class="cycleTime===5?'selectButton':''"
- @click="cycleTimeClick(5)"
- >鏈� 瀛�</el-button>
- <el-button
- :class="cycleTime===6?'selectButton':''"
- @click="cycleTimeClick(6)"
- >涓� 瀛�</el-button>
- </div>
- <div class="popoverListItem">
- <div style="width: 40px">骞�</div>
- <el-button
- :class="cycleTime===7?'selectButton':''"
- @click="cycleTimeClick(7)"
- >鏈� 骞�</el-button>
- <el-button
- :class="cycleTime===8?'selectButton':''"
- @click="cycleTimeClick(8)"
- >涓� 骞�</el-button>
- </div>
- <div class="popoverListItem">
- <div style="width: 40px">鍏朵粬</div>
- <el-button
- :class="cycleTime===9?'selectButton':''"
- @click="cycleTimeClick(9)"
- >杩�3澶�</el-button>
- <el-button
- :class="cycleTime===10?'selectButton':''"
- @click="cycleTimeClick(10)"
- >杩�7澶�</el-button>
- <el-button
- :class="cycleTime===11?'selectButton':''"
- @click="cycleTimeClick(11)"
- >杩�14澶�</el-button>
- <el-button
- :class="cycleTime===12?'selectButton':''"
- @click="cycleTimeClick(12)"
- >浠� 澶�</el-button>
- <el-button
- :class="cycleTime===13?'selectButton':''"
- @click="cycleTimeClick(13)"
- >鏄� 澶�</el-button>
- </div>
-
- </div>
-
- <div
- slot="reference"
- style="width:15px;height:15px;background:transparent;
- cursor: pointer;position:absolute;z-index: 100;left: 110px;top:13px"
- />
-
- </el-popover>
-
- <el-popover
- placement="bottom"
- width="100"
- trigger="hover"
- :value="datatypePopoverIsShow"
- @show="datatypePopoverIsShow=true"
- >
- <div class="popoverList">
- <div class="popoverListItem2">
- <el-button
- :class="form.datatype==='PS'?'selectButton':''"
- @click="form.datatype='PS';datatypePopoverIsShow=false"
- >棰勮寮�宸ユ棩鏈�</el-button>
- </div>
- <div class="popoverListItem2">
- <el-button
- :class="form.datatype==='PE'?'selectButton':''"
- @click="form.datatype='PE';datatypePopoverIsShow=false"
- >棰勮瀹屽伐鏃ユ湡</el-button>
- </div>
- <div class="popoverListItem2">
- <el-button
- :class="form.datatype==='ED'?'selectButton':''"
- @click="form.datatype='ED';datatypePopoverIsShow=false"
- >棰勮浜や粯鏃ユ湡</el-button>
- </div>
- </div>
-
- <div
- slot="reference"
- style="color: #a7a7a7;
- font-weight: 600;
- font-family:'Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif';
- font-size:14px;width: 100px;text-align: center"
- > {{ form.datatype==='PS'? '棰勮寮�宸ユ棩鏈�':form.datatype==='PE'?'棰勮瀹屽伐鏃ユ湡':'棰勮浜や粯鏃ユ湡' }}
- </div>
-
- </el-popover>
-
- <el-date-picker
- v-model="form.timeValue"
- type="daterange"
- range-separator="~"
- class="timeMini"
- size="mini"
- style="width: 200px;display: flex;line-height: 34px;height: 34px;margin-right: 10px"
- :clearable="false"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- value-format="yyyy-MM-dd"
- @change="pickerChange"
- />
- <!-- :picker-options="pickerOptions"-->
- </div>
+ <DateType
+ ref="DateTypeRef"
+ :is-expand-form="isExpandForm"
+ style="display:flex;justify-content: center;align-items: center;position: relative"
+ @DateTypeChange="DateTypeChange"
+ @cycleTimeChange="cycleTimeChange"
+ />
<!-- <el-form-item-->
<!-- v-show="isExpandForm"-->
@@ -677,12 +542,13 @@
import { SeaveSearchErpOrder } from '@/api/ErpSyncMes'
import { PrentOrganizationNoCompany } from '@/api/GeneralBasicData'
import moment from 'moment'
+import DateType from '@/components/DateType'
const SER_HZ = /^[\u4e00-\u9fa5]+$/
export default {
name: 'SCDD',
components: {
- Pagination
+ Pagination, DateType
},
directives: { elDragDialog, waves },
data() {
@@ -699,7 +565,7 @@
}
return {
mouseHoverType: 'mouseout',
- isExpandForm: false,
+ isExpandForm: true,
mainHeight: 0,
tableHeight: 0,
form: {
@@ -724,9 +590,7 @@
page: 1, // 绗嚑椤�
rows: 20 // 姣忛〉澶氬皯鏉�
},
- datatypePopoverIsShow: false,
- cycleTime: null, // 鏃堕棿鍛ㄦ湡
- cycleTimePopoverIsShow: false,
+
erporderstusArr: [
{ code: 'NEW', name: '鏂拌鍗�' },
{ code: 'CREATING', name: '閮ㄥ垎涓嬭揪' },
@@ -849,102 +713,12 @@
},
methods: {
- cycleTimeClick(value) {
- this.cycleTimePopoverIsShow = false
-
- const date = new Date()
- const cWeek = moment(date).format('E')
- let newDate = []
- switch (value) {
- case 1:// 鏈懆
- newDate = [
- moment(date).subtract(Number(cWeek) - 1, 'days').format('YYYY-MM-DD'),
- moment(moment().week(moment().week()).endOf('week').valueOf()).format('YYYY-MM-DD')
- ]
- break
- case 2:// 涓婂懆
- newDate = [
- moment(moment().add(-13, 'days').startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().add(-6, 'days').startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 3:// 鏈湀
- newDate = [
- moment(moment().month(moment().month()).startOf('month').valueOf()).format('YYYY-MM-DD'),
- moment(moment().month(moment().month()).endOf('month').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 4:// 涓婃湀
- newDate = [
- moment(moment().month(moment().month() - 1).startOf('month').valueOf()).format('YYYY-MM-DD'),
- moment(moment().month(moment().month()).startOf('month').valueOf()).add(-1, 'days').format('YYYY-MM-DD')
- ]
- break
-
- case 5:// 鏈搴�
- newDate = [
- moment(moment().quarter(moment().quarter()).startOf('quarter').valueOf()).format('YYYY-MM-DD'),
- moment(moment().quarter(moment().quarter()).endOf('quarter').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 6:// 涓婂搴�
- newDate = [
- moment(moment().quarter(moment().quarter() - 1).startOf('quarter').valueOf()).format('YYYY-MM-DD'),
- moment(moment().quarter(moment().quarter() - 1).endOf('quarter').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 7:// 鏈勾
- newDate = [
- moment(moment().year(moment().year()).startOf('year').valueOf()).format('YYYY-MM-DD'),
- moment(moment().year(moment().year()).endOf('year').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 8:// 鍘诲勾
- newDate = [
- moment(moment().year(moment().year() - 1).startOf('year').valueOf()).format('YYYY-MM-DD'),
- moment(moment().year(moment().year() - 1).endOf('year').valueOf()).format('YYYY-MM-DD')
- ]
- break
-
- case 9:// 杩�3澶�
- newDate = [
- moment(moment().add(-2, 'days').startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
- case 10:// 杩�7澶�
- newDate = [
- moment(moment().add(-6, 'days').startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
- case 11:// 杩�14澶�
- newDate = [
- moment(moment().add(-13, 'days').startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
- case 12:// 浠婂ぉ
- newDate = [
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
- case 13:// 鏄ㄥぉ
- newDate = [
- moment(moment().add(-1, 'days').startOf('day').valueOf()).format('YYYY-MM-DD'),
- moment(moment().startOf('day').valueOf()).format('YYYY-MM-DD')
- ]
- break
- }
-
- this.form.timeValue = newDate
- this.cycleTime = value
+ DateTypeChange(value) {
+ console.log('asd', value)
+ this.form.datatype = value
+ },
+ cycleTimeChange(val) {
+ this.form.timeValue = val
},
pickerChange(value) {
@@ -1059,6 +833,9 @@
this.form.timeValue = []
this.cycleTime = null
+
+ this.$refs.DateTypeRef.clearValue()
+
this.getErpOrderSearch()
},
// 鍗曢�夋閫変腑鑾峰彇褰撳墠琛屼俊鎭�
@@ -1303,29 +1080,6 @@
<!--鍏叡椤甸潰鏍峰紡-->
<style lang="scss" scoped>
$main_color: #42b983;
-
-.popoverList {
- display: flex;
- flex-direction: column;
-}
-
-.popoverListItem {
- height: 50px;
- display: flex;
- align-items: center;
- justify-content: flex-start;
-}
-
-.popoverListItem2 {
- height: 40px;
- display: flex;
- align-items: center;
- justify-content: flex-start;
-}
-
-.selectButton {
- color: #42B983;
-}
::v-deep .el-range__icon {
line-height: 28px !important;
--
Gitblit v1.9.3