更改字体
All checks were successful
git提交控制 AiDA WEB-Node.js main 分支构建部署 / build (20.19.0) (push) Has been skipped
All checks were successful
git提交控制 AiDA WEB-Node.js main 分支构建部署 / build (20.19.0) (push) Has been skipped
This commit is contained in:
@@ -3,6 +3,7 @@
|
|||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
loading: { default: false, type: Boolean },
|
loading: { default: false, type: Boolean },
|
||||||
finish: { default: false, type: Boolean },
|
finish: { default: false, type: Boolean },
|
||||||
|
empty: { default: false, type: Boolean },
|
||||||
pel: { default: () => {}, type: Function }
|
pel: { default: () => {}, type: Function }
|
||||||
})
|
})
|
||||||
const emit = defineEmits(['load'])
|
const emit = defineEmits(['load'])
|
||||||
@@ -23,12 +24,13 @@
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="my-list" ref="el">
|
<div class="my-list" ref="el" :class="{ empty: !loading && empty }">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
<div class="footer">
|
<div class="footer">
|
||||||
<p v-show="!loading" class="placeholder" ref="placeholder"></p>
|
<p v-show="!loading" class="placeholder" ref="placeholder"></p>
|
||||||
<span class="loading" v-show="loading">Loading...</span>
|
<span class="loading" v-if="loading">Loading...</span>
|
||||||
<span class="nomore" v-show="finish">No more</span>
|
<span class="empty" v-else-if="empty">Nothing Here</span>
|
||||||
|
<span class="nomore" v-else-if="finish">No more</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -40,12 +42,28 @@
|
|||||||
> .footer {
|
> .footer {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
color: #000;
|
color: #a1a1a1;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin: var(--my-list-footer-margin, 0);
|
margin: var(--my-list-footer-margin, 0);
|
||||||
> .placeholder {
|
> .placeholder {
|
||||||
height: 1px;
|
height: 1px;
|
||||||
}
|
}
|
||||||
|
> .empty {
|
||||||
|
font-size: 4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.empty {
|
||||||
|
> .footer {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
> .empty {
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -268,7 +268,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<my-list v-model:loading="loading" v-model:finish="finish" @load="onLoad">
|
<my-list
|
||||||
|
v-model:loading="loading"
|
||||||
|
v-model:finish="finish"
|
||||||
|
@load="onLoad"
|
||||||
|
:empty="list.length === 0"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="item"
|
class="item"
|
||||||
v-for="(v, i) in list"
|
v-for="(v, i) in list"
|
||||||
|
|||||||
@@ -47,7 +47,7 @@
|
|||||||
cancelButtonText: 'Cancel'
|
cancelButtonText: 'Cancel'
|
||||||
}).catch(() => 0)
|
}).catch(() => 0)
|
||||||
if (res === 0) return
|
if (res === 0) return
|
||||||
console.log(obj,i)
|
console.log(obj, i)
|
||||||
deleteCustomerPhoto(obj.visitRecordId)
|
deleteCustomerPhoto(obj.visitRecordId)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
list.splice(i, 1)
|
list.splice(i, 1)
|
||||||
@@ -68,7 +68,12 @@
|
|||||||
<div class="library">
|
<div class="library">
|
||||||
<div class="title">Library</div>
|
<div class="title">Library</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<my-list v-model:loading="loading" v-model:finish="finish" @load="onLoad">
|
<my-list
|
||||||
|
v-model:loading="loading"
|
||||||
|
v-model:finish="finish"
|
||||||
|
:empty="list.length === 0"
|
||||||
|
@load="onLoad"
|
||||||
|
>
|
||||||
<div class="item" v-for="(v, i) in list" :key="v.visitRecordId">
|
<div class="item" v-for="(v, i) in list" :key="v.visitRecordId">
|
||||||
<div class="image">
|
<div class="image">
|
||||||
<img v-lazy="v.defaultImageUrl" />
|
<img v-lazy="v.defaultImageUrl" />
|
||||||
@@ -115,18 +120,18 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
> .title {
|
> .title {
|
||||||
font-family: satoshiRegular;
|
font-family: satoshiBold;
|
||||||
font-size: 9rem;
|
font-size: 8.9rem;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
line-height: 124%;
|
line-height: 124%;
|
||||||
margin: 5rem;
|
margin: 5rem 9.1rem;
|
||||||
}
|
}
|
||||||
> .list {
|
> .list {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin: 0 3rem;
|
margin: 0 4.5rem;
|
||||||
> .my-list {
|
> .my-list {
|
||||||
padding: 0 3.8rem;
|
padding: 0 4.5rem;
|
||||||
--my-list-footer-margin: 2rem 0;
|
--my-list-footer-margin: 2rem 0;
|
||||||
> .item {
|
> .item {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
Reference in New Issue
Block a user