|
@@ -1,19 +1,587 @@
|
|
<template>
|
|
<template>
|
|
<custom-layout class="main">
|
|
<custom-layout class="main">
|
|
- <el-col :span="24" class="one">首页 </el-col>
|
|
|
|
|
|
+ <el-col :span="24" class="one">
|
|
|
|
+ <div class="w_1300">
|
|
|
|
+ <el-col :span="24" class="one_1">
|
|
|
|
+ <div class="search">
|
|
|
|
+ <el-input
|
|
|
|
+ v-model="input1"
|
|
|
|
+ size="large"
|
|
|
|
+ placeholder="请输入关键字"
|
|
|
|
+ :suffix-icon="Search"
|
|
|
|
+ >
|
|
|
|
+ <template #append>
|
|
|
|
+ <el-button type="primary" size="large">搜索</el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-input>
|
|
|
|
+ </div>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="24" class="one_2">
|
|
|
|
+ <div class="one_2_1">
|
|
|
|
+ <div class="Seacher">
|
|
|
|
+ <div class="OneLeft">
|
|
|
|
+ <span>行业</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-if="!twoShow" class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in plateList.slice(0, 6)"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in plateList"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ <div class="button">
|
|
|
|
+ <span v-if="!twoShow" @click="twoShow = true">
|
|
|
|
+ <el-icon><ArrowDown /></el-icon>
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else @click="twoShow = false">
|
|
|
|
+ <el-icon><ArrowUp /></el-icon>
|
|
|
|
+ </span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="Seacher">
|
|
|
|
+ <div class="OneLeft">
|
|
|
|
+ <span>技术领域</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in typeList"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="Seacher">
|
|
|
|
+ <div class="OneLeft">
|
|
|
|
+ <span>所在地</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-if="!oneShow" class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in cityList.slice(0, 12)"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in cityList"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ <div class="button">
|
|
|
|
+ <span v-if="!oneShow" @click="oneShow = true">
|
|
|
|
+ <el-icon><ArrowDown /></el-icon>
|
|
|
|
+ </span>
|
|
|
|
+ <span v-else @click="oneShow = false">
|
|
|
|
+ <el-icon><ArrowUp /></el-icon>
|
|
|
|
+ </span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="Seacher">
|
|
|
|
+ <div class="OneLeft">
|
|
|
|
+ <span>项目成熟度</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="OneRight">
|
|
|
|
+ <el-checkbox
|
|
|
|
+ class="label"
|
|
|
|
+ v-for="(item, index) in maturityList"
|
|
|
|
+ :key="index"
|
|
|
|
+ v-model="checked1"
|
|
|
|
+ :label="item.label"
|
|
|
|
+ size="large"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="one_2_2">
|
|
|
|
+ <div
|
|
|
|
+ class="list"
|
|
|
|
+ :class="['list' + index]"
|
|
|
|
+ v-for="(item, index) in list"
|
|
|
|
+ :key="index"
|
|
|
|
+ @click="toView(item)"
|
|
|
|
+ >
|
|
|
|
+ <div class="type textOne">{{ item.type || '暂无' }}</div>
|
|
|
|
+ <div class="title">
|
|
|
|
+ <p class="ellipsis-3">{{ item.name || '暂无' }}</p>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="address textOne">
|
|
|
|
+ <el-icon color="#595959"><Location /></el-icon>
|
|
|
|
+ <span>{{ item.area || '暂无' }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="biaoqian textOne">
|
|
|
|
+ <span v-if="item.technology">{{ item.technology }}</span>
|
|
|
|
+ <span v-if="item.sell">{{ item.sell }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <span class="state" :class="['state' + item.status]"></span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="one_2_3">
|
|
|
|
+ <el-pagination background layout="prev, pager, next" :total="1000" />
|
|
|
|
+ </div>
|
|
|
|
+ </el-col>
|
|
|
|
+ </div>
|
|
|
|
+ </el-col>
|
|
</custom-layout>
|
|
</custom-layout>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import { UserStore } from '@/store/user'
|
|
|
|
-const userStore = UserStore()
|
|
|
|
-const user = computed(() => userStore.user)
|
|
|
|
-// 加载中
|
|
|
|
-const loading = ref(false)
|
|
|
|
|
|
+import bg_1 from '/images/project/dbhi-kcxm-item1.png'
|
|
|
|
+import bg_2 from '/images/project/dbhi-kcxm-item2.png'
|
|
|
|
+import bg_3 from '/images/project/dbhi-kcxm-item3.png'
|
|
|
|
+import bg_4 from '/images/project/dbhi-kcxm-item4.png'
|
|
|
|
+import bg_5 from '/images/project/dbhi-kcxm-item6.png'
|
|
|
|
+import bg_6 from '/images/project/dbhi-kcxm-item8.png'
|
|
|
|
+import bg_7 from '/images/project/dbhi-kcxm-item9.png'
|
|
|
|
+import bg_8 from '/images/project/dbhi-kcxm-item10.png'
|
|
|
|
+import bg_9 from '/images/project/dbhi-kcxm-item7.png'
|
|
|
|
+import bg_10 from '/images/project/dbhi-kcxm-item7.png'
|
|
|
|
+import map from '/images/project/dbhi-kcxm-item7.png'
|
|
|
|
+import { getCity } from '@/utils/city'
|
|
|
|
+const $checkRes = inject('$checkRes')
|
|
|
|
+// 接口
|
|
|
|
+import { ProjectStore } from '@/store/api/platform/project'
|
|
|
|
+import { DictDataStore } from '@/store/api/system/dictData'
|
|
|
|
+const store = ProjectStore()
|
|
|
|
+const dictDataStore = DictDataStore()
|
|
// 路由
|
|
// 路由
|
|
const router = useRouter()
|
|
const router = useRouter()
|
|
|
|
+// 是否展开
|
|
|
|
+const twoShow = ref(false)
|
|
|
|
+const oneShow = ref(false)
|
|
|
|
+// 加载中
|
|
|
|
+const loading = ref(false)
|
|
|
|
+const cityList = ref([])
|
|
|
|
+const typeList = ref([
|
|
|
|
+ { label: '不限', value: '-1' },
|
|
|
|
+ { label: '教育休闲', value: '0' },
|
|
|
|
+ { label: '包装印刷', value: '1' },
|
|
|
|
+ { label: '电气自动化', value: '2' },
|
|
|
|
+ { label: '采矿冶金', value: '3' },
|
|
|
|
+ { label: '航空航天', value: '4' },
|
|
|
|
+ { label: '海洋开发', value: '5' },
|
|
|
|
+ { label: '衣林牧业', value: '6' },
|
|
|
|
+ { label: '医药与医疗', value: '7' },
|
|
|
|
+ { label: '电子信息', value: '8' }
|
|
|
|
+])
|
|
|
|
+const plateList = ref([
|
|
|
|
+ { label: '不限', value: '-1' },
|
|
|
|
+ { label: '汽车电子及新型汽车零部件', value: '0' },
|
|
|
|
+ { label: '精细化工及天然气化工', value: '1' },
|
|
|
|
+ { label: '农产品加工及绿色食品', value: '2' },
|
|
|
|
+ { label: '生物基新材料', value: '6' },
|
|
|
|
+ { label: '光电子及智能传感器', value: '3' },
|
|
|
|
+ { label: '车规级芯片及功率半导体器件', value: '4' },
|
|
|
|
+ { label: '新能源及动力电池', value: '5' },
|
|
|
|
+ { label: '人工智能及智能机器人', value: '7' },
|
|
|
|
+ { label: '碳纤维及复合材料', value: '8' },
|
|
|
|
+ { label: '遥感卫星及航天航空技术', value: '9' },
|
|
|
|
+ { label: '精密仪器及先进装备', value: '10' },
|
|
|
|
+ { label: '生物医药及先进医疗器械', value: '11' }
|
|
|
|
+])
|
|
|
|
+// 字典表
|
|
|
|
+const projectList = ref([])
|
|
|
|
+const maturityList = ref([])
|
|
|
|
+const industryList = ref([])
|
|
|
|
+// 字典表
|
|
|
|
+const fieldList = ref([])
|
|
|
|
+// 列表
|
|
|
|
+const list = ref([
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '1',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '3',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ name: '农特产供应链平台',
|
|
|
|
+ technology: '衣林牧业',
|
|
|
|
+ type: '农产品加工及绿色食品',
|
|
|
|
+ area: '吉林 长春市',
|
|
|
|
+ status: '2',
|
|
|
|
+ sell: '中试'
|
|
|
|
+ }
|
|
|
|
+])
|
|
|
|
+let skip = 0
|
|
|
|
+let limit = inject('limit')
|
|
|
|
+const total = ref(0)
|
|
|
|
+const file = ref([bg_1, bg_2, bg_3, bg_4, bg_5, bg_6, bg_7, bg_8, bg_9, bg_10, bg_1, bg_2])
|
|
|
|
+// 请求
|
|
|
|
+onMounted(async () => {
|
|
|
|
+ loading.value = true
|
|
|
|
+ await searchOther()
|
|
|
|
+ await search({ skip, limit })
|
|
|
|
+ loading.value = false
|
|
|
|
+})
|
|
|
|
+const searchOther = async () => {
|
|
|
|
+ let result
|
|
|
|
+ // 合作类型
|
|
|
|
+ result = await dictDataStore.query({ code: 'projectType', is_use: '0' })
|
|
|
|
+ if ($checkRes(result)) projectList.value = result.data
|
|
|
|
+ // 成熟度
|
|
|
|
+ result = await dictDataStore.query({ code: 'projectMaturity', is_use: '0' })
|
|
|
|
+ if ($checkRes(result)) maturityList.value = result.data
|
|
|
|
+ // 行业分类
|
|
|
|
+ result = await dictDataStore.query({ code: 'industry', is_use: '0' })
|
|
|
|
+ if ($checkRes(result)) industryList.value = result.data
|
|
|
|
+ // 技术领域
|
|
|
|
+ result = await dictDataStore.query({ code: 'field', is_use: '0' })
|
|
|
|
+ if ($checkRes(result)) fieldList.value = result.data
|
|
|
|
+ // 城市
|
|
|
|
+ getCity().then(
|
|
|
|
+ (response) => (cityList.value = [{ label: '不限', value: '-1' }, ...response.address])
|
|
|
|
+ )
|
|
|
|
+ maturityList.value.unshift({ value: '-1', label: '不限' })
|
|
|
|
+}
|
|
|
|
+const search = async (query = { skip: 0, limit }) => {
|
|
|
|
+ const info = {
|
|
|
|
+ skip: query.skip,
|
|
|
|
+ limit: query.limit,
|
|
|
|
+ status: '1',
|
|
|
|
+ is_use: '0'
|
|
|
|
+ }
|
|
|
|
+ const res = await store.query(info)
|
|
|
|
+ if (res.errcode == '0') {
|
|
|
|
+ // list.value = res.data
|
|
|
|
+ // total.value = res.total
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+// 查看
|
|
|
|
+const toView = (item) => {
|
|
|
|
+ router.push({ path: `/project/detail`, query: { id: item.id || item._id } })
|
|
|
|
+}
|
|
|
|
+const currentPage = ref(1)
|
|
|
|
+// 分页
|
|
|
|
+const changePage = (page = currentPage.value) => {
|
|
|
|
+ search({ skip: (page - 1) * limit, limit: limit })
|
|
|
|
+}
|
|
|
|
+const sizeChange = (limits) => {
|
|
|
|
+ limit = limits
|
|
|
|
+ currentPage.value = 1
|
|
|
|
+ search({ skip: 0, limit: limit })
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
.main {
|
|
.main {
|
|
|
|
+ .one {
|
|
|
|
+ background: url(/images/bg-tec-list.jpg) no-repeat;
|
|
|
|
+ .one_1 {
|
|
|
|
+ padding: 85px 0 0;
|
|
|
|
+ .search {
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ width: 810px;
|
|
|
|
+ :deep(.el-input--large .el-input__inner) {
|
|
|
|
+ height: 60px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .one_2 {
|
|
|
|
+ margin-top: 100px;
|
|
|
|
+ padding: 30px;
|
|
|
|
+ background-color: $global-color-fff;
|
|
|
|
+ .one_2_1 {
|
|
|
|
+ .Seacher {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: stretch;
|
|
|
|
+ position: relative;
|
|
|
|
+ margin-bottom: 15px;
|
|
|
|
+ .OneLeft {
|
|
|
|
+ width: 134px;
|
|
|
|
+ height: 36px;
|
|
|
|
+ background-color: #f5f8ff;
|
|
|
|
+ border-radius: 21px;
|
|
|
|
+ font-size: $global-font-size-16;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ color: #000000;
|
|
|
|
+ flex-shrink: 0;
|
|
|
|
+ line-height: 36px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ }
|
|
|
|
+ .OneRight {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
+ align-items: center;
|
|
|
|
+ padding: 0 12px;
|
|
|
|
+ flex: 1;
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ .label {
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
|
|
+ .label:first-child {
|
|
|
|
+ color: #0a58c2;
|
|
|
|
+ }
|
|
|
|
+ .label:hover {
|
|
|
|
+ color: $global-color-107;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .button {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ margin: 0 5px 0 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .one_2_2 {
|
|
|
|
+ margin: 20px 0;
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ .list {
|
|
|
|
+ position: relative;
|
|
|
|
+ margin: 0 39px 39px 0;
|
|
|
|
+ width: 208px;
|
|
|
|
+ height: 286px;
|
|
|
|
+ box-shadow: 3px 4px 4px 0px rgba(41, 41, 115, 0.32);
|
|
|
|
+ border: solid 1px #ededed;
|
|
|
|
+ .type {
|
|
|
|
+ margin-left: 33px;
|
|
|
|
+ padding: 22px 10px 0 0;
|
|
|
|
+ font-size: $global-font-size-16;
|
|
|
|
+ color: #414141;
|
|
|
|
+ }
|
|
|
|
+ .title {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ margin: 24px 18px 0;
|
|
|
|
+ height: 80px;
|
|
|
|
+ font-size: $global-font-size-18;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ color: #ffffff;
|
|
|
|
+ .ellipsis-3 {
|
|
|
|
+ display: -webkit-box;
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ -webkit-line-clamp: 3;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .address {
|
|
|
|
+ margin-top: 80px;
|
|
|
|
+ padding: 0 5px;
|
|
|
|
+ font-size: $global-font-size-16;
|
|
|
|
+ color: #282828;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
+ }
|
|
|
|
+ .biaoqian {
|
|
|
|
+ margin: 10px 5px 0 5px;
|
|
|
|
+ text-align: right;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ span {
|
|
|
|
+ padding: 0 5px;
|
|
|
|
+ background-color: #f5f8ff;
|
|
|
|
+ border-radius: 3px;
|
|
|
|
+ border: solid 1px #d2daec;
|
|
|
|
+ font-size: $global-font-size-14;
|
|
|
|
+ line-height: 23px;
|
|
|
|
+ color: #7d8aaa;
|
|
|
|
+ margin-right: 2px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .state {
|
|
|
|
+ display: block;
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 0px;
|
|
|
|
+ top: 0px;
|
|
|
|
+ width: 75px;
|
|
|
|
+ height: 24px;
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item-xmyl.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .state1 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item-xm1.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .state2 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item-xm2.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .state3 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item-xm3.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list0 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item1.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list1 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item2.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list2 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item3.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list3 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item4.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list4 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item5.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list5 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item6.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list6 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item7.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list7 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item8.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list8 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item9.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list9 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item10.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list10 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item1.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list11 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item2.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list12 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item3.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list13 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item4.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list14 {
|
|
|
|
+ background: url(/images/project/dbhi-kcxm-item5.png) no-repeat;
|
|
|
|
+ }
|
|
|
|
+ .list:nth-child(5n) {
|
|
|
|
+ margin-right: 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .one_2_3 {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ margin: 20px 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|