2023-11-9-dist
This commit is contained in:
X1627315083
1
dist/css/177.ba273ec0.css
vendored
Normal file
1
dist/css/177.ba273ec0.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/300.79379326.css
vendored
1
dist/css/300.79379326.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/300.ed7a3df4.css
vendored
Normal file
1
dist/css/300.ed7a3df4.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/464.e8156e49.css
vendored
1
dist/css/464.e8156e49.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/607.7d4cde11.css
vendored
1
dist/css/607.7d4cde11.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/714.09e0578b.css
vendored
Normal file
1
dist/css/714.09e0578b.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/714.d849c706.css
vendored
1
dist/css/714.d849c706.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/804.3eb2d826.css
vendored
Normal file
1
dist/css/804.3eb2d826.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/819.c56de45b.css
vendored
Normal file
1
dist/css/819.c56de45b.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/css/908.73005e03.css
vendored
1
dist/css/908.73005e03.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/986.0c3dd7b2.css
vendored
1
dist/css/986.0c3dd7b2.css
vendored
File diff suppressed because one or more lines are too long
1
dist/css/986.8e092e76.css
vendored
Normal file
1
dist/css/986.8e092e76.css
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
dist/index.html
vendored
2
dist/index.html
vendored
@@ -1 +1 @@
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>AiDA</title><link rel="stylesheet" href="./css/googleapis.css"><link rel="stylesheet" href="./css/roboto.css"><script defer="defer" src="/js/chunk-vendors.ac33c5f3.js"></script><script defer="defer" src="/js/app.19a0967f.js"></script><link href="/css/chunk-vendors.5e9dbdc9.css" rel="stylesheet"><link href="/css/app.18215b47.css" rel="stylesheet"></head><body><script src="./js/color-thief.js"></script><noscript><strong>We're sorry but aida doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title>AiDA</title><link rel="stylesheet" href="./css/googleapis.css"><link rel="stylesheet" href="./css/roboto.css"><script defer="defer" src="/js/chunk-vendors.ac33c5f3.js"></script><script defer="defer" src="/js/app.af97db2a.js"></script><link href="/css/chunk-vendors.5e9dbdc9.css" rel="stylesheet"><link href="/css/app.813ecc8b.css" rel="stylesheet"></head><body><script src="./js/color-thief.js"></script><noscript><strong>We're sorry but aida doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
dist/js/464.63ceb31e.js
vendored
1
dist/js/464.63ceb31e.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
dist/js/819.e907b7eb.js
vendored
Normal file
1
dist/js/819.e907b7eb.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -344,7 +344,10 @@ li {
|
||||
width: 0.57142857rem;
|
||||
height: 0.91428571rem;
|
||||
}
|
||||
.ant-checkbox {
|
||||
.ant-checkbox-wrapper {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
.ant-checkbox-wrapper span {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
.ant-checkbox-checked::after {
|
||||
|
||||
@@ -395,8 +395,11 @@ ul,li{
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-checkbox{
|
||||
.ant-checkbox-wrapper{
|
||||
font-size: 1.4rem;
|
||||
span{
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
.ant-checkbox-checked::after{
|
||||
border: 1px solid rgba(0,0,0,.65);
|
||||
|
||||
@@ -248,6 +248,21 @@ export default defineComponent({
|
||||
this.getMannequins()
|
||||
}
|
||||
},
|
||||
// 'workspaceItem.sex':{
|
||||
// handler(newVal:any,oldVal:any){
|
||||
// console.log(oldVal);
|
||||
|
||||
// if(oldVal){
|
||||
// console.log(oldVal);
|
||||
|
||||
// if(newVal != oldVal){
|
||||
// console.log(this.workspaceItem.position);
|
||||
|
||||
// this.workspaceItem.position = this.singleTypeList[0].label
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
workspaceItem:{
|
||||
handler(newVal:any,oldVal:any){
|
||||
this.store.commit("setWorkspace", this.workspaceItem);
|
||||
@@ -259,9 +274,8 @@ export default defineComponent({
|
||||
store: useStore(),
|
||||
};
|
||||
},
|
||||
async mounted() {
|
||||
mounted() {
|
||||
this.getworkspace()
|
||||
this.getSex()
|
||||
},
|
||||
directives:{
|
||||
fade:{
|
||||
@@ -299,8 +313,8 @@ export default defineComponent({
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getSex(){
|
||||
Https.axiosGet(Https.httpUrls.workspaceenumValues,{params:{enumName:'Sex'}}).then((rv: any) => {
|
||||
async getSex(){
|
||||
await Https.axiosGet(Https.httpUrls.workspaceenumValues,{params:{enumName:'Sex'}}).then((rv: any) => {
|
||||
if (rv) {
|
||||
let arr:any = []
|
||||
rv.forEach((item:any) => {
|
||||
@@ -311,19 +325,18 @@ export default defineComponent({
|
||||
arr.push(obj)
|
||||
});
|
||||
this.sex = arr
|
||||
this.getPosition()
|
||||
}
|
||||
})
|
||||
|
||||
this.getPosition('')
|
||||
},
|
||||
getPosition(){
|
||||
async getPosition(str:any){
|
||||
let params
|
||||
if(this.workspaceItem.sex == 'Female'){
|
||||
params = 'FemalePosition'
|
||||
}else{
|
||||
params = 'MalePosition'
|
||||
}
|
||||
Https.axiosGet(Https.httpUrls.workspaceenumValues,{params:{enumName:params}}).then((rv: any) => {
|
||||
await Https.axiosGet(Https.httpUrls.workspaceenumValues,{params:{enumName:params}}).then((rv: any) => {
|
||||
if (rv) {
|
||||
let arr:any = []
|
||||
rv.forEach((item:any) => {
|
||||
@@ -334,12 +347,15 @@ export default defineComponent({
|
||||
arr.push(obj)
|
||||
});
|
||||
this.singleTypeList = arr
|
||||
if(this.workspaceItem.overallSingle){
|
||||
if(str == 'sex'){
|
||||
this.workspaceItem.position = this.singleTypeList[0].label
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
setPosition(){
|
||||
this.workspaceItem.position = this.singleTypeList[0].label
|
||||
},
|
||||
getworkspace(){
|
||||
// Https.axiosGet(Https.httpUrls.workspaceDetail,{params:{id:3}}).then((rv: any) => {
|
||||
// if (rv) {
|
||||
@@ -367,7 +383,7 @@ export default defineComponent({
|
||||
});
|
||||
this.workspace.id = rv.id
|
||||
this.workspace.workspaceList = rv.page.content
|
||||
|
||||
this.getSex()
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -420,6 +436,7 @@ export default defineComponent({
|
||||
setOverallSingle(){
|
||||
if(this.workspaceItem.overallSingle){
|
||||
this.workspaceItem.position = this.singleTypeList[0].label
|
||||
|
||||
}else{
|
||||
this.workspaceItem.position = 'Overall'
|
||||
}
|
||||
@@ -514,7 +531,8 @@ export default defineComponent({
|
||||
this.workspaceItem.sex = v
|
||||
this.getMannequins()
|
||||
this.setMannequinsSex()
|
||||
this.getPosition()
|
||||
this.getPosition('sex')
|
||||
|
||||
},
|
||||
//设置single & overall
|
||||
setSingle(v:string){
|
||||
|
||||
@@ -10,8 +10,8 @@
|
||||
<div class="my_material_header">
|
||||
<div class="my_material_header_right">
|
||||
<div class="content_search_block">
|
||||
<input class="search_input" :placeholder="$t('Material.inputContent1')" v-model="searchPictureName" @keydown.enter="getLibraryList()">
|
||||
<div class="search_icon_block" @click.stop="getLibraryList()"><span class="icon iconfont icon-sousuo"></span></div>
|
||||
<input class="search_input" :placeholder="$t('Material.inputContent1')" v-model="searchPictureName" @keydown.enter="getLibraryList('')">
|
||||
<div class="search_icon_block" @click.stop="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -145,7 +145,7 @@ export default defineComponent({
|
||||
function callback(entries:any, observer:any) {
|
||||
entries.forEach((entry:any) => {
|
||||
if (entry.isIntersecting) {
|
||||
this_.getLibraryList()
|
||||
this_.getLibraryList('di')
|
||||
} else {
|
||||
}
|
||||
});
|
||||
@@ -193,7 +193,7 @@ export default defineComponent({
|
||||
// entries.forEach((entry:any) => {
|
||||
// if (entry.isIntersecting) {
|
||||
// console.log(111);
|
||||
// // this_.getLibraryList()
|
||||
// // this_.getLibraryList('')
|
||||
// } else {
|
||||
// }
|
||||
// });
|
||||
@@ -251,7 +251,7 @@ export default defineComponent({
|
||||
init(code:any){
|
||||
this.selectCode = code
|
||||
// this.myMaterialModalShow = true
|
||||
this.getLibraryList()
|
||||
this.getLibraryList('')
|
||||
|
||||
},
|
||||
selectImgItem(imgData:any){
|
||||
@@ -267,21 +267,24 @@ export default defineComponent({
|
||||
changePage(current: number, pageSize: number){
|
||||
this.currentPage = current
|
||||
this.pageSize = pageSize
|
||||
this.getLibraryList()
|
||||
this.getLibraryList('')
|
||||
},
|
||||
|
||||
handleChange(){
|
||||
this.getLibraryList()
|
||||
this.getLibraryList('')
|
||||
},
|
||||
|
||||
//选择所有的图片
|
||||
getLibraryList(){
|
||||
getLibraryList(str:any){
|
||||
let workspace = this.store.state.Workspace.workspace
|
||||
if(str == 'di'){
|
||||
this.currentPage = this.imgList?.[0]?.id != undefined?this.imgList?.length / this.pageSize+1:1
|
||||
}
|
||||
let data = {
|
||||
level1Type:this.selectCode,
|
||||
// level2Type:this.designType,
|
||||
modelSex:workspace?.sex,
|
||||
page: this.imgList?.[0]?.id != undefined?this.imgList?.length / this.pageSize+1:1,
|
||||
page: this.currentPage,
|
||||
// page:this.currentPage,
|
||||
pictureName:this.searchPictureName,
|
||||
size:this.pageSize,
|
||||
@@ -317,7 +320,12 @@ export default defineComponent({
|
||||
}
|
||||
aa.push(item)
|
||||
});
|
||||
this.imgList.push(...aa)
|
||||
if(aa[aa.length-1].id == this.imgList[this.imgList.length-1]?.id){
|
||||
|
||||
}else{
|
||||
this.imgList.push(...aa)
|
||||
}
|
||||
// this.imgList = aa
|
||||
this.total = rv.total
|
||||
this.isShowLoading = false
|
||||
}
|
||||
|
||||
344
src/component/LibraryPage/labelList.vue
Normal file
344
src/component/LibraryPage/labelList.vue
Normal file
@@ -0,0 +1,344 @@
|
||||
<template>
|
||||
<a-modal class="library_setLabel"
|
||||
v-model:visible="setLabelShow"
|
||||
:footer="null"
|
||||
title="Edit tag"
|
||||
width="65%"
|
||||
:maskClosable="false"
|
||||
:centered="true"
|
||||
@onCancel="clearSetLabel"
|
||||
>
|
||||
<div class="setLabel_centent">
|
||||
<ul class="optionsItem">
|
||||
<li class="optionsItem_title" v-for="optionsItem,optionsIndex in options" :key="optionsItem.id">
|
||||
<div class="setLabel_text">
|
||||
<a-checkbox v-model:checked="optionsItem.checkAll" @change="onCheckAllChange(optionsItem)"></a-checkbox>
|
||||
<span v-show="!optionsItem.openType">{{ optionsItem.label }}</span>
|
||||
<input v-show="optionsItem.openType" type="text" v-model="itemName">
|
||||
<i v-show="optionsItem.openType" @click.stop="putName(index,'affirm',optionsItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="!optionsItem.openType" @click.stop="putName(optionsIndex,'put',optionsItem)" class="fi fi-rr-edit"></i>
|
||||
</div>
|
||||
|
||||
<ul class="childrenItem active" v-mousewheel>
|
||||
<li class="childrenItem_title setLabel_text" v-for="childrenItem,childrenIndex in optionsItem.children" :key="childrenItem.id">
|
||||
<a-checkbox v-model:checked="childrenItem.checkAll"></a-checkbox>
|
||||
<span v-show="!childrenItem.openType">{{ childrenItem.label }}</span>
|
||||
<input v-show="childrenItem.openType" type="text" v-model="itemName">
|
||||
<i v-show="childrenItem.openType" @click.stop="putName(index,'affirm',childrenItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="!childrenItem.openType" @click.stop="putName(childrenIndex,'put',childrenItem)" class="fi fi-rr-edit"></i>
|
||||
</li>
|
||||
<li @click="newWorkspace(optionsItem)" class="newWorkspace setLabel_text">
|
||||
<input v-show="optionsItem.addOpenType" type="text" v-model="itemName">
|
||||
<i @click.stop="putName(-1,'affirm',optionsItem)" v-show="optionsItem.addOpenType" class="fi fi-br-check"></i>
|
||||
<div v-show="!optionsItem.addOpenType">+</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li @click="newWorkspace('')" class="newWorkspace setLabel_text optionsItem_title">
|
||||
<input v-show="openType" type="text" v-model="itemName">
|
||||
<i @click.stop="putName(-1,'affirm',optionsItem)" v-show="openType" class="fi fi-br-check"></i>
|
||||
<div v-show="!openType">+</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a-modal>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,ref,createVNode,watch,nextTick} from 'vue'
|
||||
import { Https } from "@/tool/https";
|
||||
import {dataURLtoFile,base64toFile} from "@/tool/util"
|
||||
import { getCookie } from "@/tool/cookie";
|
||||
import 'vue-cropper/dist/index.css'
|
||||
import { VueCropper } from "vue-cropper";
|
||||
import { useStore } from "vuex";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
|
||||
|
||||
export default defineComponent({
|
||||
components:{
|
||||
VueCropper,
|
||||
},
|
||||
setup() {
|
||||
let multiple = ref(false)
|
||||
let indeterminate = ref(true)
|
||||
const options:any = ref([
|
||||
{
|
||||
label: 'Light',
|
||||
value: 'light',
|
||||
checkAll:false,
|
||||
children: new Array(10)
|
||||
.fill(null)
|
||||
.map((_, index) => ({ label: `Number ${index}`, value: index })),
|
||||
},
|
||||
{
|
||||
label: 'Bamboo',
|
||||
value: 'bamboo',
|
||||
checkAll:false,
|
||||
children: [
|
||||
{
|
||||
label: 'Little',
|
||||
checkAll:false,
|
||||
value: 'little',
|
||||
children: [
|
||||
{
|
||||
label: `'Toy Fish'`,
|
||||
value: 'fish',
|
||||
},
|
||||
{
|
||||
label: 'Toy Cards',
|
||||
value: 'cards',
|
||||
},
|
||||
{
|
||||
label: 'Toy Bird',
|
||||
value: 'bird',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
let checkedList = ref([])
|
||||
let openType = ref(false)
|
||||
let itemName = ref('')
|
||||
let {t} = useI18n()
|
||||
return {
|
||||
multiple,
|
||||
indeterminate,
|
||||
value: ref<string[]>([]),
|
||||
options,
|
||||
checkedList,
|
||||
openType,
|
||||
itemName,
|
||||
t
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
setLabelShow:false,
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
directives:{
|
||||
mousewheel:{
|
||||
mounted (el) {
|
||||
let bodyDom:any = document.getElementsByClassName('optionsItem')[0]
|
||||
nextTick().then(()=>{
|
||||
let dom:any = document.getElementsByClassName('childrenItem')
|
||||
let domParent:any = document.getElementsByClassName('optionsItem_title')
|
||||
let mouseover = ()=>{
|
||||
bodyDom.classList.add('active')
|
||||
}
|
||||
let mouseleave = ()=>{
|
||||
bodyDom.classList.remove('active')
|
||||
}
|
||||
// domParent?.forEach((item:any) => {
|
||||
// item.addEventListener('mouseover',mouseover)
|
||||
// item.addEventListener('mouseleave',mouseleave)
|
||||
// });
|
||||
for (let index = 0; index < domParent.length; index++) {
|
||||
domParent[index].addEventListener('mouseover',mouseover)
|
||||
domParent[index].addEventListener('mouseover',mouseleave)
|
||||
}
|
||||
|
||||
el.addEventListener('wheel',(e:WheelEvent)=>{
|
||||
let num = 0
|
||||
if(e.deltaY > 0){
|
||||
num = 25
|
||||
}else{
|
||||
num = -25
|
||||
}
|
||||
el.scrollBy(num, 0);
|
||||
},true)
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(str:any){
|
||||
this.setLabelShow = true
|
||||
if(str === 'add'){
|
||||
this.multiple = false
|
||||
}else{
|
||||
this.multiple = true
|
||||
}
|
||||
|
||||
},
|
||||
clearSetLabel(){
|
||||
this.setLabelShow = false
|
||||
},
|
||||
onCheckAllChange(value:any){
|
||||
value.children.forEach((item:any) => {
|
||||
item.checkAll = value.checkAll
|
||||
});
|
||||
},
|
||||
putName(index:number,v:string,item:any){
|
||||
if(v == 'put'){
|
||||
this.options.forEach((optionsItem:any) => {
|
||||
optionsItem.openType = false
|
||||
optionsItem.addOpenType = false
|
||||
optionsItem.children.forEach((childrenItem:any) => {
|
||||
childrenItem.openType = false
|
||||
});
|
||||
});
|
||||
item.openType = true
|
||||
this.itemName = item.label
|
||||
|
||||
|
||||
// this.options[index].openType = true
|
||||
// this.itemName = this.workspace.workspaceList[index].workSpaceName
|
||||
}else if(v == 'affirm'){
|
||||
|
||||
if(index == -1){
|
||||
if(this.itemName == ''){
|
||||
message.warning(this.t('Habit.jsContent2'));
|
||||
}else{
|
||||
console.log(this.itemName);
|
||||
item.addOpenType = false
|
||||
}
|
||||
}else{
|
||||
item.label = this.itemName
|
||||
item.openType = false
|
||||
}
|
||||
}
|
||||
},
|
||||
newWorkspace(item:any){
|
||||
// console.log(index);
|
||||
|
||||
if(item){
|
||||
this.itemName = ''
|
||||
item.addOpenType = true
|
||||
}else{
|
||||
this.openType = true
|
||||
}
|
||||
// console.log(item.addOpenType);
|
||||
|
||||
// this.options.forEach((optionsItem:any) => {
|
||||
// optionsItem.openType = false
|
||||
// optionsItem.children.forEach((childrenItem:any) => {
|
||||
// childrenItem.openType = false
|
||||
// });
|
||||
// });
|
||||
// this.itemName = ''
|
||||
// item.openType = true
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less">
|
||||
.library_setLabel{
|
||||
.setLabel_centent{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// height: 300px;
|
||||
max-height: 65rem;
|
||||
overflow-y: auto;
|
||||
// border-radius: ;
|
||||
ul{
|
||||
display: flex;
|
||||
li{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
i{
|
||||
cursor: pointer;
|
||||
}
|
||||
input{
|
||||
border: 0;
|
||||
width: 80%;
|
||||
background: rgba(0,0,0,0);
|
||||
}
|
||||
}
|
||||
.setLabel_text{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin: 0 2rem;
|
||||
width: 12rem;
|
||||
justify-content: space-between;
|
||||
flex-shrink: 0;
|
||||
i{
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
.optionsItem{
|
||||
flex-direction: column;
|
||||
&.active{
|
||||
overflow: hidden;
|
||||
}
|
||||
>li{
|
||||
>label{
|
||||
align-items: center;
|
||||
}
|
||||
.childrenItem{
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
height: 7rem;
|
||||
margin: 2rem 0;
|
||||
&.active::-webkit-scrollbar-button:single-button{
|
||||
display: none;
|
||||
}
|
||||
&.active::-webkit-scrollbar {
|
||||
/* 竖轴的宽度 */
|
||||
width: 1rem;
|
||||
/* 横轴的高度 */
|
||||
height: 1rem;
|
||||
transition: all .3s;
|
||||
}
|
||||
/* 进度 */
|
||||
&.active::-webkit-scrollbar-thumb {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
/* 轨道 */
|
||||
&.active::-webkit-scrollbar-track {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
&.active:hover {
|
||||
// overflow-x: scroll;
|
||||
&.active::-webkit-scrollbar-thumb {
|
||||
background: #543087;
|
||||
}
|
||||
/* 轨道 */
|
||||
&.active::-webkit-scrollbar-track {
|
||||
background: rgba(84, 48, 135,.2);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.newWorkspace{
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
|
||||
div{
|
||||
border-radius: 50%;
|
||||
border: 1px solid #000;
|
||||
display: inline-block;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
line-height: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
i{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -9,26 +9,43 @@
|
||||
@onCancel="clearSetLabel"
|
||||
>
|
||||
<div class="setLabel_centent">
|
||||
<ul class="setLabel_label1" v-for="item1 in options" :key="item1.id">
|
||||
<li class="label1_title">
|
||||
<a-checkbox
|
||||
v-model:checked="item1.checkAll"
|
||||
:indeterminate="indeterminate"
|
||||
@change="onCheckAllChange(item1.children,$event)"
|
||||
>
|
||||
{{ item1.label }}
|
||||
</a-checkbox>
|
||||
<ul class="setLabel_label2" >
|
||||
<a-checkbox-group v-model:value="checkedList" :options="item1.children" />
|
||||
<ul class="optionsItem">
|
||||
<li class="optionsItem_title" v-for="optionsItem,optionsIndex in options" :key="optionsItem.id">
|
||||
<div class="setLabel_text">
|
||||
<a-checkbox v-model:checked="optionsItem.checkAll" @change="onCheckAllChange(optionsItem)"></a-checkbox>
|
||||
<span v-show="!optionsItem.openType">{{ optionsItem.classificationName }}</span>
|
||||
<input v-show="optionsItem.openType" type="text" v-model="itemName">
|
||||
<i v-show="optionsItem.openType" @click.stop="putName(index,'affirm',optionsItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="!optionsItem.openType" @click.stop="putName(optionsIndex,'put',optionsItem)" class="fi fi-rr-edit"></i>
|
||||
</div>
|
||||
|
||||
<ul class="childrenItem active" v-mousewheel>
|
||||
<li class="childrenItem_title setLabel_text" v-for="childrenItem,childrenIndex in optionsItem.children" :key="childrenItem.id">
|
||||
<a-checkbox v-model:checked="childrenItem.checkAll"></a-checkbox>
|
||||
<span v-show="!childrenItem.openType">{{ childrenItem.classificationName }}</span>
|
||||
<input v-show="childrenItem.openType" type="text" v-model="itemName">
|
||||
<i v-show="childrenItem.openType" @click.stop="putName(index,'affirm',childrenItem)" class="fi fi-br-check"></i>
|
||||
<i v-show="!childrenItem.openType" @click.stop="putName(childrenIndex,'put',childrenItem)" class="fi fi-rr-edit"></i>
|
||||
</li>
|
||||
<li @click="newLabel(optionsItem)" class="newLabel setLabel_text">
|
||||
<input v-show="optionsItem.addOpenType" type="text" v-model="itemName">
|
||||
<i @click.stop="putName(-1,'affirm',optionsItem)" v-show="optionsItem.addOpenType" class="fi fi-br-check"></i>
|
||||
<div v-show="!optionsItem.addOpenType">+</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li @click="newLabel('')" class="newLabel setLabel_text optionsItem_title">
|
||||
<input v-show="openType" type="text" v-model="itemName">
|
||||
<i @click.stop="putName(-1,'affirm','')" v-show="openType" class="fi fi-br-check"></i>
|
||||
<div v-show="!openType">+</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a-modal>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent,ref,createVNode,watch,reactive} from 'vue'
|
||||
import { defineComponent,ref,createVNode,watch,nextTick,inject} from 'vue'
|
||||
import { Https } from "@/tool/https";
|
||||
import {dataURLtoFile,base64toFile} from "@/tool/util"
|
||||
import { getCookie } from "@/tool/cookie";
|
||||
@@ -43,47 +60,13 @@ export default defineComponent({
|
||||
VueCropper,
|
||||
},
|
||||
setup() {
|
||||
let cropperTime:any = ref()
|
||||
let multiple = ref(false)
|
||||
let indeterminate = ref(true)
|
||||
const options: CascaderProps['options'] = [
|
||||
{
|
||||
label: 'Light',
|
||||
value: 'light',
|
||||
checkAll:false,
|
||||
children: new Array(20)
|
||||
.fill(null)
|
||||
.map((_, index) => ({ label: `Number ${index}`, value: index })),
|
||||
},
|
||||
{
|
||||
label: 'Bamboo',
|
||||
value: 'bamboo',
|
||||
checkAll:false,
|
||||
children: [
|
||||
{
|
||||
label: 'Little',
|
||||
checkAll:false,
|
||||
value: 'little',
|
||||
children: [
|
||||
{
|
||||
label: `'Toy Fish'`,
|
||||
value: 'fish',
|
||||
},
|
||||
{
|
||||
label: 'Toy Cards',
|
||||
value: 'cards',
|
||||
},
|
||||
{
|
||||
label: 'Toy Bird',
|
||||
value: 'bird',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
let options:any = inject('options')//父组件传过来的数据
|
||||
let type:any = inject('type')//父组件传过来的数据
|
||||
let checkedList = ref([])
|
||||
|
||||
let openType = ref(false)
|
||||
let itemName = ref('')
|
||||
let {t} = useI18n()
|
||||
return {
|
||||
multiple,
|
||||
@@ -91,6 +74,9 @@ export default defineComponent({
|
||||
value: ref<string[]>([]),
|
||||
options,
|
||||
checkedList,
|
||||
openType,
|
||||
type,
|
||||
itemName,
|
||||
t
|
||||
}
|
||||
},
|
||||
@@ -104,6 +90,42 @@ export default defineComponent({
|
||||
watch: {
|
||||
|
||||
},
|
||||
directives:{
|
||||
mousewheel:{
|
||||
mounted (el) {
|
||||
let bodyDom:any = document.getElementsByClassName('optionsItem')[0]
|
||||
nextTick().then(()=>{
|
||||
let dom:any = document.getElementsByClassName('childrenItem')
|
||||
let domParent:any = document.getElementsByClassName('optionsItem_title')
|
||||
let mouseover = ()=>{
|
||||
bodyDom.classList.add('active')
|
||||
}
|
||||
let mouseleave = ()=>{
|
||||
bodyDom.classList.remove('active')
|
||||
}
|
||||
// domParent?.forEach((item:any) => {
|
||||
// item.addEventListener('mouseover',mouseover)
|
||||
// item.addEventListener('mouseleave',mouseleave)
|
||||
// });
|
||||
for (let index = 0; index < domParent.length; index++) {
|
||||
domParent[index].addEventListener('mouseover',mouseover)
|
||||
domParent[index].addEventListener('mouseover',mouseleave)
|
||||
}
|
||||
|
||||
el.addEventListener('wheel',(e:WheelEvent)=>{
|
||||
let num = 0
|
||||
if(e.deltaY > 0){
|
||||
num = 25
|
||||
}else{
|
||||
num = -25
|
||||
}
|
||||
el.scrollBy(num, 0);
|
||||
},true)
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
init(str:any){
|
||||
this.setLabelShow = true
|
||||
@@ -117,16 +139,108 @@ export default defineComponent({
|
||||
clearSetLabel(){
|
||||
this.setLabelShow = false
|
||||
},
|
||||
onCheckAllChange(item:any,e:any){
|
||||
console.log(this.checkedList);
|
||||
this.checkedList = item
|
||||
// this.checkedList.forEach((item)=>{
|
||||
// item.
|
||||
// })
|
||||
this.checkedList= e.target.checked ? item : [];
|
||||
this.indeterminate= false;
|
||||
}
|
||||
|
||||
onCheckAllChange(value:any){
|
||||
value.children.forEach((item:any) => {
|
||||
item.checkAll = value.checkAll
|
||||
});
|
||||
},
|
||||
putName(index:number,v:string,item:any){
|
||||
if(v == 'put'){
|
||||
this.options.forEach((optionsItem:any) => {
|
||||
optionsItem.openType = false
|
||||
optionsItem.addOpenType = false
|
||||
optionsItem.children.forEach((childrenItem:any) => {
|
||||
childrenItem.openType = false
|
||||
});
|
||||
});
|
||||
item.openType = true
|
||||
this.itemName = item.label
|
||||
|
||||
|
||||
// this.options[index].openType = true
|
||||
// this.itemName = this.workspace.workspaceList[index].workSpaceName
|
||||
}else if(v == 'affirm'){
|
||||
|
||||
if(index == -1){
|
||||
if(this.itemName == ''){
|
||||
message.warning(this.t('Habit.jsContent2'));
|
||||
}else{
|
||||
console.log(this.itemName);
|
||||
let data:any = {
|
||||
label:this.itemName,
|
||||
value:this.itemName,
|
||||
}
|
||||
if(item){
|
||||
item.addOpenType = false
|
||||
item.children.push(data)
|
||||
}else{
|
||||
this.openType = false
|
||||
data.children = []
|
||||
this.options.push(data)
|
||||
}
|
||||
}
|
||||
}else{
|
||||
item.label = this.itemName
|
||||
item.openType = false
|
||||
}
|
||||
}
|
||||
},
|
||||
newLabel(item:any){
|
||||
// console.log(index);
|
||||
this.itemName = ''
|
||||
this.options.forEach((optionsItem:any) => {
|
||||
optionsItem.openType = false
|
||||
optionsItem.addOpenType = false
|
||||
optionsItem.children.forEach((childrenItem:any) => {
|
||||
childrenItem.openType = false
|
||||
});
|
||||
});
|
||||
this.openType = false
|
||||
|
||||
if(item){
|
||||
item.addOpenType = true
|
||||
}else{
|
||||
this.openType = true
|
||||
}
|
||||
// console.log(item.addOpenType);
|
||||
|
||||
// this.options.forEach((optionsItem:any) => {
|
||||
// optionsItem.openType = false
|
||||
// optionsItem.children.forEach((childrenItem:any) => {
|
||||
// childrenItem.openType = false
|
||||
// });
|
||||
// });
|
||||
// this.itemName = ''
|
||||
// item.openType = true
|
||||
this.addLabel()
|
||||
},
|
||||
addLabel(){
|
||||
let data = this.setLabelData()
|
||||
console.log(data);
|
||||
|
||||
Https.axiosPost(Https.httpUrls.saveOrUpdate, data).then(
|
||||
(rv: any) => {
|
||||
console.log(rv);
|
||||
|
||||
}
|
||||
).catch((res)=>{
|
||||
});
|
||||
},
|
||||
setLabelData(){
|
||||
let data = {
|
||||
"classificationIdList": [],
|
||||
"classificationName": "123221",
|
||||
"createTime": "",
|
||||
"deleteConfirm": '',
|
||||
"id": '',
|
||||
"libraryId": '',
|
||||
"parentId": '',
|
||||
"type": this.type?.selectCode._value,
|
||||
"updateTime": "",
|
||||
"userId": ''
|
||||
}
|
||||
return data
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@@ -135,6 +249,10 @@ export default defineComponent({
|
||||
.setLabel_centent{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// height: 300px;
|
||||
max-height: 65rem;
|
||||
overflow-y: auto;
|
||||
// border-radius: ;
|
||||
ul{
|
||||
display: flex;
|
||||
li{
|
||||
@@ -143,6 +261,93 @@ export default defineComponent({
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
i{
|
||||
cursor: pointer;
|
||||
}
|
||||
input{
|
||||
border: 0;
|
||||
width: 80%;
|
||||
background: rgba(0,0,0,0);
|
||||
}
|
||||
}
|
||||
.setLabel_text{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin: 0 2rem;
|
||||
width: 12rem;
|
||||
justify-content: space-between;
|
||||
flex-shrink: 0;
|
||||
i{
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
.optionsItem{
|
||||
flex-direction: column;
|
||||
&.active{
|
||||
overflow: hidden;
|
||||
}
|
||||
>li{
|
||||
>label{
|
||||
align-items: center;
|
||||
}
|
||||
.childrenItem{
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
height: 7rem;
|
||||
margin: 2rem 0;
|
||||
&.active::-webkit-scrollbar-button:single-button{
|
||||
display: none;
|
||||
}
|
||||
&.active::-webkit-scrollbar {
|
||||
/* 竖轴的宽度 */
|
||||
width: 1rem;
|
||||
/* 横轴的高度 */
|
||||
height: 1rem;
|
||||
transition: all .3s;
|
||||
}
|
||||
/* 进度 */
|
||||
&.active::-webkit-scrollbar-thumb {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
/* 轨道 */
|
||||
&.active::-webkit-scrollbar-track {
|
||||
border-radius: 1rem;
|
||||
background: rgba(238, 238, 244, 0);
|
||||
}
|
||||
&.active:hover {
|
||||
// overflow-x: scroll;
|
||||
&.active::-webkit-scrollbar-thumb {
|
||||
background: #543087;
|
||||
}
|
||||
/* 轨道 */
|
||||
&.active::-webkit-scrollbar-track {
|
||||
background: rgba(84, 48, 135,.2);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.newLabel{
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
|
||||
div{
|
||||
border-radius: 50%;
|
||||
border: 1px solid #000;
|
||||
display: inline-block;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
line-height: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
i{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -110,6 +110,10 @@ export const Https = {
|
||||
libraryUpload:`/api/library/upload`, // Library文件上传
|
||||
setSketchLibrary:`/api/library/updateLibraryLevel2Type`, // Library文件上传
|
||||
|
||||
queryClassification:`/api/classification/queryClassification`,//标签类别查询
|
||||
saveOrUpdate:`/api/classification/saveOrUpdate`,//标签类别新增修改
|
||||
|
||||
|
||||
batchUpdateLibraryName:'/api/library/batchUpdateLibraryName',//Library修改用户文件名
|
||||
batchDeleteLibrary:'/api/library/batchDeleteLibrary',//删除library
|
||||
queryLibraryTopAndBottomPage:'/api/library/queryLibraryTopAndBottomPage',//Library分页列表(查询top和bottom)
|
||||
|
||||
@@ -94,6 +94,7 @@
|
||||
ref="cascader"
|
||||
v-model:value="value"
|
||||
style="width: 60%"
|
||||
:field-names="{ label: 'classificationName', value: 'classificationName', children: 'childList'}"
|
||||
multiple
|
||||
@change="setLabel1"
|
||||
max-tag-count="responsive"
|
||||
@@ -317,7 +318,7 @@
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { LoadingOutlined } from "@ant-design/icons-vue";
|
||||
import { defineComponent,h ,ref,createVNode,nextTick} from 'vue'
|
||||
import { defineComponent,h ,ref,createVNode,nextTick,provide} from 'vue'
|
||||
import HeaderComponent from "@/component/HomePage/Header.vue";
|
||||
import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
|
||||
import setLabel from '@/component/LibraryPage/setLabel.vue';
|
||||
@@ -401,7 +402,7 @@ export default defineComponent({
|
||||
name:useI18n().t('LibraryPage.model')+'1'
|
||||
})
|
||||
let {t} = useI18n()
|
||||
const options: CascaderProps['options'] = [
|
||||
const options = ref([
|
||||
{
|
||||
label: 'Light',
|
||||
value: 'light',
|
||||
@@ -433,7 +434,14 @@ export default defineComponent({
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
]);
|
||||
let type:any = {
|
||||
selectCode:selectCode,
|
||||
designType:designType
|
||||
}
|
||||
provide('options',options)
|
||||
provide('type',type)
|
||||
|
||||
const filter: ShowSearchType['filter'] = (inputValue, path) => {
|
||||
return path.some(option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
|
||||
};
|
||||
@@ -476,9 +484,8 @@ export default defineComponent({
|
||||
}
|
||||
},
|
||||
data(this_) {
|
||||
console.log(this_);
|
||||
|
||||
return {
|
||||
userInfo: {},
|
||||
indicator: h(LoadingOutlined, {
|
||||
style: {
|
||||
fontSize: "2.4rem",
|
||||
@@ -494,8 +501,11 @@ export default defineComponent({
|
||||
};
|
||||
},
|
||||
async mounted(){
|
||||
let userInfo:any = getCookie("userInfo")
|
||||
this.userInfo = JSON.parse(userInfo);
|
||||
this.uploadUrl = getUploadUrl()
|
||||
this.getLibraryList()
|
||||
this.getClass()
|
||||
this.getSex()
|
||||
this.token = getCookie("token") || "";
|
||||
|
||||
@@ -557,6 +567,7 @@ export default defineComponent({
|
||||
this.selectImgList = []
|
||||
this.selectSingleImg = {}
|
||||
this.getLibraryList()
|
||||
this.getClass()
|
||||
this.uploadGenerate = 'Upload'
|
||||
this.captionGeneration = ''
|
||||
this.selectGenerateList = []
|
||||
@@ -1038,6 +1049,29 @@ export default defineComponent({
|
||||
// setLabel.init('remove')
|
||||
// this.labelOpen = false
|
||||
// }
|
||||
|
||||
getClass(){
|
||||
let designType = this.selectCode == 'Sketchboard' || this.selectCode == 'MarketingSketch' ? this.designType : ''
|
||||
let data = {
|
||||
"classificationIdList": [],
|
||||
"classificationName": "",
|
||||
"createTime": "",
|
||||
"deleteConfirm": '',
|
||||
"id": '',
|
||||
"libraryId": '',
|
||||
"parentId": '',
|
||||
"type": this.selectCode,
|
||||
"updateTime": "",
|
||||
"userId": ''
|
||||
}
|
||||
Https.axiosPost(Https.httpUrls.queryClassification, data).then(
|
||||
(rv: any) => {
|
||||
console.log(rv);
|
||||
this.options = rv
|
||||
}
|
||||
).catch((res)=>{
|
||||
});
|
||||
},
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user