Skip to content

phsl / client

Go to a project
Commit 1bbcc2fa by 孙美琪
Options

相关样式修改

parent d61c12c3
Showing with 86 additions and 27 deletions
src/layout/user-layout.vue
......@@ -160,7 +160,8 @@ function logout () {
width: 100%;
.nav-bar-content {
width: 1280px;
//width: 1280px;
width: calc(100% - 226px);
margin: 0 auto;
height: 64px;
display: flex;
......
src/views/componentServices/list.vue
<template>
<div class="app-container">
<div style="width: 1280px;margin: 0 auto">
<div style="width: calc(100% - 190px);margin: 0 auto">
<el-row :gutter="24">
<el-col v-for="item in assemblyData" :key="item.id" :span="6">
<div class="item flex">
......@@ -19,17 +19,38 @@
</el-col>
</el-row>
</div>
<el-dialog
v-model="dialogTableVisible"
:title="dialogTitle"
width="1600"
>
<div>
<iframe v-show="iframeShow" ref="iframe" :src="iframeSrc"
:style="{ width: iframeWidth + 'px', height: iframeHeight + 'px' }"></iframe>
</div>
<!-- <template #footer>-->
<!-- <div class="dialog-footer">-->
<!-- <el-button @click="cancel">关闭</el-button>-->
<!-- </div>-->
<!-- </template>-->
</el-dialog>
</div>
</template>
<script setup name="ComponentServicesList">
import { ref } from 'vue'
import { assemblyList } from '@/api/home.js'
import {ref} from 'vue'
import {assemblyList} from '@/api/home.js'
const baseUrl = import.meta.env.VITE_APP_BASE_API
const assemblyData = ref([])
const iframeSrc = ref('')
const iframeShow = ref(false)
const dialogTableVisible = ref(false)
const iframeWidth = ref(1560)
const iframeHeight = ref(800)
const dialogTitle = ref('')
function getAassemblyList () {
function getAassemblyList() {
assemblyList().then(res => {
assemblyData.value = res.data
})
......@@ -37,8 +58,17 @@ function getAassemblyList () {
getAassemblyList()
function openPage (data) {
window.open(data.url)
function openPage(data) {
dialogTitle.value = data.title
iframeSrc.value = data.url
dialogTableVisible.value = true
iframeShow.value = true
// window.open(data.url)
}
function cancel() {
dialogTableVisible.value = false
iframeShow.value = false
}
</script>
<style scoped lang="scss">
......@@ -50,8 +80,9 @@ function openPage (data) {
.item {
height: 168px;
background: #FBFCFE;
border-radius: 3px;
//background: #FBFCFE;
background: url("@/assets/images/assemblyBg.jpg") no-repeat center center / cover;
border-radius: 15px;
border: 1px solid #D8D9DB;
padding: 24px 24px 0 24px;
margin-bottom: 24px;
......@@ -77,10 +108,23 @@ function openPage (data) {
}
img {
width: 64px;
height: 64px;
object-fit: cover;
margin-right: 24px;
width: 85px;
height: 85px;
object-fit: contain;
margin-right: 30px;
border-radius: 15px;
}
}
.iframe-container {
position: absolute;
top: 10%;
left: 6%;
}
.iframe-container iframe {
position: absolute;
top: 0;
left: 0;
}
</style>
src/views/computingResource/resourceList.vue
......@@ -406,8 +406,8 @@ function submit () {
width: 360px;
height: 144px;
background: linear-gradient(180deg, #DEEBFF 0%, rgba(222, 235, 255, 0) 100%), #FFFFFF;
box-shadow: 0px 9px 28px 8px rgba(46, 119, 227, 0.02), 0px 6px 16px 0px rgba(46, 119, 227, 0.04), 0px 3px 6px -4px rgba(46, 119, 227, 0.06);
border-radius: 0px 0px 0px 0px;
box-shadow: 0 9px 28px 8px rgba(46, 119, 227, 0.02), 0 6px 16px 0 rgba(46, 119, 227, 0.04), 0 3px 6px -4px rgba(46, 119, 227, 0.06);
border-radius: 15px;
border: 2px solid #FFFFFF;
&:nth-child(2) {
......@@ -504,8 +504,9 @@ function submit () {
.product-card {
margin-bottom: 24px;
border: 1px solid rgba(0, 0, 0, 0.08);
box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, 0.08);
border-radius: 0px 0px 0px 0px;
//box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.08);
box-shadow: 0 5px 10px 2px rgba(0, 0, 0, 0.08);
border-radius: 15px;
&:hover {
border: 1px solid #2E77E3;
......@@ -514,6 +515,7 @@ function submit () {
.top-info {
padding: 18px 20px 12px 20px;
border-radius: 15px 15px 0 0;
background: linear-gradient(153deg, rgba(255, 175, 175, 0) 0%, #FDE7E7 100%), linear-gradient(145deg, #EDFCFF 0%, rgba(97, 227, 255, 0) 100%), #F0F6FF;
.title {
......
src/views/index.vue
......@@ -156,15 +156,15 @@
</template>
<script setup name="Index">
import { banner, assemblyList, informationList } from '@/api/home.js'
import { ref } from 'vue'
import {banner, assemblyList, informationList} from '@/api/home.js'
import {ref} from 'vue'
const baseUrl = import.meta.env.VITE_APP_BASE_API
const assemblyData = ref([])
const bannerImgList = ref([])
function getBanner () {
function getBanner() {
banner().then(res => {
bannerImgList.value = res.data
})
......@@ -172,7 +172,7 @@ function getBanner () {
getBanner()
function getAassemblyList () {
function getAassemblyList() {
assemblyList().then(res => {
assemblyData.value = res.data.length > 3 ? res.data.slice(0, 3) : res.data
})
......@@ -183,7 +183,7 @@ getAassemblyList()
const informationData = ref([])
const informationMainData = ref({})
function getInformation () {
function getInformation() {
informationList().then(res => {
res.data.forEach(item => {
item.year = new Date(item.createTime).getFullYear()
......@@ -201,7 +201,7 @@ function getInformation () {
getInformation()
function openAssembly (data) {
function openAssembly(data) {
window.open(data.url)
}
</script>
......@@ -227,7 +227,8 @@ function openAssembly (data) {
}
.block {
width: 1280px;
//width: 1280px;
width: calc(100% - 214px);
margin: 0 auto;
}
......@@ -263,6 +264,7 @@ function openAssembly (data) {
border: 1px solid #C8CBCC;
border-radius: 2px;
height: 40px;
color: #303233;
}
.resource-item {
......@@ -391,8 +393,18 @@ function openAssembly (data) {
}
}
//.information-right {
// //flex: 1;
// padding-right: 210px;
//}
//.information {
// width: 100%;
// padding: 0 214px;
//}
.information-item {
width: 470px;
width: 570px;
&:hover {
cursor: pointer;
......@@ -418,8 +430,8 @@ function openAssembly (data) {
img {
margin-top: 25px;
width: 469px;
height: 286px;
width: 569px;
}
.date {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment