danak/asan-service
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix

Browse Source
This commit is contained in:
Swift
2024-02-06 21:22:21 +03:30
parent 425a52c242
commit 69a31f2e2d
4 changed files with 107 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/account/agents/announcements/index.vue
+6 -3
View File
@@ -17,9 +17,12 @@
</div> </div>
<div class="col-md-7 col-sm-12"> <div class="col-md-7 col-sm-12">
<p>برای نمایش بهتر کلیک کنید</p> <p>برای نمایش بهتر کلیک کنید</p>
<div @click="openModal('/uploads/images/announcement/' + item.image)" class="fr-image"> <div class="fr-image">
<img id="myImg" :src="'/uploads/images/announcement/'+item.image" alt=""> <el-image
:src="'https://www.asan-service.com/uploads/images/announcement/' + item.image"
:preview-src-list="['https://www.asan-service.com/uploads/images/announcement/' + item.image]"
>
</el-image>
</div> </div>
</div> </div>
</div> </div>
pages/account/announcements/index.vue
+6 -2
View File
@@ -17,8 +17,12 @@
</div> </div>
<div class="col-md-6 col-sm-12"> <div class="col-md-6 col-sm-12">
<p>برای نمایش بهتر کلیک کنید</p> <p>برای نمایش بهتر کلیک کنید</p>
<div @click="openModal('/uploads/images/announcement/' + item.image)" class="fr-image"> <div class="fr-image">
<img id="myImg" :src="'/uploads/images/announcement/' + item.image" alt=""> <el-image
:src="'https://www.asan-service.com/uploads/images/announcement/' + item.image"
:preview-src-list="['https://www.asan-service.com/uploads/images/announcement/' + item.image]"
>
</el-image>
</div> </div>
pages/announcements/index.vue
+14 -25
View File
@@ -9,35 +9,32 @@
</template> </template>
<div v-if="!item.image" class="col-12"> <div v-if="!item.image" class="col-12">
<p>{{ item.caption }}</p> <p>{{ item.caption }}</p>
</div> </div>
<div v-if="item.image" class="row"> <div v-if="item.image" class="row">
<div class="col-md-5 col-sm-12"> <div class="col-md-5 col-sm-12">
<p>{{ item.caption }}</p> <p>{{ item.caption }}</p>
</div> </div>
<div class="col-md-7 col-sm-12"> <div class="col-md-7 col-sm-12">
<p>برای نمایش بهتر کلیک کنید</p> <p>برای نمایش بهتر کلیک کنید</p>
<div class="fr-image"> <div class="fr-image">
<img id="myImg" :src="'/uploads/images/announcement/'+item.image" alt=""> <el-image
:src="'https://www.asan-service.com/uploads/images/announcement/' + item.image"
:preview-src-list="['https://www.asan-service.com/uploads/images/announcement/' + item.image]"
>
</el-image>
</div> </div>
</div> </div>
</div> </div>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div> </div>
<!-- The Modal --> <!-- The Modal -->
<div v-if="modalVisible" id="myModal" class="modal"> <div v-if="modalVisible" id="myModal" class="modal">
<!-- The Close Button --> <!-- The Close Button -->
<span @click="closeModal" class="close">&times;</span> <span @click="closeModal" class="close">&times;</span>
<!-- Modal Content (The Image) --> <!-- Modal Content (The Image) -->
<img id="img01" class="modal-content" :src="modalImageUrl"> <img id="img01" class="modal-content" :src="modalImageUrl" />
</div> </div>
<h3 v-if="!userAnnouncements.length" style="text-align: center; margin-top: 50px">هیچ اعلانی موجود نیست</h3> <h3 v-if="!userAnnouncements.length" style="text-align: center; margin-top: 50px">هیچ اعلانی موجود نیست</h3>
</user-dashboard-container> </user-dashboard-container>
@@ -56,21 +53,18 @@
} }
}, },
mounted() { mounted() {
this.$axios.get('/api/public/announcement').then((res)=>{ this.$axios.get('/api/public/announcement').then(res => {
this.userAnnouncements = res.data this.userAnnouncements = res.data
}) })
}, },
methods: { methods: {
openModal(image) { openModal(image) {
this.modalVisible = true; this.modalVisible = true
this.modalImageUrl = image; this.modalImageUrl = image
}, },
closeModal() { closeModal() {
this.modalVisible = false; this.modalVisible = false
}, }
} }
} }
</script> </script>
@@ -88,14 +82,13 @@
width: 80% !important; width: 80% !important;
} }
.fr-image { .fr-image {
height: 17rem; height: 17rem;
margin: auto; margin: auto;
img { img {
width: 100%; width: 100%;
height: 17rem; height: 17rem;
object-fit: cover; object-fit: cover;
border-radius: .5rem; border-radius: 0.5rem;
} }
} }
/* Style the Image Used to Trigger the Modal */ /* Style the Image Used to Trigger the Modal */
@@ -111,7 +104,6 @@
/* The Modal (background) */ /* The Modal (background) */
.modal { .modal {
/* Hidden by default */ /* Hidden by default */
position: fixed; position: fixed;
/* Stay in place */ /* Stay in place */
@@ -141,8 +133,6 @@
max-width: 700px; max-width: 700px;
} }
/* Add Animation - Zoom in the Modal */ /* Add Animation - Zoom in the Modal */
.modal-content { .modal-content {
animation-name: zoom; animation-name: zoom;
@@ -151,11 +141,11 @@
@keyframes zoom { @keyframes zoom {
from { from {
transform: scale(0) transform: scale(0);
} }
to { to {
transform: scale(1) transform: scale(1);
} }
} }
@@ -184,4 +174,3 @@
} }
} }
</style> </style>
pages/index.vue
+21 -1
View File
@@ -74,6 +74,16 @@
</div> </div>
</div> </div>
</div> </div>
<div class="p-3" style="background-color: white">
<div >
<el-carousel :interval="400000" type="card" height="400px">
<el-carousel-item v-for="item in 6" :key="item">
</el-carousel-item>
</el-carousel>
</div>
</div>
</div> </div>
</template> </template>
@@ -114,7 +124,6 @@ export default {
} }
}, },
methods: { methods: {
checkSerial() { checkSerial() {
// validation // validation
if (this.checkingSerial) { if (this.checkingSerial) {
@@ -168,3 +177,14 @@ export default {
} }
} }
</script> </script>
<style scoped>
.el-carousel__item:nth-child(2n) {
background-color: #99a9bf;
}
.el-carousel__item:nth-child(2n + 1) {
background-color: #d3dce6;
}
</style>