From ccc970e575ef3f3e5c67af8da210263f4ac549f9 Mon Sep 17 00:00:00 2001
From: feiyu02 <risaku@163.com>
Date: 星期五, 10 四月 2026 16:44:55 +0800
Subject: [PATCH] 2026.4.10
---
src/views/analysis/huanxincode/HuanxinCodeManage.vue | 812 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 811 insertions(+), 1 deletions(-)
diff --git a/src/views/analysis/huanxincode/HuanxinCodeManage.vue b/src/views/analysis/huanxincode/HuanxinCodeManage.vue
index 0389851..18e8352 100644
--- a/src/views/analysis/huanxincode/HuanxinCodeManage.vue
+++ b/src/views/analysis/huanxincode/HuanxinCodeManage.vue
@@ -1 +1,811 @@
-<template>鐜俊鐮佺鐞�</template>
+<template>
+ <div class="huanxin-code-manage">
+ <FYSearchBar @search="onSearch">
+ <template #options>
+ <!-- 鍖哄幙 -->
+ <FYOptionLocation
+ :initValue="false"
+ :allOption="false"
+ :level="3"
+ :checkStrictly="false"
+ v-model:value="formSearch.locations"
+ ></FYOptionLocation>
+ <!-- 鍦烘櫙绫诲瀷 -->
+ <FYOptionScene
+ :initValue="false"
+ :allOption="false"
+ :type="1"
+ v-model:value="formSearch.scenetype"
+ ></FYOptionScene>
+ <!-- 鏃堕棿 -->
+ <FYOptionTime
+ :initValue="false"
+ type="month"
+ v-model:value="formSearch.time"
+ ></FYOptionTime>
+ </template>
+ <template #buttons v-if="$slots.buttons"> </template>
+ </FYSearchBar>
+ <!-- 椤堕儴瀹忚鐪嬫澘鍖� -->
+ <el-row :gutter="20" class="dashboard">
+ <el-col :span="8">
+ <el-card shadow="hover" class="dashboard-card green-card" @click="filterByCode('green')">
+ <div class="card-content">
+ <div class="card-title">缁跨爜搴楅摵</div>
+ <div class="card-value">{{ statistics.greenCount }}<el-text>涓�</el-text></div>
+ <div class="card-percentage">{{ statistics.greenPercentage }}%</div>
+ </div>
+ </el-card>
+ </el-col>
+ <el-col :span="8">
+ <el-card shadow="hover" class="dashboard-card yellow-card" @click="filterByCode('yellow')">
+ <div class="card-content">
+ <div class="card-title">榛勭爜搴楅摵</div>
+ <div class="card-value">{{ statistics.yellowCount }}<el-text>涓�</el-text></div>
+ <div class="card-percentage">{{ statistics.yellowPercentage }}%</div>
+ </div>
+ </el-card>
+ </el-col>
+ <el-col :span="8">
+ <el-card shadow="hover" class="dashboard-card red-card" @click="filterByCode('red')">
+ <div class="card-content">
+ <div class="card-title">绾㈢爜搴楅摵</div>
+ <div class="card-value">{{ statistics.redCount }}<el-text>涓�</el-text></div>
+ <div class="card-percentage">{{ statistics.redPercentage }}%</div>
+ </div>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ <!-- 璇勫垎妯″瀷閰嶇疆鎸夐挳 -->
+ <!-- <div class="model-config" v-if="isAdmin">
+ <el-button type="primary" @click="openModelConfig">
+ <el-icon><Setting /></el-icon>
+ <span>璇勫垎妯″瀷閰嶇疆</span>
+ </el-button>
+ </div> -->
+
+ <!-- 搴楅摵鍒楄〃 -->
+ <div class="shop-list">
+ <el-table :data="filteredShopList" style="width: 100%" max-height="600px">
+ <el-table-column prop="shopName" label="搴楅摵鍚嶇О" />
+ <el-table-column prop="district" label="鎵�鍦ㄥ尯鍘�" width="120" />
+ <el-table-column prop="town" label="鎵�鍦ㄨ闀�" width="150" />
+ <el-table-column label="鐜俊鐮�" width="100">
+ <template #default="scope">
+ <el-tag :type="getCodeType(scope.row.code)">{{ getCodeText(scope.row.code) }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="score" label="褰撳墠璇勫垎" width="120" sortable />
+ <el-table-column label="璇勫垎鍙樺寲瓒嬪娍" width="150">
+ <template #default="scope">
+ <div class="trend">
+ <el-icon :class="['trend-icon', scope.row.trend > 0 ? 'up' : 'down']">
+ <ArrowUp v-if="scope.row.trend > 0" />
+ <ArrowDown v-else />
+ </el-icon>
+ <span :class="scope.row.trend > 0 ? 'up' : 'down'">
+ {{ scope.row.trend > 0 ? '+' : '' }}{{ scope.row.trend }}鍒�
+ </span>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column prop="lastUpdate" label="涓婃鏇存柊鏃堕棿" width="180" />
+ <el-table-column label="鎿嶄綔" width="100" fixed="right">
+ <template #default="scope">
+ <el-button size="small" @click="viewDetails(scope.row)">鏌ョ湅璇︽儏</el-button>
+ <!-- <el-button size="small" type="warning" @click="viewRiskWarnings(scope.row)"
+ >椋庨櫓棰勮璁板綍</el-button
+ > -->
+ </template>
+ </el-table-column>
+ </el-table>
+ <!-- 鍒嗛〉缁勪欢 -->
+ <div class="pagination">
+ <el-pagination
+ v-model:current-page="currentPage"
+ v-model:page-size="pageSize"
+ :page-sizes="[10, 20, 50, 100]"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+
+ <!-- 璇︽儏鎶藉眽 -->
+ <el-drawer
+ v-model="drawerVisible"
+ :title="selectedShop?.shopName || '搴楅摵璇︽儏'"
+ direction="rtl"
+ size="60%"
+ >
+ <div v-if="selectedShop" class="shop-details">
+ <el-row justify="space-between" style="flex-wrap: nowrap">
+ <!-- 鐜俊鐮佸ぇ鍥炬爣鍙婂綋鍓嶈瘎鍒� -->
+ <div class="code-header">
+ <div class="score-info">
+ <div class="score-label">褰撳墠璇勫垎</div>
+ <div class="score-value">{{ selectedShop.score }}</div>
+ </div>
+ <div class="code-icon">
+ <el-image
+ class="image"
+ :src="codeImageUrl"
+ :preview-src-list="[codeImageUrl]"
+ :initial-index="0"
+ fit="cover"
+ lazy
+ />
+ </div>
+ </div>
+
+ <!-- 璇勫垎缁村害闆疯揪鍥� -->
+ <div class="chart-section">
+ <h3>璇勫垎缁村害鍒嗘瀽</h3>
+ <div class="radar-chart">
+ <canvas ref="radarChart" width="500" height="400"></canvas>
+ </div>
+ </div>
+ </el-row>
+
+ <!-- 璇勫垎鍘嗗彶瓒嬪娍鍥� -->
+ <div class="chart-section">
+ <h3>璇勫垎鍘嗗彶瓒嬪娍</h3>
+ <div class="trend-chart">
+ <canvas ref="trendChart" width="800" height="350"></canvas>
+ </div>
+ </div>
+
+ <!-- 椋庨櫓棰勮璁板綍 -->
+ <div class="warning-section">
+ <h3>椋庨櫓棰勮璁板綍</h3>
+ <el-table :data="selectedShop.warnings" style="width: 100%">
+ <el-table-column prop="time" label="棰勮鏃堕棿" width="180" />
+ <el-table-column prop="content" label="棰勮鍐呭" />
+ <el-table-column prop="score" label="褰撴椂璇勫垎" width="120" />
+ <el-table-column label="澶勭悊鐘舵��" width="120">
+ <template #default="scope">
+ <el-tag :type="scope.row.handled ? 'success' : 'danger'">
+ {{ scope.row.handled ? '宸插鐞�' : '鏈鐞�' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ </el-drawer>
+
+ <!-- 璇勫垎妯″瀷閰嶇疆寮圭獥 -->
+ <el-dialog v-model="modelConfigVisible" title="璇勫垎妯″瀷閰嶇疆" width="80%">
+ <div class="model-config-content">
+ <!-- 杩欓噷搴旇闆嗘垚鐪熷疄鐨勯厤缃〃鍗� -->
+ <el-empty description="閰嶇疆琛ㄥ崟鍔犺浇涓�..." />
+ </div>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="modelConfigVisible = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="saveModelConfig">淇濆瓨閰嶇疆</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup>
+import dayjs from 'dayjs'
+import { ref, reactive, computed, onMounted, watch } from 'vue'
+import { Setting, ArrowUp, ArrowDown } from '@element-plus/icons-vue'
+import * as echarts from 'echarts'
+import userApi from '@/api/fytz/userApi'
+import creditApi from '@/api/fytz/creditApi'
+
+// 鎼滅储琛ㄥ崟
+const formSearch = ref({
+ locations: {
+ aCode: null,
+ aName: null,
+ cCode: '3100',
+ cName: '涓婃捣甯�',
+ dCode: '310104',
+ dName: '寰愭眹鍖�',
+ mCode: null,
+ mName: null,
+ pCode: '31',
+ pName: '涓婃捣甯�',
+ tCode: null,
+ tName: null,
+ },
+ scenetype: {
+ label: '椁愰ギ',
+ value: '1',
+ },
+ time: dayjs('2025-08-01').date(1).toDate(),
+})
+// 鐘舵��
+const drawerVisible = ref(false)
+const modelConfigVisible = ref(false)
+const selectedShop = ref(null)
+const isAdmin = ref(true) // 妯℃嫙绠＄悊鍛樻潈闄�
+const filterCode = ref('all')
+// 鍒嗛〉鐩稿叧
+const currentPage = ref(1)
+const pageSize = ref(10)
+const total = ref(0)
+// 鐜俊鐮佸浘鐗嘦RL
+const codeImageUrl = ref('')
+
+// 缁熻鏁版嵁
+const statistics = reactive({
+ greenCount: 125,
+ greenPercentage: 65.8,
+ yellowCount: 45,
+ yellowPercentage: 23.7,
+ redCount: 20,
+ redPercentage: 10.5,
+})
+
+function onSearch() {
+ const f = formSearch.value
+ const area = {}
+ // 琛屾斂鍖哄垝
+ area.provinceCode = f.locations.pCode
+ area.provinceName = f.locations.pName
+ if (area.provinceCode == null) {
+ area.provinceCode = null
+ area.provinceName = null
+ }
+ area.cityCode = f.locations.cCode
+ area.cityName = f.locations.cName
+ area.districtCode = f.locations.dCode
+ area.districtName = f.locations.dName
+ area.townCode = f.locations.tCode
+ area.townName = f.locations.tName
+ // 鍦烘櫙绫诲瀷
+ area.sceneTypes = []
+ f.scenetype.value == null ? (area.sceneTypes = []) : (area.sceneTypes = [f.scenetype.value])
+ // 涓婁笅绾跨姸鎬�
+ area.online = true
+ // 鍏抽敭瀛�
+ area.searchText = ''
+
+ userApi.fetchUser(currentPage.value, pageSize.value, area).then((res) => {
+ if (res) {
+ total.value = res.head.totalCount
+ shopList.value = res.data.map((item, index) => {
+ const { score, code } = generateRandomScore()
+ return {
+ id: index + 1,
+ guid: item.biGuid,
+ shopName: item.biName,
+ district: item.biDistrictName,
+ town: item.biTownName,
+ code: code,
+ score: score,
+ trend: generateRandomTrend(),
+ lastUpdate: generateRandomDate(),
+ warnings: [
+ {
+ time: generateRandomDate(),
+ content: '鍑�鍖栧櫒杩愯鏃堕暱涓嶈冻',
+ score: 90,
+ handled: true,
+ },
+ ],
+ }
+ })
+ }
+ })
+}
+
+// 鐢熸垚2025骞�8鏈堝唴鐨勯殢鏈烘椂闂�
+function generateRandomDate() {
+ const year = 2025
+ const month = 7 // 0-11锛�8鏈堟槸7
+ const day = Math.floor(Math.random() * 31) + 1 // 1-31
+ const hour = Math.floor(Math.random() * 24) // 0-23
+ const minute = Math.floor(Math.random() * 60) // 0-59
+
+ const date = new Date(year, month, day, hour, minute)
+ return date.toISOString().slice(0, 16).replace('T', ' ')
+}
+
+// 鐢熸垚闅忔満璇勫垎鍜屽搴旂幆淇＄爜绛夌骇
+function generateRandomScore() {
+ const score = Math.floor(Math.random() * 101) // 0-100
+ let code
+ if (score >= 90) {
+ code = 'green'
+ } else if (score >= 60) {
+ code = 'yellow'
+ } else {
+ code = 'red'
+ }
+ return {
+ score,
+ code,
+ }
+}
+
+// 鐢熸垚闅忔満璇勫垎瓒嬪娍
+function generateRandomTrend() {
+ return Math.floor(Math.random() * 11) - 5 // -5 鍒� 5
+}
+
+// 搴楅摵鏁版嵁
+const shopList = ref([])
+
+// 杩囨护鍚庣殑搴楅摵鍒楄〃
+const filteredShopList = computed(() => {
+ if (filterCode.value === 'all') {
+ return shopList.value
+ }
+ return shopList.value.filter((shop) => shop.code === filterCode.value)
+})
+
+// 鐢熷懡鍛ㄦ湡
+onMounted(() => {
+ // 杩欓噷鍙互浠嶢PI鑾峰彇鏁版嵁
+ console.log('鐜俊鐮佺鐞嗛〉闈㈠姞杞�')
+ onSearch()
+})
+
+// 鏂规硶
+function onBack() {
+ // 鍥為��閫昏緫
+ console.log('鍥為��')
+}
+
+function filterByCode(code) {
+ filterCode.value = code === filterCode.value ? 'all' : code
+ currentPage.value = 1 // 閲嶇疆鍒扮涓�椤�
+}
+
+// 鍒嗛〉鏂规硶
+function handleSizeChange(size) {
+ pageSize.value = size
+ currentPage.value = 1
+ onSearch()
+}
+
+function handleCurrentChange(current) {
+ currentPage.value = current
+ onSearch()
+}
+
+function getCodeType(code) {
+ switch (code) {
+ case 'green':
+ return 'success'
+ case 'yellow':
+ return 'warning'
+ case 'red':
+ return 'danger'
+ default:
+ return ''
+ }
+}
+
+function getCodeText(code) {
+ switch (code) {
+ case 'green':
+ return '缁跨爜'
+ case 'yellow':
+ return '榛勭爜'
+ case 'red':
+ return '绾㈢爜'
+ default:
+ return ''
+ }
+}
+
+// 闆疯揪鍥惧拰瓒嬪娍鍥惧紩鐢�
+const radarChart = ref(null)
+const trendChart = ref(null)
+let radarChartInstance = null
+let trendChartInstance = null
+
+function viewDetails(shop) {
+ selectedShop.value = shop
+ drawerVisible.value = true
+
+ // 鑾峰彇鐜俊鐮佸浘鐗�
+ if (shop.guid && shop.shopName) {
+ creditApi.fetchCodeUrl(shop.guid, shop.shopName).then((res) => {
+ if (res && res.url) {
+ codeImageUrl.value = res.url
+ }
+ })
+ }
+
+ // 寤惰繜缁樺埗鍥捐〃锛岀‘淇滵OM宸叉洿鏂�
+ setTimeout(() => {
+ drawRadarChart()
+ drawTrendChart()
+ }, 100)
+}
+
+// 缁樺埗闆疯揪鍥�
+function drawRadarChart() {
+ if (!radarChart.value) return
+
+ // 閿�姣佹棫瀹炰緥
+ if (radarChartInstance) {
+ radarChartInstance.dispose()
+ }
+
+ // 鍒濆鍖杄charts瀹炰緥
+ radarChartInstance = echarts.init(radarChart.value)
+
+ // 闆疯揪鍥炬暟鎹�
+ const labels = [
+ '鍦ㄧ嚎鐩戞祴璁惧',
+ '鍑�鍖栬鏂借澶�',
+ '鍦ㄧ嚎鐩戞祴璁惧缁存姢',
+ '鍑�鍖栬鏂借澶囩淮鎶�',
+ '鍦ㄧ嚎鐩戞祴鏁版嵁閲忕骇',
+ '绌鸿皟鍜岄鏈哄櫔澹�',
+ '鍙扮珯绠＄悊',
+ '淇＄敤鎵胯鑷瘎',
+ ]
+
+ // 鐢熸垚闅忔満璇勫垎鏁版嵁锛堝疄闄呴」鐩腑搴斾粠API鑾峰彇锛�
+ const data = labels.map(() => Math.floor(Math.random() * 40) + 60) // 60-100鍒�
+
+ // 閰嶇疆椤�
+ const option = {
+ radar: {
+ indicator: labels.map((label) => ({
+ name: label,
+ max: 100,
+ })),
+ radius: '70%',
+ },
+ series: [
+ {
+ type: 'radar',
+ data: [
+ {
+ value: data,
+ name: '璇勫垎缁村害',
+ areaStyle: {
+ color: 'rgba(103, 194, 58, 0.2)',
+ },
+ lineStyle: {
+ color: '#67c23a',
+ },
+ itemStyle: {
+ color: '#67c23a',
+ },
+ },
+ ],
+ },
+ ],
+ }
+
+ // 娓叉煋鍥捐〃
+ radarChartInstance.setOption(option)
+
+ // 鐩戝惉绐楀彛澶у皬鍙樺寲
+ window.addEventListener('resize', () => {
+ radarChartInstance.resize()
+ })
+}
+
+// 缁樺埗瓒嬪娍鍥�
+function drawTrendChart() {
+ if (!trendChart.value) return
+
+ // 閿�姣佹棫瀹炰緥
+ if (trendChartInstance) {
+ trendChartInstance.dispose()
+ }
+
+ // 鍒濆鍖杄charts瀹炰緥
+ trendChartInstance = echarts.init(trendChart.value)
+
+ // 鐢熸垚杩囧幓12涓湀鐨勬爣绛�
+ const labels = []
+ const data = []
+ const now = dayjs()
+
+ for (let i = 11; i >= 0; i--) {
+ const date = now.subtract(i, 'month')
+ labels.push(date.format('YYYY-MM'))
+ // 鐢熸垚闅忔満璇勫垎鏁版嵁锛堝疄闄呴」鐩腑搴斾粠API鑾峰彇锛�
+ data.push(Math.floor(Math.random() * 30) + 70) // 70-100鍒�
+ }
+
+ // 閰嶇疆椤�
+ const option = {
+ tooltip: {
+ trigger: 'axis',
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true,
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: labels,
+ axisLabel: {
+ rotate: 45,
+ },
+ },
+ yAxis: {
+ type: 'value',
+ min: 60,
+ max: 100,
+ interval: 8,
+ },
+ series: [
+ {
+ name: '璇勫垎',
+ type: 'line',
+ data: data,
+ smooth: true,
+ lineStyle: {
+ color: '#409eff',
+ },
+ itemStyle: {
+ color: '#409eff',
+ },
+ areaStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: 'rgba(64, 158, 255, 0.3)',
+ },
+ {
+ offset: 1,
+ color: 'rgba(64, 158, 255, 0.1)',
+ },
+ ]),
+ },
+ },
+ ],
+ }
+
+ // 娓叉煋鍥捐〃
+ trendChartInstance.setOption(option)
+
+ // 鐩戝惉绐楀彛澶у皬鍙樺寲
+ window.addEventListener('resize', () => {
+ trendChartInstance.resize()
+ })
+}
+
+function viewRiskWarnings(shop) {
+ selectedShop.value = shop
+ drawerVisible.value = true
+ // 杩欓噷鍙互婊氬姩鍒伴闄╅璀﹂儴鍒�
+}
+
+function openModelConfig() {
+ modelConfigVisible.value = true
+}
+
+function saveModelConfig() {
+ // 淇濆瓨閰嶇疆閫昏緫
+ modelConfigVisible.value = false
+ console.log('淇濆瓨璇勫垎妯″瀷閰嶇疆')
+}
+</script>
+
+<style scoped>
+.huanxin-code-manage {
+ padding: 20px;
+}
+
+.dashboard {
+ margin-bottom: 30px;
+}
+
+.dashboard-card {
+ cursor: pointer;
+ transition: all 0.3s ease;
+}
+
+.dashboard-card:hover {
+ transform: translateY(-5px);
+}
+
+.card-content {
+ text-align: center;
+ padding: 0px 0;
+}
+
+.card-title {
+ font-size: 16px;
+ margin-bottom: 10px;
+}
+
+.card-value {
+ font-size: 32px;
+ font-weight: bold;
+ margin-bottom: 5px;
+}
+
+.card-percentage {
+ font-size: 14px;
+ opacity: 0.8;
+}
+
+.green-card .card-value {
+ color: #67c23a;
+}
+
+.yellow-card .card-value {
+ color: #e6a23c;
+}
+
+.red-card .card-value {
+ color: #f56c6c;
+}
+
+.model-config {
+ text-align: right;
+ margin-bottom: 20px;
+}
+
+.shop-list {
+ margin-bottom: 20px;
+}
+
+.pagination {
+ margin-top: 20px;
+ text-align: right;
+}
+
+.trend {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.trend-icon {
+ margin-right: 5px;
+}
+
+.trend-icon.up {
+ color: #67c23a;
+}
+
+.trend-icon.down {
+ color: #f56c6c;
+}
+
+.trend .up {
+ color: #67c23a;
+}
+
+.trend .down {
+ color: #f56c6c;
+}
+
+.map-container {
+ position: relative;
+ height: 600px;
+ border: 1px solid #e4e7ed;
+ border-radius: 4px;
+}
+
+.map-placeholder {
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.map-legend {
+ position: absolute;
+ bottom: 20px;
+ right: 20px;
+ background: white;
+ padding: 10px;
+ border-radius: 4px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+}
+
+.legend-item {
+ display: flex;
+ align-items: center;
+ margin-bottom: 5px;
+}
+
+.legend-dot {
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ margin-right: 8px;
+}
+
+.legend-dot.green {
+ background-color: #67c23a;
+}
+
+.legend-dot.yellow {
+ background-color: #e6a23c;
+}
+
+.legend-dot.red {
+ background-color: #f56c6c;
+}
+
+.shop-details {
+ padding: 20px;
+}
+
+.code-header {
+ display: flex;
+ align-items: flex-start;
+ flex-direction: column;
+ margin-bottom: 20px;
+}
+
+.code-icon {
+ margin-right: 30px;
+}
+
+.score-info {
+ flex: 1;
+}
+
+.score-label {
+ font-size: 16px;
+ margin-bottom: 5px;
+}
+
+.score-value {
+ font-size: 48px;
+ font-weight: bold;
+}
+
+.chart-section {
+ margin-bottom: 20px;
+}
+
+.chart-section h3 {
+ margin-bottom: 10px;
+ font-size: 16px;
+}
+
+.radar-chart {
+ width: 500px;
+ height: 500px;
+ border: 1px solid #e4e7ed;
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.trend-chart {
+ height: 350px;
+ border: 1px solid #e4e7ed;
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.warning-section {
+ margin-top: 20px;
+}
+
+.warning-section h3 {
+ margin-bottom: 10px;
+ font-size: 16px;
+}
+
+.image {
+ width: 300px;
+ /* height: 250px; */
+ border-radius: 4px;
+ margin-bottom: 6px;
+}
+</style>
--
Gitblit v1.9.3