应用详情开发
This commit is contained in:
a0049873
parent
1275b4b992
commit
cfded4f558
|
|
@ -214,7 +214,9 @@ export const constantRoutes = [
|
|||
path: '/PictureCharacterRecognition',
|
||||
name: 'PictureCharacterRecognition',
|
||||
component: () =>
|
||||
import('@/views/detailsAll/components/PictureCharacterRecognition'),
|
||||
import(
|
||||
'@/views/detailsAll/components/Algorithm/PictureCharacterRecognition'
|
||||
),
|
||||
meta: {
|
||||
title: '图片文字识别',
|
||||
icon: 'error-warning-line',
|
||||
|
|
@ -223,7 +225,8 @@ export const constantRoutes = [
|
|||
{
|
||||
path: '/TestOfWords',
|
||||
name: 'TestOfWords',
|
||||
component: () => import('@/views/detailsAll/components/TestOfWords'),
|
||||
component: () =>
|
||||
import('@/views/detailsAll/components/Algorithm/TestOfWords'),
|
||||
meta: {
|
||||
title: '文字检验',
|
||||
icon: 'error-warning-line',
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 11:32:22
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-13 12:01:31
|
||||
* @LastEditTime: 2022-06-14 10:39:37
|
||||
* @Description: 算法详情页
|
||||
-->
|
||||
<template>
|
||||
|
|
@ -69,16 +69,16 @@
|
|||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import AlgorithmTopDetails from '@/views/detailsAll/components/AlgorithmTopDetails.vue'
|
||||
import AlgorithmNavigation from '@/views/detailsAll/components/AlgorithmNavigation.vue'
|
||||
import AlgorithmDisplay from '@/views/detailsAll/components/AlgorithmDisplay.vue'
|
||||
import AlgorithmAdvantage from '@/views/detailsAll/components/AlgorithmAdvantage.vue'
|
||||
import AlgorithmOnTrial from '@/views/detailsAll/components/AlgorithmOnTrial.vue'
|
||||
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/AlgorithmApplicationScenarios'
|
||||
import AlgorithmApplicationCase from '@/views/detailsAll/components/AlgorithmApplicationCase'
|
||||
import AlgorithmUsageMode from '@/views/detailsAll/components/AlgorithmUsageMode' //使用方式
|
||||
import AlgorithmChargingStandard from '@/views/detailsAll/components/AlgorithmChargingStandard' //计费标准
|
||||
import AlgorithmCommonProblem from '@/views/detailsAll/components/AlgorithmCommonProblem' //常见问题
|
||||
import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue'
|
||||
import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue'
|
||||
import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue'
|
||||
import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue'
|
||||
import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue'
|
||||
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios'
|
||||
import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase'
|
||||
import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式
|
||||
import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准
|
||||
import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题
|
||||
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { updateVisits, selectOne } from '@/api/home'
|
||||
|
|
|
|||
|
|
@ -2,25 +2,27 @@
|
|||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 11:32:22
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-13 12:01:31
|
||||
* @Description: 算法详情页
|
||||
* @LastEditTime: 2022-06-14 10:41:48
|
||||
* @Description: 应用详情页
|
||||
-->
|
||||
<template>
|
||||
<div class="algorithm-details" :class="{ fixed2: scrollTop >= 600 }">
|
||||
<div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
|
||||
<!-- 头部基本信息 -->
|
||||
<algorithm-top-details :dataList="dataList.data"></algorithm-top-details>
|
||||
<application-top-details
|
||||
:dataList="dataList.data"
|
||||
></application-top-details>
|
||||
<!-- 导航 -->
|
||||
<algorithm-navigation
|
||||
<application-navigation
|
||||
:dataList="dataList.data"
|
||||
:class="{ fixed: scrollTop >= 600 }"
|
||||
:selectNow="selectNow"
|
||||
></algorithm-navigation>
|
||||
<!-- 算法展示 视频 -->
|
||||
<algorithm-display
|
||||
></application-navigation>
|
||||
<!-- 应用展示 视频 -->
|
||||
<application-presentation
|
||||
:dataList="dataList.data"
|
||||
id="algorithm-display"
|
||||
id="application-presentation"
|
||||
class="scrollBox"
|
||||
></algorithm-display>
|
||||
></application-presentation>
|
||||
<!-- 算法优势 -->
|
||||
<algorithm-advantage
|
||||
:dataList="dataList.data"
|
||||
|
|
@ -69,16 +71,16 @@
|
|||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import AlgorithmTopDetails from '@/views/detailsAll/components/AlgorithmTopDetails.vue'
|
||||
import AlgorithmNavigation from '@/views/detailsAll/components/AlgorithmNavigation.vue'
|
||||
import AlgorithmDisplay from '@/views/detailsAll/components/AlgorithmDisplay.vue'
|
||||
import AlgorithmAdvantage from '@/views/detailsAll/components/AlgorithmAdvantage.vue'
|
||||
import AlgorithmOnTrial from '@/views/detailsAll/components/AlgorithmOnTrial.vue'
|
||||
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/AlgorithmApplicationScenarios'
|
||||
import AlgorithmApplicationCase from '@/views/detailsAll/components/AlgorithmApplicationCase'
|
||||
import AlgorithmUsageMode from '@/views/detailsAll/components/AlgorithmUsageMode' //使用方式
|
||||
import AlgorithmChargingStandard from '@/views/detailsAll/components/AlgorithmChargingStandard' //计费标准
|
||||
import AlgorithmCommonProblem from '@/views/detailsAll/components/AlgorithmCommonProblem' //常见问题
|
||||
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
|
||||
import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue'
|
||||
import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue'
|
||||
import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue'
|
||||
import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue'
|
||||
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios'
|
||||
import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase'
|
||||
import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式
|
||||
import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准
|
||||
import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题
|
||||
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { updateVisits, selectOne } from '@/api/home'
|
||||
|
|
|
|||
|
|
@ -0,0 +1,167 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 14:54:01
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-14 10:30:32
|
||||
* @Description: 应用详情页导航
|
||||
-->
|
||||
<template>
|
||||
<div class="application-navigation" v-if="navList.length > 0">
|
||||
<template v-for="nav in navList" :key="nav.key">
|
||||
<div
|
||||
class="nav"
|
||||
:class="{ select: nav.key == select }"
|
||||
v-if="nav.show"
|
||||
@click="selectNav(nav.key)"
|
||||
>
|
||||
{{ nav.name }}
|
||||
<span class="line"></span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, defineProps, watch } from 'vue'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
const navList = ref([
|
||||
{
|
||||
name: '应用展示',
|
||||
key: 'application-presentation',
|
||||
},
|
||||
{
|
||||
name: '功能介绍',
|
||||
key: 'function-introduction',
|
||||
},
|
||||
{
|
||||
name: '使用能力',
|
||||
key: 'ability-to-use',
|
||||
},
|
||||
{
|
||||
name: '部署与安全',
|
||||
key: 'deployment-and-security',
|
||||
},
|
||||
{
|
||||
name: '归属部门与服务商',
|
||||
key: 'department-and-service-provider',
|
||||
},
|
||||
{
|
||||
name: '常见问题',
|
||||
key: 'common-problem',
|
||||
},
|
||||
])
|
||||
const props = defineProps({
|
||||
selectNow: { type: String, default: '' },
|
||||
dataList: { type: Object, default: null },
|
||||
})
|
||||
const select = ref('algorithm-display')
|
||||
const list = ref([])
|
||||
const selectNav = (key) => {
|
||||
select.value = key
|
||||
mybus.emit('flyToView', select.value)
|
||||
}
|
||||
if (props.dataList.infoList) {
|
||||
list.value = []
|
||||
props.dataList.infoList.map((item) => {
|
||||
if (
|
||||
item.attrType === '算法优势' ||
|
||||
item.attrType === '应用场景' ||
|
||||
item.attrType === '应用案例' ||
|
||||
item.attrType === '常见问题'
|
||||
) {
|
||||
list.value.push(item.attrType)
|
||||
} else if (item.attrType === '算法介绍视频') {
|
||||
list.value.push('算法展示')
|
||||
} else if (item.attrType === '试用地址') {
|
||||
list.value.push('算法试用')
|
||||
} else if (item.attrType === '计费标准信息') {
|
||||
list.value.push('计费标准')
|
||||
} else if (item.attrType === '技术文档') {
|
||||
list.value.push('使用方式')
|
||||
}
|
||||
})
|
||||
navList.value.forEach((item) => {
|
||||
console.log(item)
|
||||
if (list.value.indexOf(item.name) > -1) {
|
||||
item.show = true
|
||||
}
|
||||
})
|
||||
select.value = navList.value.filter(
|
||||
(item) => item.name === list.value[0]
|
||||
)[0].key
|
||||
console.log('11111111111111111111111111', list.value, navList.value)
|
||||
}
|
||||
watch(
|
||||
() => props.selectNow,
|
||||
(newValue) => {
|
||||
select.value = newValue
|
||||
}
|
||||
)
|
||||
watch(
|
||||
() => props.dataList,
|
||||
(val) => {
|
||||
if (val) {
|
||||
list.value = []
|
||||
val.infoList.map((item) => {
|
||||
if (
|
||||
item.attrType === '算法优势' ||
|
||||
item.attrType === '应用场景' ||
|
||||
item.attrType === '应用案例' ||
|
||||
item.attrType === '常见问题'
|
||||
) {
|
||||
list.value.push(item.attrType)
|
||||
} else if (item.attrType === '应用展示视频') {
|
||||
list.value.push('应用展示')
|
||||
} else if (item.attrType === '试用地址') {
|
||||
list.value.push('算法试用')
|
||||
} else if (item.attrType === '计费标准信息') {
|
||||
list.value.push('计费标准')
|
||||
} else if (item.attrType === '技术文档') {
|
||||
list.value.push('使用方式')
|
||||
}
|
||||
})
|
||||
navList.value.forEach((item) => {
|
||||
console.log(item)
|
||||
if (list.value.indexOf(item.name) > -1) {
|
||||
item.show = true
|
||||
}
|
||||
})
|
||||
select.value = navList.value.filter(
|
||||
(item) => item.name === list.value[0]
|
||||
)[0].key
|
||||
console.log('11111111111111111111111111', list.value, navList.value)
|
||||
}
|
||||
}
|
||||
)
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.application-navigation {
|
||||
width: 1912px;
|
||||
height: 84px;
|
||||
line-height: 80px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
font-size: 24px;
|
||||
color: #666;
|
||||
background: #fff;
|
||||
padding: 0 300px;
|
||||
box-shadow: 0px 5px 10px #f2f3fb;
|
||||
position: relative;
|
||||
.nav {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.line {
|
||||
width: 40px;
|
||||
height: 4px;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
color: #526aff;
|
||||
.line {
|
||||
background: #526aff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 15:25:33
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-14 10:33:51
|
||||
* @Description: 应用展示 视频播放
|
||||
-->
|
||||
<template>
|
||||
<div class="application-presentation" v-if="flag">
|
||||
<detals-title title="应用展示" type="IMAGE&VIDEO"></detals-title>
|
||||
<div class="main">
|
||||
<div class="play" @click="showModal"></div>
|
||||
</div>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
title="视频预览"
|
||||
:width="750"
|
||||
destroyOnClose
|
||||
>
|
||||
<template #footer></template>
|
||||
<div style="width: 100%; display: flex; justify-content: center">
|
||||
<div style="width: 100%; height: 100%">
|
||||
<vue3VideoPlay v-bind="options" />
|
||||
</div>
|
||||
</div>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, defineProps, watch } from 'vue'
|
||||
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle.vue'
|
||||
const visible = ref(false)
|
||||
const options = reactive({
|
||||
width: '700px', //播放器宽度
|
||||
height: '400px', //播放器高度
|
||||
color: '#409eff', //主题色
|
||||
title: '', //视频名称
|
||||
src: '', //视频源
|
||||
muted: false, //静音
|
||||
webFullScreen: false,
|
||||
speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
|
||||
autoPlay: true, //自动播放
|
||||
loop: false, //循环播放
|
||||
mirror: false, //镜像画面
|
||||
ligthOff: false, //关灯模式
|
||||
volume: 0.3, //默认音量大小
|
||||
control: true, //是否显示控制
|
||||
controlBtns: [
|
||||
'audioTrack',
|
||||
'quality',
|
||||
'speedRate',
|
||||
'volume',
|
||||
'setting',
|
||||
'pip',
|
||||
'pageFullScreen',
|
||||
'fullScreen',
|
||||
], //显示所有按钮,
|
||||
})
|
||||
const showModal = () => {
|
||||
visible.value = true
|
||||
}
|
||||
const props = defineProps({
|
||||
dataList: { type: Object, default: null },
|
||||
})
|
||||
const flag = ref(true)
|
||||
console.log('111111111111111111111,', props.dataList)
|
||||
if (props.dataList.infoList) {
|
||||
let obj = props.dataList.infoList.filter(
|
||||
(item) => item.attrType === '应用展示视频'
|
||||
)[0]
|
||||
console.log('视频==============>', obj)
|
||||
if (!obj) {
|
||||
flag.value = false
|
||||
} else {
|
||||
options.src = obj.attrValue
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.dataList,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let obj = val.infoList.filter(
|
||||
(item) => item.attrType === '算法介绍视频'
|
||||
)[0]
|
||||
console.log('视频==============>', obj)
|
||||
if (!obj) {
|
||||
flag.value = false
|
||||
} else {
|
||||
options.src = obj.attrValue
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.application-presentation {
|
||||
padding: 80px 300px 0;
|
||||
.main {
|
||||
height: 340px;
|
||||
border-radius: 10px;
|
||||
background: url('~@/assets/detailsAll/sf_video_bg.png') no-repeat;
|
||||
background-size: 100%;
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.play {
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
background: url('~@/assets/detailsAll/sf_video_play.png') no-repeat;
|
||||
background-size: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,184 @@
|
|||
<!--
|
||||
* @Author: hisense.liangjunhua
|
||||
* @Date: 2022-06-08 11:56:28
|
||||
* @LastEditors: hisense.liangjunhua
|
||||
* @LastEditTime: 2022-06-13 15:29:27
|
||||
* @Description: 算法详情页头部
|
||||
-->
|
||||
<template>
|
||||
<div class="algorithm-top-details">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<span class="name">{{ props.dataList.name }}</span>
|
||||
<span class="label">{{ props.dataList.type }}</span>
|
||||
<span class="label">{{ props.dataList.shareType }}</span>
|
||||
<span class="label">{{ props.dataList.shareCondition }}</span>
|
||||
<!-- <span class="label">免费</span> -->
|
||||
</div>
|
||||
<div class="main">
|
||||
<div>应用领域：{{ applicationArea }}</div>
|
||||
<div>
|
||||
{{ props.dataList.description }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom" v-if="props.dataList.id">
|
||||
<a-button type="primary" @click="toView()">
|
||||
<template #icon><form-outlined /></template>
|
||||
申请使用
|
||||
</a-button>
|
||||
<a-button type="primary" @click="addShoppingCart()">
|
||||
<template #icon><shopping-cart-outlined /></template>
|
||||
加入购物车
|
||||
</a-button>
|
||||
<a-button type="primary" @click="goTOCollection()">收藏</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right"></div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { FormOutlined, ShoppingCartOutlined } from '@ant-design/icons-vue'
|
||||
import { defineProps, ref, watch } from 'vue'
|
||||
import { scInsert } from '@/api/personalCenter'
|
||||
import { sgcInsert } from '@/api/home'
|
||||
import { useRouter } from 'vue-router'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { message } from 'ant-design-vue'
|
||||
const props = defineProps({
|
||||
dataList: { type: Object, default: null },
|
||||
})
|
||||
const router = useRouter()
|
||||
const applicationArea = ref('')
|
||||
// 加入申购车
|
||||
const addShoppingCart = () => {
|
||||
console.log('加入申购车==================>', props.dataList)
|
||||
sgcInsert({
|
||||
delFlag: '0',
|
||||
resourceId: props.dataList.id,
|
||||
// userId: userId.value,
|
||||
}).then((res) => {
|
||||
console.log(res)
|
||||
message.success('添加申购车成功！')
|
||||
mybus.emit('getSgcNum')
|
||||
})
|
||||
}
|
||||
// 立即申请
|
||||
function toView() {
|
||||
// window.open(newpage.href, '_blank')
|
||||
router.push({
|
||||
path: '/apply',
|
||||
query: {
|
||||
name: props.dataList.name,
|
||||
resourceId: [props.dataList.id],
|
||||
},
|
||||
})
|
||||
}
|
||||
// 收藏
|
||||
const goTOCollection = () => {
|
||||
console.log('收藏===================》', props.dataList)
|
||||
scInsert([{ resourceId: props.dataList.id }]).then((res) => {
|
||||
console.log(res)
|
||||
message.success('收藏成功')
|
||||
})
|
||||
}
|
||||
if (props.dataList.infoList) {
|
||||
applicationArea.value = props.dataList.infoList.filter(
|
||||
(val) => val.attrType === '应用领域'
|
||||
)[0].attrValue
|
||||
}
|
||||
watch(
|
||||
() => props.dataList,
|
||||
(val) => {
|
||||
if (val) {
|
||||
applicationArea.value = props.dataList.infoList.filter(
|
||||
(val) => val.attrType === '应用领域'
|
||||
)[0].attrValue
|
||||
}
|
||||
}
|
||||
)
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.algorithm-top-details {
|
||||
height: 600px;
|
||||
padding: 180px 0 0;
|
||||
background: url('~@/assets/detailsAll/sf_top_bg.png') no-repeat;
|
||||
background-size: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.left {
|
||||
width: 700px;
|
||||
color: #fff;
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span {
|
||||
font-size: 14px;
|
||||
}
|
||||
.name {
|
||||
max-width: 330px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 40px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.label {
|
||||
padding: 1px 10px;
|
||||
margin-right: 10px;
|
||||
border-radius: 13px;
|
||||
background: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
}
|
||||
.main {
|
||||
margin-top: 20px;
|
||||
font-size: 18px;
|
||||
line-height: 34px;
|
||||
& > div:nth-of-type(1) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
& > div:nth-of-type(2) {
|
||||
max-height: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
.ant-btn {
|
||||
height: 50px;
|
||||
margin-right: 20px;
|
||||
background: #ff8b55;
|
||||
border-radius: 6px;
|
||||
font-size: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.ant-btn:nth-of-type(1) {
|
||||
width: 180px;
|
||||
}
|
||||
.ant-btn:nth-of-type(2) {
|
||||
width: 220px;
|
||||
}
|
||||
.ant-btn:nth-of-type(3) {
|
||||
width: 145px;
|
||||
background: #fff;
|
||||
color: #526aff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 580px;
|
||||
height: 400px;
|
||||
background: url('~@/assets/detailsAll/sf_right_bg.png') no-repeat;
|
||||
background-size: 100%;
|
||||
margin-top: -40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue