前台-技术文档-总体流程
This commit is contained in:
parent
11362c536d
commit
651c58404f
|
@ -136,7 +136,15 @@ export default {
|
|||
return this.$message.error(this.$t('task.detailError'))
|
||||
}
|
||||
this.getProcDefRouteSet(row, this.forwardDetail)
|
||||
},
|
||||
methodsThree () {
|
||||
this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
localStorage.setItem('getCategoryTree', JSON.stringify(res.data.data))
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.methodsThree()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="wrapper">
|
||||
<el-form :model="dataView">
|
||||
<el-form>
|
||||
<div v-for="(item, index) in dataView.children" :key="item">
|
||||
<!-- <div class="dataTitle">{{ item.name }}</div> -->
|
||||
<div v-for="itemson in item.children" :key="itemson.name">
|
||||
|
@ -234,8 +234,68 @@ export default {
|
|||
if (item) {
|
||||
this.dataList = item
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
videoAndImg (link) {
|
||||
if (link) {
|
||||
window.open(link)
|
||||
} else {
|
||||
this.$message({
|
||||
message: '未上传',
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
},
|
||||
insertList (val) {
|
||||
deptName () {
|
||||
console.log(this.dataForm.deptId)
|
||||
this.$http
|
||||
.get(`/sys/dept/${this.dataForm.deptId}`)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res.data.name, 'res')
|
||||
this.unit = res.data.name
|
||||
})
|
||||
},
|
||||
queryPartAppByKeyIdFunction (index, indexSon, indexSonSon) {
|
||||
if (this.dataForm.type === '组件服务') {
|
||||
this.$http
|
||||
.get(
|
||||
'/dataResourceRel/queryApp4PartByKeyId' +
|
||||
'?keyId=' +
|
||||
this.dataForm.id
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 = ''
|
||||
res.data.map((item) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 += item.name + ';'
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$http
|
||||
.get(
|
||||
'/dataResourceRel/queryPart4AppByKeyId?keyId=' +
|
||||
this.dataForm.id +
|
||||
'&type=' +
|
||||
'组件服务'
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 = ''
|
||||
res.data.map((item) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 += item.name + ';'
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
insertListFunction (val) {
|
||||
if (val) {
|
||||
if (this.dataForm.type === '应用资源') {
|
||||
this.dataView = val.filter(
|
||||
|
@ -423,69 +483,10 @@ export default {
|
|||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
videoAndImg (link) {
|
||||
if (link) {
|
||||
window.open(link)
|
||||
} else {
|
||||
this.$message({
|
||||
message: '未上传',
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
},
|
||||
deptName () {
|
||||
console.log(this.dataForm.deptId)
|
||||
this.$http
|
||||
.get(`/sys/dept/${this.dataForm.deptId}`)
|
||||
.then(({ data: res }) => {
|
||||
console.log(res.data.name, 'res')
|
||||
this.unit = res.data.name
|
||||
})
|
||||
},
|
||||
queryPartAppByKeyIdFunction (index, indexSon, indexSonSon) {
|
||||
if (this.dataForm.type === '组件服务') {
|
||||
this.$http
|
||||
.get(
|
||||
'/dataResourceRel/queryApp4PartByKeyId' +
|
||||
'?keyId=' +
|
||||
this.dataForm.id
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 = ''
|
||||
res.data.map((item) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 += item.name + ';'
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$http
|
||||
.get(
|
||||
'/dataResourceRel/queryPart4AppByKeyId?keyId=' +
|
||||
this.dataForm.id +
|
||||
'&type=' +
|
||||
'组件服务'
|
||||
)
|
||||
.then(({ data: res }) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 = ''
|
||||
res.data.map((item) => {
|
||||
this.dataView.children[index].children[indexSon].children[
|
||||
indexSonSon
|
||||
].note1 += item.name + ';'
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {},
|
||||
mounted () {
|
||||
this.deptName()
|
||||
this.insertListFunction(this.insertList)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -135,16 +135,16 @@ export default {
|
|||
this.init()
|
||||
console.log('fromList', this.$router.currentRoute.params.businessKey)
|
||||
// this.dataForm = this.$router.currentRoute.params.params.params.resourceDTO
|
||||
var callbacks = {
|
||||
startProcessSuccessCallback: this.closeCurrentTab,
|
||||
startProcessErrorCallback: this.startProcessErrorCallback,
|
||||
taskHandleSuccessCallback: this.closeCurrentTab,
|
||||
taskHandleErrorCallback: this.taskHandleErrorCallback,
|
||||
formSaveSuccessCallback: null,
|
||||
formSaveErrorCallback: null
|
||||
}
|
||||
// 初始化综合组件
|
||||
this.initProcessMultiple(callbacks)
|
||||
// var callbacks = {
|
||||
// startProcessSuccessCallback: this.closeCurrentTab,
|
||||
// startProcessErrorCallback: this.startProcessErrorCallback,
|
||||
// taskHandleSuccessCallback: this.closeCurrentTab,
|
||||
// taskHandleErrorCallback: this.taskHandleErrorCallback,
|
||||
// formSaveSuccessCallback: null,
|
||||
// formSaveErrorCallback: null
|
||||
// }
|
||||
// // 初始化综合组件
|
||||
// this.initProcessMultiple(callbacks)
|
||||
},
|
||||
mounted () {
|
||||
const businessKey = this.$router.currentRoute.params.businessKey
|
||||
|
@ -180,9 +180,10 @@ export default {
|
|||
this.input = ''
|
||||
},
|
||||
methodsThree () {
|
||||
this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
this.insertList = res.data.data
|
||||
})
|
||||
// this.$http.get('/category/getCategoryTree').then((res) => {
|
||||
// this.insertList = res.data.data
|
||||
// })
|
||||
this.insertList = JSON.parse(localStorage.getItem('getCategoryTree'))
|
||||
},
|
||||
init () {
|
||||
this.visible = true
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 571 KiB |
|
@ -0,0 +1,171 @@
|
|||
<template>
|
||||
<div class="TheOverallProcess">
|
||||
<div class="TheOverallProcess-title">
|
||||
<div class="TheOverallProcess-title-text">总体流程</div>
|
||||
<div class="TheOverallProcess-title-line"></div>
|
||||
</div>
|
||||
<div class="TheOverallProcess-content">
|
||||
<span class="neng-li-ji-shi">能力集市</span>
|
||||
<span class="neng-li-cha-yue">能力查阅</span>
|
||||
<span class="shen-he-fa-bu-xia-jia">审核发布/下架</span>
|
||||
<span class="shen-qing">申请</span>
|
||||
<span class="neng-li-shang-jia-xia-jia">能力上架/下架</span>
|
||||
<span class="shen-he">审核</span>
|
||||
<span class="xin-xv-qui-fa-bu">新需求发布</span>
|
||||
<span class="neng-li-gong-xiang-fang">能力共享方(区市委办局)</span>
|
||||
<span class="UCS-neng-li-gong-xiang-ping-tai">UCS-能力共享平台</span>
|
||||
<span class="neng-li-shi-yong-fang">能力使用方(区市委办局)</span>
|
||||
<span class="shen-he-fa-bu">审核发布</span>
|
||||
<span class="xiang-ying-ping-lun">响应评论</span>
|
||||
<span class="shen-he-ti-gong">审核提供</span>
|
||||
<span class="xv-qui-zhong-xin">需求中心</span>
|
||||
<span class="neng-li-shen-qing-liu-cheng">能力申请流程</span>
|
||||
<span class="neng-li-xv-qiu-liu-cheng">能力需求流程</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup></script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.TheOverallProcess {
|
||||
width: 100%;
|
||||
.TheOverallProcess-title {
|
||||
margin: 57px 0 24px 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.TheOverallProcess-title-text {
|
||||
font-size: 26px;
|
||||
line-height: 26px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.TheOverallProcess-title-line {
|
||||
width: 50px;
|
||||
height: 3px;
|
||||
background: #0058e1;
|
||||
}
|
||||
}
|
||||
.TheOverallProcess-content {
|
||||
height: 855px;
|
||||
background: url('~@/assets/menu/TheOverallProcess-bg.png');
|
||||
position: relative;
|
||||
& > span {
|
||||
position: absolute;
|
||||
}
|
||||
.neng-li-ji-shi {
|
||||
left: 50%;
|
||||
top: 155px;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
margin-left: -36px;
|
||||
margin-top: -9px;
|
||||
}
|
||||
.neng-li-cha-yue {
|
||||
top: 85px;
|
||||
right: 658px;
|
||||
font-size: 16px;
|
||||
color: #ffc183;
|
||||
margin-top: -8px;
|
||||
margin-right: -32px;
|
||||
}
|
||||
.shen-he-fa-bu-xia-jia {
|
||||
top: 232px;
|
||||
left: 810px;
|
||||
font-size: 16px;
|
||||
color: #c1b3ff;
|
||||
margin-top: -8px;
|
||||
}
|
||||
.shen-qing {
|
||||
right: 890px;
|
||||
top: 232px;
|
||||
font-size: 16px;
|
||||
margin-top: -8px;
|
||||
color: #ffc183;
|
||||
}
|
||||
.neng-li-shang-jia-xia-jia {
|
||||
top: 329px;
|
||||
left: 650px;
|
||||
font-size: 16px;
|
||||
color: #c1b3ff;
|
||||
margin-top: -8px;
|
||||
}
|
||||
.shen-he {
|
||||
left: 693px;
|
||||
bottom: 409px;
|
||||
font-size: 16px;
|
||||
margin-top: -8px;
|
||||
color: #ffc183;
|
||||
}
|
||||
.xin-xv-qui-fa-bu {
|
||||
right: 650px;
|
||||
bottom: 487px;
|
||||
font-size: 16px;
|
||||
margin-top: -8px;
|
||||
color: #85edff;
|
||||
}
|
||||
.neng-li-gong-xiang-fang {
|
||||
left: 350px;
|
||||
top: 442px;
|
||||
font-size: 18px;
|
||||
margin-top: -9px;
|
||||
color: #fff;
|
||||
}
|
||||
.UCS-neng-li-gong-xiang-ping-tai {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
margin-top: 15px;
|
||||
margin-left: -74px;
|
||||
}
|
||||
.neng-li-shi-yong-fang {
|
||||
top: 442px;
|
||||
right: 350px;
|
||||
font-size: 18px;
|
||||
margin-top: -9px;
|
||||
color: #fff;
|
||||
}
|
||||
.shen-he-fa-bu {
|
||||
bottom: 321px;
|
||||
right: 50%;
|
||||
font-size: 16px;
|
||||
margin-bottom: -8px;
|
||||
color: #85edff;
|
||||
margin-right: -77px;
|
||||
}
|
||||
.xiang-ying-ping-lun {
|
||||
bottom: 230px;
|
||||
left: 679px;
|
||||
font-size: 16px;
|
||||
color: #85edff;
|
||||
}
|
||||
.shen-he-ti-gong {
|
||||
left: 50%;
|
||||
bottom: 47px;
|
||||
font-size: 16px;
|
||||
margin-bottom: -8px;
|
||||
color: #ffc183;
|
||||
margin-left: -32px;
|
||||
}
|
||||
.xv-qui-zhong-xin {
|
||||
font-size: 18px;
|
||||
left: 50%;
|
||||
margin-left: -36px;
|
||||
bottom: 147px;
|
||||
color: #fff;
|
||||
margin-bottom: -9px;
|
||||
}
|
||||
.neng-li-shen-qing-liu-cheng {
|
||||
color: #fff;
|
||||
left: 125px;
|
||||
top: 64px;
|
||||
}
|
||||
.neng-li-xv-qiu-liu-cheng {
|
||||
color: #fff;
|
||||
left: 125px;
|
||||
top: 102px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,125 +1,134 @@
|
|||
<template>
|
||||
<div class="menu-box">
|
||||
<div class="content-box">
|
||||
<!-- 提供服务 -->
|
||||
<div class="img-bg service-box">
|
||||
<div class="title" style="margin-bottom: 20px">
|
||||
<div class="text text-white">提供服务</div>
|
||||
<div class="line line-white"></div>
|
||||
</div>
|
||||
<div class="list-box">
|
||||
<div class="list-item" v-for="(item, i) in seviceList" :key="i">
|
||||
<div class="item-name">{{ item.name }}</div>
|
||||
<div class="name-box">
|
||||
<div class="item-v" v-for="(v, j) in item.list" :key="j">{{ v }}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- imgList -->
|
||||
<div class="img-box" v-for="(item, i) in imgList" :key="i">
|
||||
<div class="title">
|
||||
<div class="text">{{ item.name }}</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div class="img-bg" :class="item.className" :style="{ 'background-image': `url(${item.bgImg || ''})` }">
|
||||
</div>
|
||||
<div v-if="item.btnText" class="btn">{{ item.btnText }} >></div>
|
||||
</div>
|
||||
<div class="menu-box">
|
||||
<div class="content-box">
|
||||
<!-- 提供服务 -->
|
||||
<div class="img-bg service-box">
|
||||
<div class="title" style="margin-bottom: 20px">
|
||||
<div class="text text-white">提供服务</div>
|
||||
<div class="line line-white"></div>
|
||||
</div>
|
||||
<div class="list-box">
|
||||
<div class="list-item" v-for="(item, i) in seviceList" :key="i">
|
||||
<div class="item-name">{{ item.name }}</div>
|
||||
<div class="name-box">
|
||||
<div class="item-v" v-for="(v, j) in item.list" :key="j">
|
||||
{{ v }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 总体流程 -->
|
||||
<TheOverallProcess></TheOverallProcess>
|
||||
<!-- imgList -->
|
||||
<div class="img-box" v-for="(item, i) in imgList" :key="i">
|
||||
<div class="title">
|
||||
<div class="text">{{ item.name }}</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div
|
||||
class="img-bg"
|
||||
:class="item.className"
|
||||
:style="{ 'background-image': `url(${item.bgImg || ''})` }"
|
||||
></div>
|
||||
<div v-if="item.btnText" class="btn">{{ item.btnText }} >></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import HomeHeader from '@/views/home/components/header'
|
||||
import HomeFooter from '@/views/newHome/components/Footer'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import TheOverallProcess from './TheOverallProcess.vue'
|
||||
|
||||
const seviceList = ref(
|
||||
[
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['智能算法', '图层服务', '开发组件', '业务组件'],
|
||||
},
|
||||
{
|
||||
name: '应用资源',
|
||||
list: ['办公系统', '业务系统', '门户网站', '大屏看板', '小程序', '公众号'],
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['视频资源', '云资源', '感知资源'],
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['政务信息资源'],
|
||||
},
|
||||
]
|
||||
)
|
||||
const seviceList = ref([
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['智能算法', '图层服务', '开发组件', '业务组件'],
|
||||
},
|
||||
{
|
||||
name: '应用资源',
|
||||
list: [
|
||||
'办公系统',
|
||||
'业务系统',
|
||||
'门户网站',
|
||||
'大屏看板',
|
||||
'小程序',
|
||||
'公众号',
|
||||
],
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['视频资源', '云资源', '感知资源'],
|
||||
},
|
||||
{
|
||||
name: '组件服务',
|
||||
list: ['政务信息资源'],
|
||||
},
|
||||
])
|
||||
|
||||
const imgList = ref([
|
||||
const imgList = ref([
|
||||
{
|
||||
name: '能力上架',
|
||||
bgImg: require('../../../assets/menu/shelves.png'),
|
||||
btnText: '立即上架',
|
||||
className: 'shelves-img'
|
||||
name: '能力上架',
|
||||
bgImg: require('../../../assets/menu/shelves.png'),
|
||||
btnText: '立即上架',
|
||||
className: 'shelves-img',
|
||||
},
|
||||
{
|
||||
name: '能力申请',
|
||||
bgImg: require('../../../assets/menu/apply.png'),
|
||||
btnText: '立即申请',
|
||||
className: 'apply-img'
|
||||
name: '能力申请',
|
||||
bgImg: require('../../../assets/menu/apply.png'),
|
||||
btnText: '立即申请',
|
||||
className: 'apply-img',
|
||||
},
|
||||
{
|
||||
name: '需求发布',
|
||||
bgImg: require('../../../assets/menu/demand.png'),
|
||||
btnText: '立即发布',
|
||||
className: 'demand-img'
|
||||
name: '需求发布',
|
||||
bgImg: require('../../../assets/menu/demand.png'),
|
||||
btnText: '立即发布',
|
||||
className: 'demand-img',
|
||||
},
|
||||
{
|
||||
name: '资源下架',
|
||||
bgImg: require('../../../assets/menu/down.png'),
|
||||
btnText: '立即下架',
|
||||
className: 'down-img'
|
||||
name: '资源下架',
|
||||
bgImg: require('../../../assets/menu/down.png'),
|
||||
btnText: '立即下架',
|
||||
className: 'down-img',
|
||||
},
|
||||
])
|
||||
|
||||
])
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
.menu-box {
|
||||
.menu-box {
|
||||
width: 1920px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
.title {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.text {
|
||||
padding: 20px 0;
|
||||
font-size: 26px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
font-size: 26px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 50px;
|
||||
height: 3px;
|
||||
background: #0058e1;
|
||||
margin: 0 auto
|
||||
width: 50px;
|
||||
height: 3px;
|
||||
background: #0058e1;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.line-white {
|
||||
background: #fff;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.text-white {
|
||||
color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btn {
|
||||
.btn {
|
||||
width: 150px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
|
@ -132,103 +141,101 @@ const imgList = ref([
|
|||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #e5eefc;
|
||||
background: #e5eefc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.img-box {
|
||||
.img-box {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.service-box {
|
||||
.service-box {
|
||||
width: 1920px;
|
||||
height: 613px;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('../../../assets/menu/service.png');
|
||||
|
||||
.list-box {
|
||||
width: 1560px;
|
||||
height: 350px;
|
||||
margin: 0 auto;
|
||||
width: 1560px;
|
||||
height: 350px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.img-bg {
|
||||
.img-bg {
|
||||
width: 1920px;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.process-img {
|
||||
.process-img {
|
||||
height: 855px;
|
||||
background-image: url('../../../assets/menu/process.png');
|
||||
}
|
||||
}
|
||||
|
||||
.shelves-img {
|
||||
.shelves-img {
|
||||
height: 497px;
|
||||
width: 1107px;
|
||||
margin: 0 auto;
|
||||
background-image: url('../../../assets/menu/shelves.png');
|
||||
}
|
||||
}
|
||||
|
||||
.apply-img {
|
||||
.apply-img {
|
||||
height: 752px;
|
||||
background-image: url('../../../assets/menu/apply.png');
|
||||
}
|
||||
}
|
||||
|
||||
.demand-img {
|
||||
.demand-img {
|
||||
height: 525px;
|
||||
width: 1300px;
|
||||
margin: 0 auto;
|
||||
background-image: url('../../../assets/menu/demand.png');
|
||||
}
|
||||
}
|
||||
|
||||
.down-img {
|
||||
.down-img {
|
||||
height: 544px;
|
||||
background-image: url('../../../assets/menu/down.png');
|
||||
}
|
||||
}
|
||||
|
||||
.list-box {
|
||||
.list-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.list-item {
|
||||
padding: 10px 20px;
|
||||
width: 310px;
|
||||
height: 330px;
|
||||
background: rgba(23, 85, 177, 0.43);
|
||||
border: 1px solid #74a9f8;
|
||||
border-radius: 2px;
|
||||
margin: 0 10px;
|
||||
cursor: pointer;
|
||||
padding: 10px 20px;
|
||||
width: 310px;
|
||||
height: 330px;
|
||||
background: rgba(23, 85, 177, 0.43);
|
||||
border: 1px solid #74a9f8;
|
||||
border-radius: 2px;
|
||||
margin: 0 10px;
|
||||
cursor: pointer;
|
||||
|
||||
.item-name {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding: 20px 0 10px 0;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding: 20px 0 10px 0;
|
||||
}
|
||||
.name-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.name-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.item-v {
|
||||
min-width: 100px;
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.4);
|
||||
border-radius: 6px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
margin: 0 16px 20px 16px;
|
||||
}
|
||||
.item-v {
|
||||
min-width: 100px;
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.4);
|
||||
border-radius: 6px;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
margin: 0 16px 20px 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue