|
@@ -0,0 +1,216 @@
|
|
|
|
+<template>
|
|
|
|
+ <div>
|
|
|
|
+ <normalLayout>
|
|
|
|
+ <div slot="titleRight">
|
|
|
|
+ <reportSet class="inline-16" v-if="tool.checkAuth($route.name,'reportSet')"></reportSet>
|
|
|
|
+ <createReport class="inline-16" @onSuccess="onSuccess" v-if="tool.checkAuth($route.name,'createReport')"></createReport>
|
|
|
|
+ </div>
|
|
|
|
+ <div slot="content">
|
|
|
|
+ <div class="handle-header">
|
|
|
|
+ <div class="select-btn">
|
|
|
|
+ <div @click="selectFun('我收到的')"
|
|
|
|
+ :style="currentItem==1 ? 'background:#3874F6;color:#ffffff' : 'border:1px solid #cccccc'">我收到的</div>
|
|
|
|
+ <div @click="selectFun('我发出的')"
|
|
|
|
+ :style="currentItem==0 ? 'background:#3874F6;color:#ffffff' : 'border:1px solid #cccccc'">我发出的</div>
|
|
|
|
+ </div>
|
|
|
|
+ <el-input
|
|
|
|
+ style="width:200px"
|
|
|
|
+ class="inline-24"
|
|
|
|
+ size="small"
|
|
|
|
+ suffix-icon="el-icon-search"
|
|
|
|
+ placeholder="搜索"
|
|
|
|
+ @input="valueChange"
|
|
|
|
+ v-model="condition"
|
|
|
|
+ @keyup.enter.native="$refs.aside.params.content.where.condition=condition;$refs.aside.params.content.pageNumber=1;$refs.aside.listData()"
|
|
|
|
+ @clear="$refs.aside.params.content.where.condition=condition;$refs.aside.params.content.pageNumber=1;$refs.aside.listData()" clearable></el-input>
|
|
|
|
+<!-- <el-button size="small" type="primary" @click="dateChange(1)">今天</el-button>
|
|
|
|
+ <el-button size="small" type="primary" @click="dateChange(2)">最近三天</el-button>
|
|
|
|
+ <el-button size="small" type="primary" class="inline-16" @click="dateChange(3)">最近一周</el-button>-->
|
|
|
|
+ <el-button-group class="inline-24">
|
|
|
|
+ <el-button size="small" :type="number === 1?'primary':''" @click="dateChange(1)">今天</el-button>
|
|
|
|
+ <el-button size="small" :type="number === 2?'primary':''" @click="dateChange(2)">最近三天</el-button>
|
|
|
|
+ <el-button size="small" :type="number === 3?'primary':''" @click="dateChange(3)">最近一周</el-button>
|
|
|
|
+ </el-button-group>
|
|
|
|
+ <span style="line-height: 30px;vertical-align: center" class="search__label" >时间筛选:</span>
|
|
|
|
+ <el-date-picker
|
|
|
|
+ style="margin-right: 24px"
|
|
|
|
+ v-model="date"
|
|
|
|
+ @change="dateChange"
|
|
|
|
+ type="daterange"
|
|
|
|
+ size="small"
|
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
|
+ range-separator="至"
|
|
|
|
+ start-placeholder="开始日期"
|
|
|
|
+ end-placeholder="结束日期">
|
|
|
|
+ </el-date-picker>
|
|
|
|
+ <el-button size="small" type="text" @click="onClear">清空</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="content">
|
|
|
|
+ <div class="content-left">
|
|
|
|
+ <Aside :statusParent="currentItem" ref="aside" @reportItem="reportItemClick"></Aside>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="content-right">
|
|
|
|
+ <reportContent ref="reportContent" :currentTab="currentItem" @deleteSuccess="deleteSuccess"></reportContent>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </normalLayout>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import reportSet from './modules/reportSet/index'
|
|
|
|
+import createReport from './modules/createReport/index'
|
|
|
|
+import Aside from './modules/aside/index'
|
|
|
|
+import reportContent from './modules/reportContent/index'
|
|
|
|
+export default {
|
|
|
|
+ name:'index',
|
|
|
|
+ components:{reportSet,Aside,reportContent,createReport},
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ currentItem:1,
|
|
|
|
+ condition:'',
|
|
|
|
+ date:'',
|
|
|
|
+ number:0
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ selectFun (data) {
|
|
|
|
+ if ((this.currentItem == 1 && data == '我收到的') || (this.currentItem == 0 && data == '我发出的')) return
|
|
|
|
+ this.$refs.aside.params.content.pageNumber = 1
|
|
|
|
+ this.currentItem = data == '我收到的' ? 1 : 0
|
|
|
|
+ if (this.currentItem) {
|
|
|
|
+ this.$refs.aside.params.id = 20230524103102
|
|
|
|
+ this.$refs.aside.listData((data) => {
|
|
|
|
+ this.$refs.reportContent.getDetail(data)
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ this.$refs.aside.params.id = 20230524102802
|
|
|
|
+ this.$refs.aside.listData((data) => {
|
|
|
|
+ this.$refs.reportContent.getDetail(data)
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ reportItemClick (id) {
|
|
|
|
+ this.$refs.reportContent.getDetail(id)
|
|
|
|
+ },
|
|
|
|
+ valueChange () {
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ onSuccess (data) {
|
|
|
|
+ this.$refs.aside.list.unshift(data)
|
|
|
|
+ this.$refs.aside.itemClick(data)
|
|
|
|
+ },
|
|
|
|
+ deleteSuccess (id) {
|
|
|
|
+ let index = this.$refs.aside.list.findIndex(item => item.sys_workreportid == id)
|
|
|
|
+ this.$refs.aside.list.splice(index,1)
|
|
|
|
+ this.$refs.aside.list[index] ? this.$refs.aside.itemClick(this.$refs.aside.list[index]) : ''
|
|
|
|
+ },
|
|
|
|
+ dateChange(val){
|
|
|
|
+ if (val === 1){
|
|
|
|
+ this.$refs.aside.params.content.where.today = 1
|
|
|
|
+ this.$refs.aside.params.content.where.lastthreedays = 0
|
|
|
|
+ this.$refs.aside.params.content.where.lastWeek = 0
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = ''
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = ''
|
|
|
|
+ this.date = ''
|
|
|
|
+ this.number = 1
|
|
|
|
+ }else if (val === 2){
|
|
|
|
+ this.$refs.aside.params.content.where.lastthreedays = 1
|
|
|
|
+ this.$refs.aside.params.content.where.lastWeek = 0
|
|
|
|
+ this.$refs.aside.params.content.where.today = 0
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = ''
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = ''
|
|
|
|
+ this.date = ''
|
|
|
|
+ this.number = 2
|
|
|
|
+ }else if (val === 3){
|
|
|
|
+ this.$refs.aside.params.content.where.lastWeek = 1
|
|
|
|
+ this.$refs.aside.params.content.where.lastthreedays = 0
|
|
|
|
+ this.$refs.aside.params.content.where.today = 0
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = ''
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = ''
|
|
|
|
+ this.date = ''
|
|
|
|
+ this.number = 3
|
|
|
|
+ }else {
|
|
|
|
+ this.$refs.aside.params.content.where.lastWeek = 0
|
|
|
|
+ this.$refs.aside.params.content.where.lastthreedays = 0
|
|
|
|
+ this.$refs.aside.params.content.where.today = 0
|
|
|
|
+ this.number = 0
|
|
|
|
+ if (this.date !== '' && this.date !== undefined && this.date!== null){
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = this.date[0]
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = this.date[1]
|
|
|
|
+ }else {
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = ''
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = ''
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ this.$refs.aside.params.content.pageNumber=1
|
|
|
|
+ this.$refs.aside.listData()
|
|
|
|
+ },
|
|
|
|
+ /*清空时间筛选*/
|
|
|
|
+ onClear(){
|
|
|
|
+ this.$refs.aside.params.content.where.lastWeek = 0
|
|
|
|
+ this.$refs.aside.params.content.where.lastthreedays = 0
|
|
|
|
+ this.$refs.aside.params.content.where.today = 0
|
|
|
|
+ this.number = 0
|
|
|
|
+ this.date = ''
|
|
|
|
+ this.$refs.aside.params.content.where.begindate = ''
|
|
|
|
+ this.$refs.aside.params.content.where.enddate = ''
|
|
|
|
+ this.$refs.aside.params.content.pageNumber=1
|
|
|
|
+ this.$refs.aside.listData()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ mounted () {
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ this.$refs.aside.params.id = 20230524103102
|
|
|
|
+ this.$refs.aside.listData((data) => {
|
|
|
|
+ this.$refs.reportContent.getDetail(data)
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped>
|
|
|
|
+*{
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+}
|
|
|
|
+.handle-header {
|
|
|
|
+ display: flex;
|
|
|
|
+ margin-top: 10px;
|
|
|
|
+ margin-bottom: 10px;
|
|
|
|
+}
|
|
|
|
+.select-btn {
|
|
|
|
+ display: flex;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ margin-left: 16px;
|
|
|
|
+ width: 210px;
|
|
|
|
+}
|
|
|
|
+.select-btn div {
|
|
|
|
+ text-align: center;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ padding: 4px 15px;
|
|
|
|
+ transition: background 0.2s ease-in-out;
|
|
|
|
+}
|
|
|
|
+.select-btn div:first-child {
|
|
|
|
+ border-top-left-radius: 4px;
|
|
|
|
+ border-bottom-left-radius: 4px;
|
|
|
|
+}
|
|
|
|
+.select-btn div:last-child {
|
|
|
|
+ border-top-right-radius: 4px;
|
|
|
|
+ border-bottom-right-radius: 4px;
|
|
|
|
+}
|
|
|
|
+.content {
|
|
|
|
+ display: flex;
|
|
|
|
+}
|
|
|
|
+.content .content-left {
|
|
|
|
+ width: 400px;
|
|
|
|
+}
|
|
|
|
+.content .content-right {
|
|
|
|
+ width: calc(100% - 400px);
|
|
|
|
+
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+</style>
|