From c141197a5687dda0256cb8939f73aada040c9ba9 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期三, 24 三月 2021 19:23:53 +0800 Subject: [PATCH] 育英项目以图搜图修改 --- src/pages/shuohuangMonitorAnalyze/components/taskManage.vue | 346 ++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 280 insertions(+), 66 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue b/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue index c519390..df42df8 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/taskManage.vue @@ -7,7 +7,7 @@ </div> <div class="body"> <div class="flex-box"> - <div> + <!-- <div> <el-date-picker v-model="videoSearchTime" type="datetimerange" @@ -18,57 +18,106 @@ end-placeholder="缁撴潫鏃ユ湡" align="right" ></el-date-picker> + </div> --> + <div> + <el-input + class="keyword-input" + v-model="keyword1" + placeholder="璇疯緭鍏ユ満杞﹀彿" + size="small" + style="margin: 0 10px;" + clearable="true" + ></el-input> </div> <div> <el-input class="keyword-input" - v-model="videoListSearchWord" - placeholder="璇疯緭鍏ユ満杞﹀彿锛屽涓敤','鍒嗛殧" - size="mini" + v-model="keyword2" + placeholder="璇疯緭鍏ヨ溅娆�" + size="small" style="margin: 0 10px;" + clearable="true" ></el-input> </div> - <div></div> + <div> + <el-input + class="keyword-input" + v-model="keyword3" + placeholder="璇疯緭鍏ュ徃鏈哄鍚�" + size="small" + style="margin: 0 10px;" + clearable="true" + ></el-input> + </div> <el-button type="primary" - @click="searchVideoList" - size="mini" + @click="renderVideoTable" + size="small" style="margin-right:10px;" >鎼滅储</el-button> - <el-checkbox v-model="isShowUndistributedOnly">浠呮樉绀烘湭鍒嗛厤</el-checkbox> + <!-- <el-checkbox v-model="isShowUndistributedOnly">浠呮樉绀烘湭鍒嗛厤</el-checkbox> --> + <el-checkbox v-model="notAssignedOnly">浠呮樉绀烘湭鍒嗛厤</el-checkbox> </div> <div class="video-list"> - <el-collapse v-model="actCollapseName"> - <el-collapse-item :name="trainNo.id" v-for="trainNo in trainNoList" :key="trainNo.id"> - <template slot="title"> - <div> - <el-checkbox v-model="trainNo.checked" style="padding-right:10px;"></el-checkbox> - <span>{{trainNo.no}}({{trainNo.videos.length}})</span> + <el-checkbox-group v-model="trainNochecked"> + <el-collapse v-model="actCollapseName"> + <el-collapse-item + :name="vkey" + v-for="(v,vkey,i) in videoPackageList" + :key="i" + > + <template slot="title"> + <div> + <el-checkbox + :label="i" + style="padding-right:10px;" + ></el-checkbox> + <span>{{vkey}}({{v.length}})</span> + </div> + </template> + <div class="video-detail" v-for="video in v" :key="video.ID"> + <i class="el-icon-film" style="margin-left: 20px;"></i> + <span style="padding-left: 10px;">{{video.VideoName}}</span> </div> - </template> - <div v-for="video in trainNo.videos" :key="video.id"> - <i class="el-icon-film" style="margin-left: 20px;"></i> - <span style="padding-left: 10px;">{{video.name}}</span> - </div> - </el-collapse-item> - </el-collapse> + </el-collapse-item> + </el-collapse> + </el-checkbox-group> + <!-- <el-pagination + @size-change="handleTrainNoSizeChange" + @current-change="handleTrainNoCurChange" + :current-page.sync="trainNoCurPage" + :page-size="trainNoPageSize" + :page-sizes="trainNoPageSizes" + layout="total,sizes, prev, pager, next" + :total="trainNoTotal" + ></el-pagination> --> </div> </div> </div> <div class="top-right partment"> <div class="header"> + <el-checkbox v-model="isAllCheck" :indeterminate="isIndeterminate" @change="handleCheckAllChange"></el-checkbox> <div class="title">浜哄憳鍒楄〃</div> + <el-input size="small" @input="searchName" v-model="inputName" placeholder="璇疯緭鍏ュ唴瀹�" clearable="true"></el-input> </div> <div class="body"> - <div class="flex-box"> + <!-- <div class="flex-box"> <label>閮ㄩ棬:</label> <span class="checked-org" :class="{'null':!checkedOrg.id}">{{checkedOrg.label||'鍏ㄩ儴'}}</span> <el-button type="primary" size="mini" @click="selOrg">閫夋嫨閮ㄩ棬</el-button> - </div> + </div> --> <div class="person-list"> - <div class="person" v-for="person in personList" :key="person.id"> - <el-checkbox v-model="person.personChecked">{{person.name}}</el-checkbox> - </div> + <el-checkbox-group v-model="memberChecked" @change="handleCheckedCitiesChange"> + <div class="person" v-for="person in personList" :key="person.ID"> + <el-checkbox :label="person.ID">{{person.Name}}</el-checkbox> + </div> + </el-checkbox-group> + <el-button + v-show="memberChecked.length && trainNochecked.length" + type="primary" + @click="toAddAssignList" + size="small" + >鍔犲叆寰呭垎閰嶅垪琛�</el-button> </div> </div> </div> @@ -89,35 +138,52 @@ size="mini" style="margin-left: 10px;" > - <el-button slot="append" icon="el-icon-search" @click="searchTask"></el-button> + <el-button slot="append" icon="el-icon-search" @click="renderTaskTable"></el-button> </el-input> </div> </div> - <div class="body table-area"> + <div class="table-area"> <div class="actions"> - <el-button type="primary" size="small" @click="distributeTask">鍒嗛厤浠诲姟</el-button> + <el-button + type="primary" + size="small" + @click="distributeTask" + v-if="taskType==1&&taskVideoChecked.length" + >鍒嗛厤浠诲姟</el-button> </div> - <el-table class="thbg" :data="taskTableData" ref="elTable"> - <el-table-column type="expand"> - <template slot-scope="props"> - <div class="video-item" v-for="video in props.videos" :key="video.id">{{video.name}}</div> - </template> - </el-table-column> - <el-table-column prop="trainNo" label="鏈鸿溅鍙�"></el-table-column> + <el-table + class="thbg" + :data="taskTableData" + ref="elTable" + @selection-change="taskTableSelection" + v-loading + > + <el-table-column v-if="taskType==1" type="selection" width="55"></el-table-column> + <el-table-column prop="LocomotiveNumber" label="鏈鸿溅鍙�"></el-table-column> <el-table-column label="瑙嗛鏁伴噺"> <template slot-scope="scope"> - <div>{{scope.row.videos.length}}</div> + <div>{{scope.row.LKGList.length}}</div> </template> </el-table-column> - <el-table-column prop="person" label="鍒嗛厤浜�"></el-table-column> - <el-table-column prop="time" label="鍒嗛厤鏃堕棿"></el-table-column> - <el-table-column prop="handle" label="澶勭悊浜�"></el-table-column> + <el-table-column prop="DistributionUser" label="鍒嗛厤浜�"></el-table-column> + <el-table-column prop="DistributionDate" label="鍒嗛厤鏃堕棿"></el-table-column> + <el-table-column prop="HandlingUsers" label="澶勭悊浜�"></el-table-column> <el-table-column label="鎿嶄綔"> <template slot-scope="scope"> <div class="operation"> - <span @click="cancelDistribute(scope.row)">鍙栨秷鍒嗛厤/鎸囨淳</span> - <span @click="toggleCollapse(scope.row)">鏌ョ湅/闅愯棌杞︽</span> + <span @click="cancelDistribute(scope.row)" v-show="taskType==1">鍙栨秷鍒嗛厤</span> + <span @click="cancelDistribute(scope.row)" v-show="taskType==2">鍙栨秷鎸囨淳</span> + <!-- <span @click="toggleCollapse(scope.row)">鏌ョ湅/闅愯棌杞︽</span> --> </div> + </template> + </el-table-column> + <el-table-column type="expand"> + <template slot-scope="scope"> + <div + class="video-item" + v-for="video in scope.row.LKGList" + :key="video.ID" + >{{video.VideoName}}</div> </template> </el-table-column> </el-table> @@ -144,13 +210,14 @@ </template> <script> -import { getOrganizeTree } from '@/api/shuohuang'; +import { getOrganizeTree, getMemberByOrg, getVideoListBySearch, addToAssignList, getTaskList, distributeTask, cancelMission } from '@/api/shuohuang'; export default { data () { return { + isAllCheck:false, taskType: '1', keyWordOfTask: '', - videoSearchTime: [], + // videoSearchTime: [], pickerOptions: { shortcuts: [{ text: '浠婂ぉ', @@ -183,30 +250,139 @@ }] }, isShowUndistributedOnly: false, - trainNoList: [ - { no: 'SS4B115', id: 'SS4B115', videos: [{ id: 'SS4B115', name: 'SS4B115_06_B鑺備簩绔徃鏈哄_20201115_091500.mp4' }, { id: 'SS4B116', name: 'SS4B116_06_B鑺備簩绔徃鏈哄_20201115_091500.mp4' }] }, - { no: 'SS5B115', id: 'SS5B115', videos: [{ id: 'SS5B116', name: 'SS5B116_06_B鑺備簩绔徃鏈哄_20201115_091500.mp4' }] } - ], - videoListSearchWord: '', + videoPackageList: {}, + trainNochecked: [], + // trainNoCurPage: 1, + // trainNoPageSize: 8, + // trainNoPageSizes: [5, 8, 12], + trainNoTotal: 0, + keyword1: '', + keyword2: '', + keyword3: '', actCollapseName: '', checkedOrg: {}, orgTreeDialogVisible: false, organizeData: [], - - personList: [ - { name: '寮犱笁', id: 'zs' }, - { name: '鏉庢柉', id: 'ls' } - ], + personList: [], + memberChecked: [], taskTableData: [], + taskVideoChecked: [], + notAssignedOnly: false, + isIndeterminate:false, + inputName:"" } }, mounted () { this.getOrganizeTreeData(); + this.refreshAll(); + }, + watch: { + taskType (n, o) { + this.renderTaskTable(); + } }, methods: { - searchMemberByOrg(){ - debugger - + searchName(val){ + console.log(this.personList ,val); + if (val=="") { + this.searchMemberByOrg() + } + if (val.trim()=="") { + return + } + this.personList = this.personList.filter(item=>{ + return item.Name.indexOf(val)>-1 + }) + }, + handleCheckAllChange(val) { + let arr =[] + this.personList.forEach(item=>{ + arr.push(item.ID) + }) + this.memberChecked = val ? arr : []; + this.isIndeterminate = false; + }, + handleCheckedCitiesChange(value) { + let checkedCount = value.length; + this.isAllCheck = checkedCount === this.personList.length; + this.isIndeterminate = checkedCount > 0 && checkedCount < this.personList.length; + }, + cancelDistribute (row) { + cancelMission({ UniqeID: row.LKGList[0].UniqeID }).then(res => { + if (res.success) { + this.$notify({ + type: 'success', + message: res.msg + }); + this.refreshAll(); + } + }) + }, + refreshAll () { + this.trainNochecked = []; + this.checkedOrg = {}; + this.memberChecked = []; + this.searchMemberByOrg(); + this.renderVideoTable(); + this.renderTaskTable(); + }, + taskTableSelection (val) { + this.taskVideoChecked = val + }, + renderTaskTable () { + let _this = this; + let params = { + IsPackage: 0, + Status: this.taskType + }; + getTaskList(params).then(res => { + _this.taskTableData = res.data + }) + }, + // handleTrainNoSizeChange (size) { + // this.trainNoPageSize = size; + // this.renderVideoTable(); + // }, + handleTrainNoCurChange () { + this.renderVideoTable(); + }, + renderVideoTable () { + let _this = this; + let params = { + CarNumber: this.keyword1, + TrainNumber: this.keyword2, + DriverName: this.keyword3, + // PageIndex: this.trainNoCurPage, + // PageSize: this.trainNoPageSize, + notAssignedOnly: this.notAssignedOnly, + }; + getVideoListBySearch(params).then(res => { + _this.videoPackageList = res.data + _this.trainNoTotal = res.total; + }); + }, + toAddAssignList () { + let _this = this; + let params = { + UserID: this.memberChecked[0], + UniqeID: this.trainNochecked.join(',') + }; + addToAssignList(params).then(res => { + if (res.success) { + this.$notify({ + type: 'success', + message: res.msg + }); + _this.refreshAll(); + } + }) + }, + searchMemberByOrg () { + let _this = this; + getMemberByOrg({}).then(res => { + _this.personList = res.data; + // _this.orgTreeDialogVisible = false; + }) }, deepNodeChildren (node) { if (node.ChildDept && node.ChildDept.length > 0) { @@ -250,17 +426,19 @@ }) }, distributeTask () { - + let _this = this; + let arr = this.taskVideoChecked.map(train => train['LKGList'][0]['UniqeID']) + let params = { + UniqeID: arr.join(',') + } + distributeTask(params).then(res => { + _this.renderTaskTable(); + }) }, - searchVideoList () { - }, - selOrg () { - this.orgTreeDialogVisible = true; - }, - searchTask () { - - } + // selOrg () { + // this.orgTreeDialogVisible = true; + // }, } } </script> @@ -311,10 +489,38 @@ .video-list { margin-top: 14px; text-align: left; + .el-checkbox-group { + margin-bottom: 20px; + .el-checkbox__label{ + display: none; + } + .video-detail { + i { + //color: #409EFF; + } + color: #888; + } + } } } .top-right { width: 360px; + height: 465px; + // overflow-y:auto; + .header{ + .el-input{ + line-height: 41px; + width: 185px; + font-size: 14px; + } + .el-checkbox{ + float: left; + padding-left: 20px; + height: 40px; + line-height: 40px; + font-size: 14px; + } + } .checked-org { flex: 1; text-align: left; @@ -324,9 +530,17 @@ } .person-list { padding-top: 14px; + + .el-checkbox-group{ + height: 330px; + + margin-bottom: 8px; + overflow: auto; + } .person { text-align: left; margin-bottom: 10px; + padding-bottom: 6px; border-bottom: 1px solid #eee; } -- Gitblit v1.8.0