徽标
工单管理
合并请求
里程碑
探索
aidlab
/
aida_front
代码
工单
合并请求
Actions
软件包
项目
版本发布
百科
动态
您已经于43分钟前推送了分支 dev_vite
您已经于43分钟前推送了分支 StableVersion
文件
Events.vue
HomeView.vue
Works.vue
history.vue
library.vue
404.vue
Administrator.vue
Demo.vue
HomeMain.vue
HomeRecommend.vue
LoginPage.vue
Register.vue
Upgrade.vue
emailVerify.vue
feedbackSurvey.vue
feedbackSurveyCN.vue
paySucceed.vue
setIdentification.vue
test.vue
trialApproval.vue
versions1Guide.vue
App.vue
main.ts
shims-vue.d.ts
.env
.env.dev
.env.dev_build
.env.production
.env.test
.env.test_build
.eslintrc.js
.gitignore
README.md
babel.config.js
dist.7z
package-lock.json
package.json
tsconfig.json
vue.config.js
aida_front
/
src
/
views
/
HomeView
/
history.vue

X1627315083
b6e5f05f06
fix
6个月前
559 行
18 KiB
Vue
<template>
     <div class="history_page">
        <div class="page_content">
            <div class="page_content_body">
                <!-- <HeaderComponent></HeaderComponent> -->
                <div class="history_page_body">
                    <div class="history_table_search">
                       
                        <!-- <div class="content_search_block">
                            <input class="search_input" :placeholder="$t('HistoryPage.inputContent1')" v-model="searchCollectionName"  @keydown.enter="searchHistoryList()">
                            <div class="search_icon_block" @click="searchHistoryList()"><span class="icon iconfont icon-sousuo"></span></div>
                        </div> -->
						<div class="content_search_block generalModel_state">
							<div class="generalModel_state_item">
								<a-range-picker class="range_picker" v-model:value="rangePickerValue" :placeholder="[$t('HistoryPage.StartDate'), $t('HistoryPage.EndDate')]" valueFormat="YYYY-MM-DD">
									<template #suffixIcon>
										<span class="icon iconfont range_picker_icon icon-rili"></span>
									</template>
								</a-range-picker>
							</div>
							<div class="generalModel_state_item">
								<input class="search_input" :placeholder="$t('LibraryPage.inputContent1')" v-model="searchCollectionName"  @keydown.enter="searchHistoryList()">
							</div>
							<div class="generalModel_state_item">
								<el-cascader 
									:options="options" 
									filterable
									v-model="value.labelValue"
									:collapse-tags="true" 
									:show-all-levels="false" 
									:clearable="true"
									:placeholder="$t('LibraryPage.Select')"
									:max-collapse-tags=3
									:props="props" 
									:collapse-tags-tooltip="true"
									ref="cascader"
									popper-class="libraryPageCascader"
									@visible-change="dropdownVisibleChange"
								>
									<template #empty>
										<div>
											{{$t('LibraryPage.Select')}}
										</div>
									</template>
								</el-cascader>
							</div>
							<div class="intersection">
								<div :title="$t('LibraryPage.unionSet')" @click="()=>intersection = 1" v-show="intersection == 0" :class="['icon', 'iconfont','icon-bingji',]"></div>
								<div :title="$t('LibraryPage.intersection')" @click="()=>intersection = 0" v-show="intersection == 1" :class="['icon', 'iconfont','icon-bingji1',]"></div>
							</div>
							<!-- <div class="search_icon_block" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div> -->
							<div class="gallery_btn" style="padding: 2rem; line-height: 1;" @click="searchHistoryList('')"><span class="icon iconfont icon-sousuo"></span></div>

						</div>
                    </div>

                    <div class="history_table_content" ref="historyTable">
                         <a-table :columns="columns" :data-source="collectionList" :scroll="{ y: historyTableHeight }" @change="changePage"
                         :pagination="{
                            showSizeChanger:true,
                            current: currentPage,
                            pageSize:pageSize,
                            total: total,
                            showQuickJumper:true,
                            bordered:false
                         }">
						  <template #bodyCell="{ column, text, record ,index}">
								<div class="operate_list" v-if="column?.Operations">
									<div class="operate_item" @click="turnToDetail(record)">{{ $t('HistoryPage.Detail') }}</div>
									<div class="operate_item" @click="renameCollection(record,index)">{{ $t('LibraryPage.Rename') }}</div>
									<div class="operate_item" @click="retrieveHome(record)">{{ $t('HistoryPage.Retrieve') }}</div>
									<div class="operate_item" @click="deleteGroup(record, index)">{{ $t('HistoryPage.Delete') }}</div>
								</div>
							</template>
                        </a-table>
                    </div>
                </div>
            </div>
        </div>
        <!-- <HistoryDetail ref="historyDetail" :groupDetails="groupDetails" :collectionName="collectionName"></HistoryDetail> -->
		<setLabel ref="setLabel"></setLabel>
		<!-- <RobotAssist></RobotAssist> -->
		<searchLabel ref="searchLabel"></searchLabel>
		<div class="mark_loading" v-show="isShowMark">
            <a-spin size="large" />
        </div>
    </div>
</template>
<script lang="ts">
import { defineComponent,ref,createVNode,computed,nextTick,provide} from 'vue'
// import HeaderComponent from "@/component/HomePage/Header.vue";
// import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
import { Https } from "@/tool/https";
import { formatTime } from "@/tool/util"
import { Modal,message } from 'ant-design-vue';
// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { ElCascader } from 'element-plus'
import { useI18n } from 'vue-i18n';
import setLabel from '@/component/LibraryPage/setLabel.vue';
import searchLabel from '@/component/LibraryPage/searchLabel.vue';
import { useStore } from "vuex";

export default defineComponent({
    components: {
        // HeaderComponent,
        // HistoryDetail,
		// RobotAssist,
		setLabel,
		ElCascader,
		searchLabel,
    },
    setup() {
		const store = useStore();
        let rangePickerValue:any = ref([])
        let renameData:any = ref({}) //修改名字选中的数据
		let isShowMark:any = ref(false)
        const columns:any = computed(()=>{
			return [
				{ title: useI18n().t('HistoryPage.CollectionsName'), align:'center', ellipsis: true, width: 150, dataIndex: 'name', key: 'collectionName' },
				{ title: useI18n().t('HistoryPage.UptateTime'), align:'center', ellipsis: true,width: 150, dataIndex: 'updateDate', key: 'updateTime',customRender:(record:any)=>{
					let time = formatTime(record.text / 1000, 'YYYY-MM-DD hh:mm:ss')
					return time
				}},
				{ 
					title: useI18n().t('HistoryPage.source'), 
					align:'center', ellipsis: true, width: 150,
					dataIndex: 'original', key: 'original',
					customRender:(record:any)=>{
						let str = ''
						if(record.text == 1){
							str = useI18n().t('newScaleImage.Original')
						}else{
							str = `@${record.record.originalAccountName}/${record.record.originalPortfolioName}`
						}
						// let time = formatTime(record.text / 1000, 'YYYY-MM-DD hh:mm:ss')
						return str
					} 
				},
				{ title: useI18n().t('HistoryPage.SketchCounts'), align:'center', ellipsis: true, width: 120, dataIndex: 'sketchCount', key: 'sketchCounts' },
				{
					title: useI18n().t('HistoryPage.Operations'),
					key: 'operation',
					align:'center', 
					fixed: 'right',
					width: 180, 
					// slots:{customRender:'action'}
					Operations:true,
				},
			]
		});
        let collectionList:any = ref([])
		let {t} = useI18n()
		const options:any = ref([
		]);
		let value = ref({
			labelValue:[],
			editLabelValue:[],
		})
		let props = {
			multiple: true,
			checkStrictly: true,
			emitPath:true,
			children:'childList',
			value:'id',
			label:'classificationName',
		}
		let intersection = ref(1)
		let selectCode = ref('History')
		let type:any = {
			selectCode:selectCode,
			designType:''
		}
		provide('type',type)
        return {
			store,
            rangePickerValue,
            columns,
            collectionList,
            renameData,
			t,
			options,
			value,
			props,
			intersection,
			selectCode,
			isShowMark,
        }
    },
    data(){
        return{
            currentPage:1,
            pageSize:10,
            total:0,
            historyTableHeight:0,
            newCollectionName:'',
            groupDetails:{},//每个collection的详情
            collectionName:'',//选中的名字
            searchCollectionName:'',
        }
    },
    mounted(){
        let historyTable:any = this.$refs.historyTable
        this.historyTableHeight = historyTable.clientHeight - 130
        this.getHistoryList()
		this.getClass()
    },
    methods:{
		getClass(){
			let data = {
				"classificationIdList": [],
				"classificationName": "",
				"createTime": "",
				"deleteConfirm": '',
				"id": '',
				"libraryId": '',
				"parentId": '',
				"type": this.selectCode,
				"updateTime": "",
				"userId": ''
			}
			
			Https.axiosPost(Https.httpUrls.queryClassification, data).then(
                (rv: any) => {
					this.options = rv
					rv.forEach((rvItem:any,rvIndex:number) => {
						this.options[rvIndex].value = rvItem.id
						this.options[rvIndex].label = rvItem.classificationName
						rvItem.childList.forEach((childItem:any,index:number) => {
							this.options[rvIndex].childList[index].value = childItem.id
							this.options[rvIndex].childList[index].label = childItem.classificationName
						});
					});
                }
            ).catch((res)=>{
            });
		},
        turnToDetail(record:any){
            this.groupDetails = record.groupDetails
            let historyDetail:any = this.$refs.historyDetail
            this.collectionName = record.name
            historyDetail.changeDetailShow()
        },


        //改变页码
        changePage(e:any){
            this.currentPage = e.current
            this.pageSize = e.pageSize
            this.getHistoryList()
        },

        //查询列表
        searchHistoryList(){
             this.currentPage = 1
             this.getHistoryList()
        },

        getHistoryList(){
			this.isShowMark = true
            let startDate:any = this.rangePickerValue ? new Date(this.rangePickerValue[0]).getTime(): ''
            let endDate:any = this.rangePickerValue ? new Date(this.rangePickerValue[1]).getTime(): ''
           
			let labelArr:any = []
			this.value.labelValue.forEach((item:any)=>{
				labelArr.push(item[item.length-1])
			})
			let data = {
				classificationIdList:labelArr,
                page:this.currentPage,
                size:this.pageSize,
                collectionName:this.searchCollectionName,
                startDate:startDate,
                endDate:endDate,
				intersection:this.intersection,
            }
			
            Https.axiosPost( Https.httpUrls.historyProject, data).then(
			// Https.axiosPost( Https.httpUrls.queryUserGroup, data).then(
                (rv: any) => {
					if(this.currentPage > 1 && rv.content.length == 0){
						this.currentPage = 1
						this.getHistoryList()
					}else{
						this.collectionList = rv.content
						this.total = rv.total
					}
					this.isShowMark = false
                }
            ).catch(res=>{
				this.isShowMark = false
			});
        },

        //删除分组
        deleteGroup(record:any,index:number){
            let deleteGroupFun = (id:any,index:number) =>{
                let data = {
                    userGroupId:id
                }
                Https.axiosPost(Https.httpUrls.deleteUserGroup,data).then(
                    (rv: any) => {
                        message.success(this.t('HistoryPage.jsContent1'))
                        this.collectionList.splice(index,1)
						// let userGroupId: any = computed(() => {
						// 	return 
						// }); 
						if(record.id == this.store.state.HomeStoreModule.userGroupId){
							this.store.commit('deleteUserGroupId')
							this.store.commit("setLikeDesignCollectionList", []);
							this.store.commit("clearAllData");
							this.store.commit("clearAllCollection");
							this.store.commit("setAllBoardDataChoose",{});
							this.store.commit("clearShowSketchboard",{});
						}
                    }
                );
            }
            Modal.confirm({
                title: this.t('HistoryPage.jsContent2'),
                icon: createVNode(ExclamationCircleOutlined),
                okText: 'Yes',
                cancelText: 'No',
                centered:true,
				mask:false,
                onOk() {
                    deleteGroupFun(record.id,index)
                }
            });
        },

        //修改名字
        renameCollection(record:any,index:number){
			let searchLabel:any = this.$refs.searchLabel
			searchLabel.init(record,index)
        },

        retrieveHome(record:any){
			let num = true
			if(record.original == 0){
				num = false
			}
            this.$router.push({name:'homePage',params: {id:record.id,type:'History'}})
			this.store.commit('setChooseIsDesign',num)

        },
		removeLabel(){
			let setLabel:any = this.$refs.setLabel
			let cascader:any = this.$refs.cascader
			cascader.togglePopperVisible()
			let event = new Event('click', {"bubbles":true, "cancelable":true});
			document.dispatchEvent(event);
			setLabel.init('add',this.options)
		},
		dropdownVisibleChange(){
			let element:any = this.$refs.cascader
			nextTick().then(()=>{
				let cascader = document.getElementsByClassName('libraryPageCascader')[0]
				let cascaderChild = cascader
				let element:any = this.$refs.cascader
				if(cascader.children.length > 3 ){
				}else{
					let button1:any = document.createElement("span")
					button1.classList.add('started_btn','cascader_btn1')
					let button2:any = document.createElement("span")
					button2.classList.add('started_btn','cascader_btn2')
					let divMax:any = document.createElement("div")
					divMax.classList.add('cascader_btn_max')
					button1.textContent = 'Edit'
					// button2.textContent = '删除'
					button1.addEventListener('click',this.removeLabel,false)
					divMax.appendChild(button1)
					// divMax.appendChild(button2)
					cascaderChild?.insertAdjacentElement("afterbegin", divMax);
					
					// cascader.addEventListener('click',this.cascaderClick)
				}
			})
			let el = element.contentRef?.getElementsByClassName('el-cascader-menu__empty-text')?.[0]
			if(el){
				el.innerHTML = this.t('LibraryPage.NoLabel')
			}
		},
    }
})
</script>
<style lang="less">
.history_page {
    width: 100%;
    height: 100%;
	padding: 0 6rem;
	overflow: hidden;
	// min-width: 1440px;
	position: relative;
    .page_content {
        position: relative;
		.el-cascader .el-input .icon-arrow-down{
			font-size: 2.4rem;
		}
        .page_content_body {
            position: absolute;
            width: 100%;
            height: 100%;
            box-sizing: border-box;

            .history_page_body{
                width: 100%;
                height: 100%;
                padding: 3rem 0;
                box-sizing: border-box;

                .history_header{
                    font-size: 1.8rem;
                    height: 6.3rem;
                    line-height: 6.3rem;
                    font-weight: 500;
                    color: #333333;
                }

                .history_table_search{
                    display: flex;
                    align-items: center;

                    
					.ant-picker:hover, .ant-picker-focused{
						border-color: #d5d8df;
					}
					.content_search_block{
						display: flex;
						align-items: center;
						width: 140rem; 
					
						.search_icon_block{
							width: 5.2rem;
							height: 2.8rem;
							line-height: 2.8rem;
							text-align: center;
							background: #343579;
							background-color: #39215b;
							cursor: pointer;
							border-radius: 2rem;
							margin-left: 3rem;
							.icon-sousuo{
								font-size: 1.6rem;
								color: #FFFFFF;
							}
						}
						.intersection{
							cursor: pointer;
							margin-right: 3rem;
							>div{
								font-size: 3rem;
								font-weight: 900;
							}
						}
					}
                }

                .history_table_content{
                    margin-top: 2.6rem;
                    width: 100%;
                    height: calc(100% - 13.7rem);
                    background: rgba(255, 255, 255, 0.6);
                    padding-bottom: 3rem;

                    .ant-table{
                        background: transparent;
                    }
                    
                    .ant-table-body{
                        overflow-y: auto !important;
                        -ms-overflow-style: none;
                        overflow: -moz-scrollbars-none;

                        &::-webkit-scrollbar { width: 0 !important }

                    }
					
                    .ant-table-thead > tr > th{
                        background: #FFFFFF;
                    }
					.ant-table-tbody > tr:hover{
						background: #ededed;
					}
                    .ant-table-tbody > tr > td{
                        border: none;
                        background: transparent;

                        
                    }
					.ant-table-pagination-right{
						justify-content: center;
					}

                     .ant-table-pagination-right{
                         padding-right: 3.5rem;
                     }

                    .operate_list{
                        display: flex;
                        align-items: center;
                        justify-content: space-between;
                        padding: 0 1rem;

                        .operate_item{
                            font-size: 1.4rem;
                            font-family: Roboto;
                            font-weight: 400;
                            color: #007EE5;
                            cursor: pointer;
                        }
                    }
                }
            }
        }
    }

    
}

.rename_modal_component{

    .collection_rename_content{
        padding:2rem 9.2rem 3rem;


        .rename_form_content{

            .rename_form_input{
                width: 100%;
                height: 4.6rem;
                margin-top: 1rem;
                border: 0.1rem solid #B4BED7;
                padding-left: 2.1rem;
                line-height: 4.6rem;
                font-size: 1.8rem;
                box-sizing: border-box;

                &::placeholder {
                    color:#A5B0C2,
                }
            }
        }

        .rename_submit_button{
            height: 4.8rem;
            line-height: 4.8rem;
            background: #343579;
            font-size: 2.4rem;
            font-weight: 500;
            color: #FFFFFF;
            width: 16rem;
            text-align: center;
            cursor: pointer;
            margin: 4.5rem auto 0;
        }
    }
}
</style>
Powered by Gitea
当前版本: 1.24.5 页面:
155ms
模板:
20ms
许可证
API