syy

zhsq_qk-ui/src/assets/images/qkq_sprh.css

@@ -599,7 +599,138 @@ padding: 0px 10px;
 .qkq_mssq_div span{
 	font-size: 14px;
 	color: #fff;
-}
+}
+/* 基层治理里的民生诉求部分 */
+.left_con2{
+	width: 715px;
+	background: none;
+}
+.ms_list{
+	margin-top: 60px;
+	height: 720px;
+	overflow-y: scroll;
+}
+.ms_list li{
+	display: flex;
+	flex-direction: column;
+	padding: 10px 10px;
+	cursor: pointer;
+	background-color: #031d564f;
+}
+.ms_list li:hover{
+	background-color: #034a95;
+}
+.ms_list li .ms_tit{
+	display: flex;
+	flex-direction: row;
+}
+.ms_list li .ms_tit img{
+	display: block;
+	width: 300px;
+	height: 180px;
+	margin-right: 15px;
+}
+.ms_list li .ms_txt{
+	display: flex;
+	flex-direction: column;
+	width: 400px;
+}
+.ms_list li .ms_txt h4{
+	color: #00aaff;
+	text-shadow: 0px 0px 5px #0055ff;
+	font-size: 18px;
+	font-weight: 900;
+	height: 30px;
+	line-height: 30px;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	
+}
+.ms_list li .ms_txt p{
+	color: #e9faff;
+	font-size: 16px;
+	line-height: 30px;
+	padding-top: 5px;
+	overflow: hidden;
+	word-break: break-all;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-box-orient: vertical;
+	-webkit-line-clamp: 5;
+	text-align: justify;
+}
+.right_con2{
+	left: 770px;
+	background: none;
+	width: 1185px;
+}
+.right_con2 .top_txt{
+	float: right;
+}
+.ms_right_top{
+	display: flex;
+	flex-direction: row;
+	margin-top: 105px;
+}
+.ms_img{
+	width: 400px;
+	height: 300px;
+	margin-right: 30px;
+}
+.ms_img div{
+	border: 0px!important;
+	outline: 0px!important;
+}
+.ms_img img{
+	width: 100%;
+	height: 100%;
+	display: block;
+	/* background-color: #074f7a; */
+	border: 0px;
+	outline: 0px;
+}
+.mssq_txt{
+	width: 760px;
+}
+.mssq_txt h4{
+	height: 50px;
+	line-height: 50px;
+	color: #00aaff;
+	text-shadow: 0px 0px 5px #0055ff;
+	font-size: 20px;
+	font-weight: 900;
+}
+.mssq_txt p{
+	height: 80px;
+	color:#b8e6ff ;
+	line-height: 80px;
+	font-size: 18px;
+	font-weight: 900;
+	
+}
+.mssq_txt p span{
+	width: 50%;
+	display: inline-block;
+}
+.mssq_btm_txt{
+	margin-top: 30px;
+}
+.mssq_btm_txt h4{
+	height: 80px;
+	color:#e9faff ;
+	line-height: 80px;
+	font-size: 18px;
+}
+.mssq_btm_txt p{
+	font-size: 18px;
+	line-height: 45px;
+	text-align: justify;
+	color:#e9faff ;
+}
+
+
+
 
 /* 政务运行 */
 .zwyx_left{

zhsq_qk-ui/src/views/fusion/aqyj.vue

@@ -1231,89 +1231,77 @@ export default {
     ,
     qkq_aqcn_chart() {
       var myChart = echarts.init(document.getElementById('qkq_aqcn_chart'));
-     // mock数据
-     const mockData = {
-         value: 100,
-         name: '承诺率'
-     }
-     // 渐变色
-     var color = [
-         { offset: 0, color:  'rgba(0, 170, 255, 0.5)' },
-         { offset: 0.6, color:  'rgba(0, 170, 255, 0.6)' },
-         { offset: 0.95, color: 'rgba(0, 170, 255, 0.7)' },
-         { offset: 1, color: 'rgba(0, 170, 255, 0.9)' }
-     ];
-
-     // 圆环宽度
-     const barMaxWidth = 10
-
-     // 坐标轴
-     const angleAxis = {
-         show: false,
-         max: 100 * 360 / 270,
-         type: 'value',
-         startAngle: 225,
-         splitLine: { show: false }
-     }
-
-     // 坐标轴
-     const radiusAxis = {
-         show: false,
-         type: 'category',
-     }
-
-     //圆环位置和大小
-     const polar = {
-         center: ['50%', '60%'],
-         radius: '175%'
-     }
-     const series =  [{
-         type: 'bar',
-         data: [{
-             //上层圆环，显示数据
-             value: mockData.value,
-             itemStyle: {
-                 color: { type: 'linear', x: 0, y: 0, x2: 1, y2: 0, colorStops: color, },
-             },
-         }],
-         label: {
-             show: true,
-
-             formatter: params => {
-                 return `{a|${params.value}}{b| %}\n\n\n{c|${mockData.name}}`
-             },
-             rich: {
-                 a: { fontSize: 18, verticalAlign: 'bottom' },
-                 b: { fontSize: 16, verticalAlign: 'bottom' },
-                 c: { fontSize: 14 }
-             },
-			 itemStyle: {
-			   normal: {
-			     color: "#fff"
-			   }
-			 },
-         },
-
-         barGap: '-100%',
-         coordinateSystem: 'polar',
-         roundCap: true,
-         z: 2
-     },
-     {
-         type: 'bar',
-         data: [{
-             value: 100,
-             itemStyle: { color: 'rgba(0, 36, 109, 0.3)' }
-         }],
-         barGap: '-100%',
-         coordinateSystem: 'polar',
-         roundCap: true,
-         z: 1
-     }]
-     // 渲染
-     var option = { barMaxWidth, radiusAxis, polar, angleAxis, series};
-
-
+    var  getvalue=[100];
+    
+    var option = {
+        title: {
+        text: getvalue+'%',
+        textStyle: {
+          color: '#00aaff',
+          fontSize: 18
+        },
+        subtext: '承诺率',
+            subtextStyle: {
+                color: '#fff',
+                fontSize: 16
+            },
+    	itemGap: 10,
+        left: 'center',
+        top: '37%'
+    	},
+        tooltip: {
+           
+        },
+      angleAxis: {
+        max: 100,
+        clockwise: true, // 逆时针
+        // 隐藏刻度线
+        show: false
+      },
+      radiusAxis: {
+            type: 'category',
+            show: true,
+            axisLabel: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+    
+            },
+            axisTick: {
+                show: false
+            },
+      },
+      polar: {
+        center: ['50%', '60%'],
+        radius: '150%' //图形大小
+      },
+      series: [{
+        type: 'bar',
+        data: getvalue,
+    	showBackground: true,
+    	backgroundStyle: {
+    		color: '#BDEBFF',
+    	},
+        coordinateSystem: 'polar',
+        roundCap: true,
+        barWidth: 5,
+        itemStyle: {
+            normal: {
+            opacity: 1,
+            color:  new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                offset: 0,
+                color: '#25BFFF'
+              }, {
+                offset: 1,
+                color: '#5284DE'
+              }]),
+            shadowBlur: 5,
+            shadowColor: '#2A95F9',
+        }
+        },
+      }]
+    };
       if (option) {
         myChart.setOption(option);
       }