Domů Procházet Nápověda
Registrovat se Přihlásit se
tengmingxue
/
mbPortalSite
1
0
Rozštěpit 0
Soubory Úkoly 0 Pull Requesty 0 Wiki
Procházet zdrojové kódy

3.11工作内容

bulusiLuo před 3 roky
rodič
749c7bd54b
revize
e131eaaf9a
23 změnil soubory, kde provedl 1150 přidání a 151 odebrání
Rozdělené zobrazení Ukázat statistiku rozdílových dat
  1. 1 0
      public/index.html
  2. 3 0
      src/App.vue
  3. 539 0
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/demo.css
  4. 257 0
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/demo_index.html
  5. 27 0
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.css
  6. 1 0
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.js
  7. 30 0
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.json
  8. binární
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.ttf
  9. binární
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.woff
  10. binární
      src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.woff2
  11. 1 1
      src/layout/components/AppMain.vue
  12. 24 9
      src/layout/components/Footer/index.vue
  13. 4 4
      src/views/currentSystem/InfoDisclosure/openWork.vue
  14. 37 21
      src/views/currentSystem/companyDynamics/companyDynamics.vue
  15. 2 6
      src/views/currentSystem/companyProfile/companyProfile.vue
  16. 5 8
      src/views/currentSystem/companyProfile/developmentHistory.vue
  17. 14 5
      src/views/currentSystem/companyProfile/leaderProfile.vue
  18. 6 9
      src/views/currentSystem/companyProfile/organization.vue
  19. binární
      src/views/currentSystem/dashboard/images/linshi.png
  20. binární
      src/views/currentSystem/dashboard/images/map.png
  21. binární
      src/views/currentSystem/dashboard/images/u4.jpg
  22. 198 87
      src/views/currentSystem/dashboard/index.vue
  23. 1 1
      src/views/currentSystem/hotline/hotline.vue

+ 1 - 0
public/index.html
Zobrazit soubor 

@@ -10,6 +10,7 @@
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
 
     <title>马边自来水有限公司</title>
 
     <link rel="stylesheet" href="//at.alicdn.com/t/font_2327815_iyrzzxff85g.css">
 
+    <link rel="stylesheet" href="//at.alicdn.com/t/font_3239448_r77f4zgmc3m.css">
 
   </head>
 
   <body>
 
     <div id="app"></div>

+ 3 - 0
src/App.vue
Zobrazit soubor 

@@ -14,6 +14,9 @@ export default {
 
 #nprogress .bar {
 
   background: #409eff !important; //自定义颜色
 
 }
 
+body{
 
+  background: #e4f1fb;
 
+}
 
 // // 滚动条的滑块大小
 
 // ::-webkit-scrollbar {
 
 //   width: 16px;

+ 539 - 0
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/demo.css
Zobrazit soubor 

@@ -0,0 +1,539 @@
 
+/* Logo 字体 */
 
+@font-face {
 
+  font-family: "iconfont logo";
 
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
 
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
 
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
 
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
 
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
 
+}
 
+
 
+.logo {
 
+  font-family: "iconfont logo";
 
+  font-size: 160px;
 
+  font-style: normal;
 
+  -webkit-font-smoothing: antialiased;
 
+  -moz-osx-font-smoothing: grayscale;
 
+}
 
+
 
+/* tabs */
 
+.nav-tabs {
 
+  position: relative;
 
+}
 
+
 
+.nav-tabs .nav-more {
 
+  position: absolute;
 
+  right: 0;
 
+  bottom: 0;
 
+  height: 42px;
 
+  line-height: 42px;
 
+  color: #666;
 
+}
 
+
 
+#tabs {
 
+  border-bottom: 1px solid #eee;
 
+}
 
+
 
+#tabs li {
 
+  cursor: pointer;
 
+  width: 100px;
 
+  height: 40px;
 
+  line-height: 40px;
 
+  text-align: center;
 
+  font-size: 16px;
 
+  border-bottom: 2px solid transparent;
 
+  position: relative;
 
+  z-index: 1;
 
+  margin-bottom: -1px;
 
+  color: #666;
 
+}
 
+
 
+
 
+#tabs .active {
 
+  border-bottom-color: #f00;
 
+  color: #222;
 
+}
 
+
 
+.tab-container .content {
 
+  display: none;
 
+}
 
+
 
+/* 页面布局 */
 
+.main {
 
+  padding: 30px 100px;
 
+  width: 960px;
 
+  margin: 0 auto;
 
+}
 
+
 
+.main .logo {
 
+  color: #333;
 
+  text-align: left;
 
+  margin-bottom: 30px;
 
+  line-height: 1;
 
+  height: 110px;
 
+  margin-top: -50px;
 
+  overflow: hidden;
 
+  *zoom: 1;
 
+}
 
+
 
+.main .logo a {
 
+  font-size: 160px;
 
+  color: #333;
 
+}
 
+
 
+.helps {
 
+  margin-top: 40px;
 
+}
 
+
 
+.helps pre {
 
+  padding: 20px;
 
+  margin: 10px 0;
 
+  border: solid 1px #e7e1cd;
 
+  background-color: #fffdef;
 
+  overflow: auto;
 
+}
 
+
 
+.icon_lists {
 
+  width: 100% !important;
 
+  overflow: hidden;
 
+  *zoom: 1;
 
+}
 
+
 
+.icon_lists li {
 
+  width: 100px;
 
+  margin-bottom: 10px;
 
+  margin-right: 20px;
 
+  text-align: center;
 
+  list-style: none !important;
 
+  cursor: default;
 
+}
 
+
 
+.icon_lists li .code-name {
 
+  line-height: 1.2;
 
+}
 
+
 
+.icon_lists .icon {
 
+  display: block;
 
+  height: 100px;
 
+  line-height: 100px;
 
+  font-size: 42px;
 
+  margin: 10px auto;
 
+  color: #333;
 
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
 
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
 
+  transition: font-size 0.25s linear, width 0.25s linear;
 
+}
 
+
 
+.icon_lists .icon:hover {
 
+  font-size: 100px;
 
+}
 
+
 
+.icon_lists .svg-icon {
 
+  /* 通过设置 font-size 来改变图标大小 */
 
+  width: 1em;
 
+  /* 图标和文字相邻时，垂直对齐 */
 
+  vertical-align: -0.15em;
 
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
 
+  fill: currentColor;
 
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
 
+      normalize.css 中也包含这行 */
 
+  overflow: hidden;
 
+}
 
+
 
+.icon_lists li .name,
 
+.icon_lists li .code-name {
 
+  color: #666;
 
+}
 
+
 
+/* markdown 样式 */
 
+.markdown {
 
+  color: #666;
 
+  font-size: 14px;
 
+  line-height: 1.8;
 
+}
 
+
 
+.highlight {
 
+  line-height: 1.5;
 
+}
 
+
 
+.markdown img {
 
+  vertical-align: middle;
 
+  max-width: 100%;
 
+}
 
+
 
+.markdown h1 {
 
+  color: #404040;
 
+  font-weight: 500;
 
+  line-height: 40px;
 
+  margin-bottom: 24px;
 
+}
 
+
 
+.markdown h2,
 
+.markdown h3,
 
+.markdown h4,
 
+.markdown h5,
 
+.markdown h6 {
 
+  color: #404040;
 
+  margin: 1.6em 0 0.6em 0;
 
+  font-weight: 500;
 
+  clear: both;
 
+}
 
+
 
+.markdown h1 {
 
+  font-size: 28px;
 
+}
 
+
 
+.markdown h2 {
 
+  font-size: 22px;
 
+}
 
+
 
+.markdown h3 {
 
+  font-size: 16px;
 
+}
 
+
 
+.markdown h4 {
 
+  font-size: 14px;
 
+}
 
+
 
+.markdown h5 {
 
+  font-size: 12px;
 
+}
 
+
 
+.markdown h6 {
 
+  font-size: 12px;
 
+}
 
+
 
+.markdown hr {
 
+  height: 1px;
 
+  border: 0;
 
+  background: #e9e9e9;
 
+  margin: 16px 0;
 
+  clear: both;
 
+}
 
+
 
+.markdown p {
 
+  margin: 1em 0;
 
+}
 
+
 
+.markdown>p,
 
+.markdown>blockquote,
 
+.markdown>.highlight,
 
+.markdown>ol,
 
+.markdown>ul {
 
+  width: 80%;
 
+}
 
+
 
+.markdown ul>li {
 
+  list-style: circle;
 
+}
 
+
 
+.markdown>ul li,
 
+.markdown blockquote ul>li {
 
+  margin-left: 20px;
 
+  padding-left: 4px;
 
+}
 
+
 
+.markdown>ul li p,
 
+.markdown>ol li p {
 
+  margin: 0.6em 0;
 
+}
 
+
 
+.markdown ol>li {
 
+  list-style: decimal;
 
+}
 
+
 
+.markdown>ol li,
 
+.markdown blockquote ol>li {
 
+  margin-left: 20px;
 
+  padding-left: 4px;
 
+}
 
+
 
+.markdown code {
 
+  margin: 0 3px;
 
+  padding: 0 5px;
 
+  background: #eee;
 
+  border-radius: 3px;
 
+}
 
+
 
+.markdown strong,
 
+.markdown b {
 
+  font-weight: 600;
 
+}
 
+
 
+.markdown>table {
 
+  border-collapse: collapse;
 
+  border-spacing: 0px;
 
+  empty-cells: show;
 
+  border: 1px solid #e9e9e9;
 
+  width: 95%;
 
+  margin-bottom: 24px;
 
+}
 
+
 
+.markdown>table th {
 
+  white-space: nowrap;
 
+  color: #333;
 
+  font-weight: 600;
 
+}
 
+
 
+.markdown>table th,
 
+.markdown>table td {
 
+  border: 1px solid #e9e9e9;
 
+  padding: 8px 16px;
 
+  text-align: left;
 
+}
 
+
 
+.markdown>table th {
 
+  background: #F7F7F7;
 
+}
 
+
 
+.markdown blockquote {
 
+  font-size: 90%;
 
+  color: #999;
 
+  border-left: 4px solid #e9e9e9;
 
+  padding-left: 0.8em;
 
+  margin: 1em 0;
 
+}
 
+
 
+.markdown blockquote p {
 
+  margin: 0;
 
+}
 
+
 
+.markdown .anchor {
 
+  opacity: 0;
 
+  transition: opacity 0.3s ease;
 
+  margin-left: 8px;
 
+}
 
+
 
+.markdown .waiting {
 
+  color: #ccc;
 
+}
 
+
 
+.markdown h1:hover .anchor,
 
+.markdown h2:hover .anchor,
 
+.markdown h3:hover .anchor,
 
+.markdown h4:hover .anchor,
 
+.markdown h5:hover .anchor,
 
+.markdown h6:hover .anchor {
 
+  opacity: 1;
 
+  display: inline-block;
 
+}
 
+
 
+.markdown>br,
 
+.markdown>p>br {
 
+  clear: both;
 
+}
 
+
 
+
 
+.hljs {
 
+  display: block;
 
+  background: white;
 
+  padding: 0.5em;
 
+  color: #333333;
 
+  overflow-x: auto;
 
+}
 
+
 
+.hljs-comment,
 
+.hljs-meta {
 
+  color: #969896;
 
+}
 
+
 
+.hljs-string,
 
+.hljs-variable,
 
+.hljs-template-variable,
 
+.hljs-strong,
 
+.hljs-emphasis,
 
+.hljs-quote {
 
+  color: #df5000;
 
+}
 
+
 
+.hljs-keyword,
 
+.hljs-selector-tag,
 
+.hljs-type {
 
+  color: #a71d5d;
 
+}
 
+
 
+.hljs-literal,
 
+.hljs-symbol,
 
+.hljs-bullet,
 
+.hljs-attribute {
 
+  color: #0086b3;
 
+}
 
+
 
+.hljs-section,
 
+.hljs-name {
 
+  color: #63a35c;
 
+}
 
+
 
+.hljs-tag {
 
+  color: #333333;
 
+}
 
+
 
+.hljs-title,
 
+.hljs-attr,
 
+.hljs-selector-id,
 
+.hljs-selector-class,
 
+.hljs-selector-attr,
 
+.hljs-selector-pseudo {
 
+  color: #795da3;
 
+}
 
+
 
+.hljs-addition {
 
+  color: #55a532;
 
+  background-color: #eaffea;
 
+}
 
+
 
+.hljs-deletion {
 
+  color: #bd2c00;
 
+  background-color: #ffecec;
 
+}
 
+
 
+.hljs-link {
 
+  text-decoration: underline;
 
+}
 
+
 
+/* 代码高亮 */
 
+/* PrismJS 1.15.0
 
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
 
+/**
 
+ * prism.js default theme for JavaScript, CSS and HTML
 
+ * Based on dabblet (http://dabblet.com)
 
+ * @author Lea Verou
 
+ */
 
+code[class*="language-"],
 
+pre[class*="language-"] {
 
+  color: black;
 
+  background: none;
 
+  text-shadow: 0 1px white;
 
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
 
+  text-align: left;
 
+  white-space: pre;
 
+  word-spacing: normal;
 
+  word-break: normal;
 
+  word-wrap: normal;
 
+  line-height: 1.5;
 
+
 
+  -moz-tab-size: 4;
 
+  -o-tab-size: 4;
 
+  tab-size: 4;
 
+
 
+  -webkit-hyphens: none;
 
+  -moz-hyphens: none;
 
+  -ms-hyphens: none;
 
+  hyphens: none;
 
+}
 
+
 
+pre[class*="language-"]::-moz-selection,
 
+pre[class*="language-"] ::-moz-selection,
 
+code[class*="language-"]::-moz-selection,
 
+code[class*="language-"] ::-moz-selection {
 
+  text-shadow: none;
 
+  background: #b3d4fc;
 
+}
 
+
 
+pre[class*="language-"]::selection,
 
+pre[class*="language-"] ::selection,
 
+code[class*="language-"]::selection,
 
+code[class*="language-"] ::selection {
 
+  text-shadow: none;
 
+  background: #b3d4fc;
 
+}
 
+
 
+@media print {
 
+
 
+  code[class*="language-"],
 
+  pre[class*="language-"] {
 
+    text-shadow: none;
 
+  }
 
+}
 
+
 
+/* Code blocks */
 
+pre[class*="language-"] {
 
+  padding: 1em;
 
+  margin: .5em 0;
 
+  overflow: auto;
 
+}
 
+
 
+:not(pre)>code[class*="language-"],
 
+pre[class*="language-"] {
 
+  background: #f5f2f0;
 
+}
 
+
 
+/* Inline code */
 
+:not(pre)>code[class*="language-"] {
 
+  padding: .1em;
 
+  border-radius: .3em;
 
+  white-space: normal;
 
+}
 
+
 
+.token.comment,
 
+.token.prolog,
 
+.token.doctype,
 
+.token.cdata {
 
+  color: slategray;
 
+}
 
+
 
+.token.punctuation {
 
+  color: #999;
 
+}
 
+
 
+.namespace {
 
+  opacity: .7;
 
+}
 
+
 
+.token.property,
 
+.token.tag,
 
+.token.boolean,
 
+.token.number,
 
+.token.constant,
 
+.token.symbol,
 
+.token.deleted {
 
+  color: #905;
 
+}
 
+
 
+.token.selector,
 
+.token.attr-name,
 
+.token.string,
 
+.token.char,
 
+.token.builtin,
 
+.token.inserted {
 
+  color: #690;
 
+}
 
+
 
+.token.operator,
 
+.token.entity,
 
+.token.url,
 
+.language-css .token.string,
 
+.style .token.string {
 
+  color: #9a6e3a;
 
+  background: hsla(0, 0%, 100%, .5);
 
+}
 
+
 
+.token.atrule,
 
+.token.attr-value,
 
+.token.keyword {
 
+  color: #07a;
 
+}
 
+
 
+.token.function,
 
+.token.class-name {
 
+  color: #DD4A68;
 
+}
 
+
 
+.token.regex,
 
+.token.important,
 
+.token.variable {
 
+  color: #e90;
 
+}
 
+
 
+.token.important,
 
+.token.bold {
 
+  font-weight: bold;
 
+}
 
+
 
+.token.italic {
 
+  font-style: italic;
 
+}
 
+
 
+.token.entity {
 
+  cursor: help;
 
+}

+ 257 - 0
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/demo_index.html
Zobrazit soubor 

@@ -0,0 +1,257 @@
 
+<!DOCTYPE html>
 
+<html>
 
+<head>
 
+  <meta charset="utf-8"/>
 
+  <title>iconfont Demo</title>
 
+  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
 
+  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
 
+  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
 
+  <link rel="stylesheet" href="demo.css">
 
+  <link rel="stylesheet" href="iconfont.css">
 
+  <script src="iconfont.js"></script>
 
+  <!-- jQuery -->
 
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
 
+  <!-- 代码高亮 -->
 
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
 
+  <style>
 
+    .main .logo {
 
+      margin-top: 0;
 
+      height: auto;
 
+    }
 
+
 
+    .main .logo a {
 
+      display: flex;
 
+      align-items: center;
 
+    }
 
+
 
+    .main .logo .sub-title {
 
+      margin-left: 0.5em;
 
+      font-size: 22px;
 
+      color: #fff;
 
+      background: linear-gradient(-45deg, #3967FF, #B500FE);
 
+      -webkit-background-clip: text;
 
+      -webkit-text-fill-color: transparent;
 
+    }
 
+  </style>
 
+</head>
 
+<body>
 
+  <div class="main">
 
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
 
+      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
 
+      
+    </a></h1>
 
+    <div class="nav-tabs">
 
+      <ul id="tabs" class="dib-box">
 
+        <li class="dib active"><span>Unicode</span></li>
 
+        <li class="dib"><span>Font class</span></li>
 
+        <li class="dib"><span>Symbol</span></li>
 
+      </ul>
 
+      
+      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3239448" target="_blank" class="nav-more">查看项目</a>
 
+      
+    </div>
 
+    <div class="tab-container">
 
+      <div class="content unicode" style="display: block;">
 
+          <ul class="icon_lists dib-box">
 
+          
+            <li class="dib">
 
+              <span class="icon iconfont">&#xe60d;</span>
 
+                <div class="name">定位</div>
 
+                <div class="code-name">&amp;#xe60d;</div>
 
+              </li>
 
+          
+            <li class="dib">
 
+              <span class="icon iconfont">&#xe614;</span>
 
+                <div class="name">时间</div>
 
+                <div class="code-name">&amp;#xe614;</div>
 
+              </li>
 
+          
+            <li class="dib">
 
+              <span class="icon iconfont">&#xe8c3;</span>
 
+                <div class="name">电话</div>
 
+                <div class="code-name">&amp;#xe8c3;</div>
 
+              </li>
 
+          
+          </ul>
 
+          <div class="article markdown">
 
+          <h2 id="unicode-">Unicode 引用</h2>
 
+          <hr>
 
+
 
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
 
+          <ul>
 
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
 
+            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
 
+          </ul>
 
+          <blockquote>
 
+            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
 
+          </blockquote>
 
+          <p>Unicode 使用步骤如下：</p>
 
+          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
 
+<pre><code class="language-css"
 
+>@font-face {
 
+  font-family: 'iconfont';
 
+  src: url('iconfont.woff2?t=1646983078670') format('woff2'),
 
+       url('iconfont.woff?t=1646983078670') format('woff'),
 
+       url('iconfont.ttf?t=1646983078670') format('truetype');
 
+}
 
+</code></pre>
 
+          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
 
+<pre><code class="language-css"
 
+>.iconfont {
 
+  font-family: "iconfont" !important;
 
+  font-size: 16px;
 
+  font-style: normal;
 
+  -webkit-font-smoothing: antialiased;
 
+  -moz-osx-font-smoothing: grayscale;
 
+}
 
+</code></pre>
 
+          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
 
+<pre>
 
+<code class="language-html"
 
+>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
 
+</code></pre>
 
+          <blockquote>
 
+            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
 
+          </blockquote>
 
+          </div>
 
+      </div>
 
+      <div class="content font-class">
 
+        <ul class="icon_lists dib-box">
 
+          
+          <li class="dib">
 
+            <span class="icon iconfont icon-dingwei"></span>
 
+            <div class="name">
 
+              定位
 
+            </div>
 
+            <div class="code-name">.icon-dingwei
 
+            </div>
 
+          </li>
 
+          
+          <li class="dib">
 
+            <span class="icon iconfont icon-shijian"></span>
 
+            <div class="name">
 
+              时间
 
+            </div>
 
+            <div class="code-name">.icon-shijian
 
+            </div>
 
+          </li>
 
+          
+          <li class="dib">
 
+            <span class="icon iconfont icon-dianhua"></span>
 
+            <div class="name">
 
+              电话
 
+            </div>
 
+            <div class="code-name">.icon-dianhua
 
+            </div>
 
+          </li>
 
+          
+        </ul>
 
+        <div class="article markdown">
 
+        <h2 id="font-class-">font-class 引用</h2>
 
+        <hr>
 
+
 
+        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
 
+        <p>与 Unicode 使用方式相比，具有如下特点：</p>
 
+        <ul>
 
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
 
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
 
+        </ul>
 
+        <p>使用步骤如下：</p>
 
+        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
 
+<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
 
+</code></pre>
 
+        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
 
+<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
 
+</code></pre>
 
+        <blockquote>
 
+          <p>"
 
+            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
 
+        </blockquote>
 
+      </div>
 
+      </div>
 
+      <div class="content symbol">
 
+          <ul class="icon_lists dib-box">
 
+          
+            <li class="dib">
 
+                <svg class="icon svg-icon" aria-hidden="true">
 
+                  <use xlink:href="#icon-dingwei"></use>
 
+                </svg>
 
+                <div class="name">定位</div>
 
+                <div class="code-name">#icon-dingwei</div>
 
+            </li>
 
+          
+            <li class="dib">
 
+                <svg class="icon svg-icon" aria-hidden="true">
 
+                  <use xlink:href="#icon-shijian"></use>
 
+                </svg>
 
+                <div class="name">时间</div>
 
+                <div class="code-name">#icon-shijian</div>
 
+            </li>
 
+          
+            <li class="dib">
 
+                <svg class="icon svg-icon" aria-hidden="true">
 
+                  <use xlink:href="#icon-dianhua"></use>
 
+                </svg>
 
+                <div class="name">电话</div>
 
+                <div class="code-name">#icon-dianhua</div>
 
+            </li>
 
+          
+          </ul>
 
+          <div class="article markdown">
 
+          <h2 id="symbol-">Symbol 引用</h2>
 
+          <hr>
 
+
 
+          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
 
+            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
 
+          <ul>
 
+            <li>支持多色图标了，不再受单色限制。</li>
 
+            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
 
+            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
 
+            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
 
+          </ul>
 
+          <p>使用步骤如下：</p>
 
+          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
 
+<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
 
+</code></pre>
 
+          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
 
+<pre><code class="language-html">&lt;style&gt;
 
+.icon {
 
+  width: 1em;
 
+  height: 1em;
 
+  vertical-align: -0.15em;
 
+  fill: currentColor;
 
+  overflow: hidden;
 
+}
 
+&lt;/style&gt;
 
+</code></pre>
 
+          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
 
+<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
 
+  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
 
+&lt;/svg&gt;
 
+</code></pre>
 
+          </div>
 
+      </div>
 
+
 
+    </div>
 
+  </div>
 
+  <script>
 
+  $(document).ready(function () {
 
+      $('.tab-container .content:first').show()
 
+
 
+      $('#tabs li').click(function (e) {
 
+        var tabContent = $('.tab-container .content')
 
+        var index = $(this).index()
 
+
 
+        if ($(this).hasClass('active')) {
 
+          return
 
+        } else {
 
+          $('#tabs li').removeClass('active')
 
+          $(this).addClass('active')
 
+
 
+          tabContent.hide().eq(index).fadeIn()
 
+        }
 
+      })
 
+    })
 
+  </script>
 
+</body>
 
+</html>

+ 27 - 0
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.css
Zobrazit soubor 

@@ -0,0 +1,27 @@
 
+@font-face {
 
+  font-family: "iconfont"; /* Project id 3239448 */
 
+  src: url('iconfont.woff2?t=1646983078670') format('woff2'),
 
+       url('iconfont.woff?t=1646983078670') format('woff'),
 
+       url('iconfont.ttf?t=1646983078670') format('truetype');
 
+}
 
+
 
+.iconfont {
 
+  font-family: "iconfont" !important;
 
+  font-size: 16px;
 
+  font-style: normal;
 
+  -webkit-font-smoothing: antialiased;
 
+  -moz-osx-font-smoothing: grayscale;
 
+}
 
+
 
+.icon-dingwei:before {
 
+  content: "\e60d";
 
+}
 
+
 
+.icon-shijian:before {
 
+  content: "\e614";
 
+}
 
+
 
+.icon-dianhua:before {
 
+  content: "\e8c3";
 
+}
 
+

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 1 - 0
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.js


+ 30 - 0
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.json
Zobrazit soubor 

@@ -0,0 +1,30 @@
 
+{
 
+  "id": "3239448",
 
+  "name": "马边",
 
+  "font_family": "iconfont",
 
+  "css_prefix_text": "icon-",
 
+  "description": "",
 
+  "glyphs": [
 
+    {
 
+      "icon_id": "705663",
 
+      "name": "定位",
 
+      "font_class": "dingwei",
 
+      "unicode": "e60d",
 
+      "unicode_decimal": 58893
 
+    },
 
+    {
 
+      "icon_id": "8019605",
 
+      "name": "时间",
 
+      "font_class": "shijian",
 
+      "unicode": "e614",
 
+      "unicode_decimal": 58900
 
+    },
 
+    {
 
+      "icon_id": "11372759",
 
+      "name": "电话",
 
+      "font_class": "dianhua",
 
+      "unicode": "e8c3",
 
+      "unicode_decimal": 59587
 
+    }
 
+  ]
 
+}

binární
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.ttf
Zobrazit soubor


binární
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.woff
Zobrazit soubor


binární
src/assets/iconfont/download/font_3239448_8gtvjrnc6yt/iconfont.woff2
Zobrazit soubor


+ 1 - 1
src/layout/components/AppMain.vue
Zobrazit soubor 

@@ -43,7 +43,7 @@ export default {
 
   min-height: calc(100vh - 64px);
 
   width: 100%;
 
   overflow: hidden;
 
-  background: #ffffff;
 
+  background: #e4f1fb;
 
   /* padding: 10px 20px; */
 
 }
 
 .fixed-header + .app-main {

+ 24 - 9
src/layout/components/Footer/index.vue
Zobrazit soubor 

@@ -1,17 +1,21 @@
 
 <template>
 
   <div class="footer">
 
     <div class="container">
 
+      <ul class="foot_top">
 
+        <span>马边彝族自治县自来水有限责任公司</span>
 
+      </ul>
 
       <ul>
 
-        <span> 地址 :</span> <span>马边彝族自治县民建镇东光大道435号</span> 
+        <span> 地址 ：</span><span>马边彝族自治县民建镇东光大道435号</span> 
         
       </ul>
 
       <ul>
 
-        <span> 电话：</span><span>4521369</span>
 
-        <span> 版权所有：</span> <span>马边彝族自治县自来水有限责任公司</span>
 
+        <span> 电话 ：</span><span>4521369</span>
 
+        
       </ul>
 
-      <ul>
 
-        <span>蜀ICP备19016077号-1 </span>                
-        <span>  技术支持：</span> <span>成都同飞科技责任有限公司</span>
 
+      <ul class="foot_bottom">
 
+        <span> 版权所有 ：</span> <span>马边彝族自治县自来水有限责任公司&nbsp;&nbsp; </span>
 
+        <span>  蜀ICP备19016077号-1&nbsp;&nbsp;&nbsp;&nbsp;  </span>                
+        <span>&nbsp;&nbsp;  技术支持 ：</span> <span>同飞科技</span>
 
       </ul>
 
     </div>
 
   </div>
 
@@ -37,14 +41,25 @@ export default {
 
 .footer {
 
     width: 100%;
 
     min-width: 1200px;
 
-    height: 130px;
 
-    background: #ddecf9;
 
+    height: 165px;
 
+    background: #01254d;
 
     position: relative;
 
     padding: 10px 0;
 
+    color: #eff0f1;
 
+    font-size: 14px;
 
   .container{
 
-    width: 1200px;
 
+    width: 900px;
 
     margin: 0 auto;
 
     position: relative;
 
+    .foot_top{
 
+      font-size: 20px;
 
+      margin: 10px 0 20px;
 
+    }
 
+    .foot_bottom{
 
+      margin: 25px 0 0;
 
+      text-align: center;
 
+      font-size: 12px;
 
+    }
 
   }
 
 }
 
 </style>

+ 4 - 4
src/views/currentSystem/InfoDisclosure/openWork.vue
Zobrazit soubor 

@@ -52,16 +52,16 @@ ul{
 
         display: flex;
 
         justify-content: space-between;
 
         align-items: center;
 
-        font-size: 28px;
 
+        font-size: 20px;
 
         position: relative;
 
         margin: 20px 0 20px 10px;
 
         .l::before{
 
             content: '';
 
             position: absolute;
 
             left: -8px;
 
-            top: 12px;
 
-            width: 6px;
 
-            height: 6px;
 
+            top: 8px;
 
+            width: 4px;
 
+            height: 4px;
 
             background: #000;
 
             border-radius: 50%;
 
         }

+ 37 - 21
src/views/currentSystem/companyDynamics/companyDynamics.vue
Zobrazit soubor 

@@ -10,7 +10,9 @@
 
           </p>
 
           <p>2022-03-08</p>
 
         </div>
 
-        <a href="#">阅读更多></a>
 
+        <div class="r">
 
+          <a href="#">阅读更多></a>
 
+        </div>
 
       </li>
 
       <li>
 
         <img src="./images/u15.svg" alt="" />
 
@@ -21,7 +23,9 @@
 
           </p>
 
           <p>2022-03-08</p>
 
         </div>
 
-        <a href="#">阅读更多></a>
 
+        <div class="r">
 
+          <a href="#">阅读更多></a>
 
+        </div>
 
       </li>
 
     </ul>
 
     <Pagination />
 
@@ -29,24 +33,22 @@
 
 </template>
 
 
 <script>
 
-import Pagination from '@/components/Pagination/index.vue'
 
+import Pagination from "@/components/Pagination/index.vue";
 
 export default {
 
-  components:{
 
-    Pagination
 
+  components: {
 
+    Pagination,
 
   },
 
-  components: {},
 
   data() {
 
-    return {
 
-    };
 
+    return {};
 
+  },
 
+  methods: {
 
+    handleSizeChange(val) {
 
+      console.log(`每页 ${val} 条`);
 
+    },
 
+    handleCurrentChange(val) {
 
+      console.log(`当前页: ${val}`);
 
+    },
 
   },
 
-  methods:{
 
-     handleSizeChange(val) {
 
-        console.log(`每页 ${val} 条`);
 
-      },
 
-      handleCurrentChange(val) {
 
-        console.log(`当前页: ${val}`);
 
-      }
 
-  }
 
 };
 
 </script>
 
  
@@ -62,14 +64,28 @@ li {
 
   display: flex;
 
   justify-content: space-between;
 
   align-items: center;
 
-  margin: 20px 0;
 
+  .r {
 
+    height: 170px;
 
+    line-height: 340px;
 
+  }
 
+  a {
 
+    color: rgb(82, 168, 247);
 
+  }
 
 }
 
 .content {
 
-  width: 60%;
 
-  margin: 0 20px;
 
+  width: 54%;
 
+  // margin: 0 20px;
 
+  p {
 
+    font-size: 20px;
 
+    color: #999;
 
+    display: -webkit-box;
 
+    -webkit-box-orient: vertical;
 
+    -webkit-line-clamp: 2;
 
+    overflow: hidden;
 
+  }
 
 }
 
-h3,
 
-a {
 
+h3 {
 
   color: rgb(82, 168, 247);
 
+  font-size: 24px;
 
 }
 
 </style>

+ 2 - 6
src/views/currentSystem/companyProfile/companyProfile.vue
Zobrazit soubor 

@@ -3,7 +3,7 @@
 
     <!-- 公司简介 -->
 
     <h2>公司简介</h2>
 
     <div class="content">
 
-      马边彝族自来水公司是......
 
+      马边彝族自治县自来水有限责任公司是......
 
     </div>
 
   </div>
 
 </template>
 
@@ -12,13 +12,8 @@
 
 export default {
 
   data() {
 
     return {
 
-      dic: null,
 
-      equipList: [], //设备列表
 
     };
 
   },
 
-  created() {
 
-    console.log('创建列表');
 
-  },
 
   methods: {
 
   }
 
 };
 
@@ -30,5 +25,6 @@ export default {
 
   position: absolute;
 
   top: 43px;
 
   bottom: 0;
 
+  padding-left: 30px;
 
 }
 
 </style>

+ 5 - 8
src/views/currentSystem/companyProfile/developmentHistory.vue
Zobrazit soubor 

@@ -1,23 +1,19 @@
 
 <template>
 
   <div class="t-container">
 
     <!-- 发展历程 -->
 
-    发展历程
 
+    <h2>发展历程</h2>
 
+    <div class="content">
 
+      马边彝族自治县自来水有限责任公司是......
 
+    </div>
 
   </div>
 
 </template>
 
 
 <script>
 
-import { getUserList } from '@/api/base';
 
-import { excelUpload, excelDownload } from '@/api/common';
 
 export default {
 
   data() {
 
     return {
 
-      dic: null,
 
-      equipList: [], //设备列表
 
     };
 
   },
 
-  created() {
 
-    console.log('创建列表');
 
-  },
 
   methods: {
 
   }
 
 };
 
@@ -29,5 +25,6 @@ export default {
 
   position: absolute;
 
   top: 43px;
 
   bottom: 0;
 
+  padding-left: 30px;
 
 }
 
 </style>

+ 14 - 5
src/views/currentSystem/companyProfile/leaderProfile.vue
Zobrazit soubor 

@@ -1,21 +1,30 @@
 
 <template>
 
   <div class="t-container">
 
     <!-- 领导简介 -->
 
-    领导简介
 
+    <h2>领导简介</h2>
 
+    <div class="content">
 
+      马边彝族自治县自来水有限责任公司是......
 
+    </div>
 
   </div>
 
 </template>
 
 
 <script>
 
 export default {
 
-
 
-}
 
+  data() {
 
+    return {
 
+    };
 
+  },
 
+  methods: {
 
+  }
 
+};
 
 </script>
 
 
-<style>
 
+<style lang="scss" scoped>
 
 .t-container {
 
   width: 100%;
 
   position: absolute;
 
   top: 43px;
 
   bottom: 0;
 
+  padding-left: 30px;
 
 }
 
-</style>
 
+</style>

+ 6 - 9
src/views/currentSystem/companyProfile/organization.vue
Zobrazit soubor 

@@ -1,23 +1,19 @@
 
 <template>
 
   <div class="t-container">
 
-    <!-- 组织结构 -->
 
-    组织结构
 
+    <!-- 结构简介 -->
 
+    <h2>结构简介</h2>
 
+    <div class="content">
 
+      马边彝族自治县自来水有限责任公司是......
 
+    </div>
 
   </div>
 
 </template>
 
 
 <script>
 
-import { getUserList } from '@/api/base';
 
-import { excelUpload, excelDownload } from '@/api/common';
 
 export default {
 
   data() {
 
     return {
 
-      dic: null,
 
-      equipList: [], //设备列表
 
     };
 
   },
 
-  created() {
 
-    console.log('创建列表');
 
-  },
 
   methods: {
 
   }
 
 };
 
@@ -29,5 +25,6 @@ export default {
 
   position: absolute;
 
   top: 43px;
 
   bottom: 0;
 
+  padding-left: 30px;
 
 }
 
 </style>

binární
src/views/currentSystem/dashboard/images/linshi.png
Zobrazit soubor


binární
src/views/currentSystem/dashboard/images/map.png
Zobrazit soubor


binární
src/views/currentSystem/dashboard/images/u4.jpg
Zobrazit soubor


+ 198 - 87
src/views/currentSystem/dashboard/index.vue
Zobrazit soubor 

@@ -2,34 +2,38 @@
 
   <div class="app-container">
 
     <!-- 首页 -->
 
     <div class="block">
 
-      <el-carousel trigger="click" autoplay :interval="3000" arrow="never">
 
+      <el-carousel
 
+        height="360px"
 
+        trigger="click"
 
+        autoplay
 
+        :interval="3000"
 
+        arrow="never"
 
+      >
 
         <el-carousel-item v-for="item in urlList" :key="item.id">
 
-          <img :src="item.bannerUrl" alt="" width="100%" />
 
+          <img :src="item.bannerUrl" alt="" width="100%" height="100%" />
 
         </el-carousel-item>
 
       </el-carousel>
 
     </div>
 
 
-    <div class="announce">
 
+    <div class="announce banxin">
 
       <div class="announceL">
 
-        <div class="box"></div>
 
+        <div class="box">
 
+          <img src="./images/map.png" alt="" width="420px" height="260px">
 
+        </div>
 
       </div>
 
       <div class="announceR">
 
         <el-tabs v-model="activeName" @tab-click="handleClick" stretch>
 
-          <el-tab-pane
 
-            label="服务网点"
 
-            name="first"
 
-            :style="{ fontSize: '25px' }"
 
-          >
 
+          <el-tab-pane label="服务网点" name="first">
 
             <p>
 
-              <span class="iconfont iconwushuichulichang2"> </span>
 
+              <span class="iconfont icon-dingwei1"> </span>
 
               马边彝族自治县民建镇东光大道435号
 
             </p>
 
             <p>
 
-              <span class="iconfont iconcbjhgl1"> </span>
 
+              <span class="iconfont icon-shijian"> </span>
 
               周一至周六8:30—17:00（法定节假日除外）
 
             </p>
 
             <p class="p3">
 
-              <span class="iconfont iconhujiao"></span> 028-2565458
 
+              <span class="iconfont icon-dianhua">  服务电话：</span> 028-2565458
 
             </p>
 
           </el-tab-pane>
 
           <el-tab-pane label="停水通知" name="second"
 
@@ -38,39 +42,60 @@
 
         </el-tabs>
 
       </div>
 
     </div>
 
-    <div class="outLink">https://www.h2o-china.com</div>
 
-    <div class="outWork">
 
+    <div class="outLink banxin">
 
+      <p>欢迎进入中国水协官方网站</p>
 
+      <span><a href="https://www.h2o-china.com">点击前往 >></a></span>
 
+    </div>
 
+    <div class="outWork banxin">
 
       <div class="outWorkL">
 
-        <h3>--------- 信息公开 ---------</h3>
 
+        <div class="outWorkL_top">
 
+          <p>信息公开</p>
 
+        </div>
 
         <div class="outWorkL_down">
 
           <div class="outWorkL_down_l">
 
-            <div class="outLbox">公司动态</div>
 
-            <div class="outLbox">政策法规</div>
 
-            <div class="outLbox">办事公开</div>
 
+            <div :class="ishowNews===1?'outLbox active2':'outLbox'" @click="componyFn1">公司动态</div>
 
+            <div :class="ishowNews===2?'outLbox active2':'outLbox'" @click="componyFn2">政策法规</div>
 
+            <div :class="ishowNews===3?'outLbox active2':'outLbox'" @click="componyFn3">办事公开</div>
 
           </div>
 
           <div class="outWorkL_down_r">
 
-            <ul>
 
-            <li>
 
+            <ul v-if="ishowNews===1">
 
+              <li>
 
                 <div class="l">20220308服务公告</div>
 
-                <div class="r">2022.03.08</div>
 
-            </li>
 
-            <li>
 
+                <div class="r">2022-03-08</div>
 
+              </li>
 
+              <li>
 
+                <div class="l">20220308服务公告停水通知人民都应该知道的事儿</div>
 
+                <div class="r">2022-03-08</div>
 
+              </li>
 
+              <li>
 
                 <div class="l">20220308服务公告</div>
 
-                <div class="r">2022.03.08</div>
 
-            </li>
 
-            <li>
 
-                <div class="l">20220308服务公告</div>
 
-                <div class="r">2022.03.08</div>
 
-            </li>
 
-            <li>
 
-                <div class="l">20220308服务公告</div>
 
-                <div class="r">2022.03.08</div>
 
-            </li>
 
-        </ul>
 
+                <div class="r">2022-03-08</div>
 
+              </li>
 
+            </ul>
 
+            <ul v-else-if="ishowNews===2">
 
+              <li>
 
+                <div class="l">20220308政策法规</div>
 
+                <div class="r">2022-03-08</div>
 
+              </li>
 
+            </ul>
 
+            <ul v-else>
 
+              <li>
 
+                <div class="l">20220308办事公开</div>
 
+                <div class="r">2022-03-08</div>
 
+              </li>
 
+            </ul>
 
           </div>
 
         </div>
 
       </div>
 
-      <div class="outWorkR"></div>
 
+      <div class="outWorkR">
 
+        <div class="Rtop">
 
+          <p>微信公众号</p>
 
+        </div>
 
+        <div class="Rbottom">
 
+          <img src="./images/linshi.png" alt="" width="170px">
 
+          <p>自助报装、缴费、查费、维修，一站式服务。</p>
 
+        </div>
 
+      </div>
 
     </div>
 
   </div>
 
 </template>
 
@@ -85,10 +110,12 @@ export default {
 
     return {
 
       urlList: [
 
         { bannerUrl: require("./images/u6.jpg"), id: 1 },
 
-        { bannerUrl: require("./images/u6.jpg"), id: 2 },
 
+        { bannerUrl: require("./images/u4.jpg"), id: 2 },
 
         { bannerUrl: require("./images/u6.jpg"), id: 3 },
 
       ],
 
+      wxUrl:require('./images/linshi.png'),
 
       activeName: "first",
 
+      ishowNews:1
 
     };
 
   },
 
   computed: {
 
@@ -98,6 +125,15 @@ export default {
 
   },
 
   mounted() {},
 
   methods: {
 
+    componyFn1(){
 
+      this.ishowNews=1
 
+    },
 
+    componyFn2(){
 
+      this.ishowNews=2
 
+    },
 
+    componyFn3(){
 
+      this.ishowNews=3
 
+    },
 
     handleClick(tab, event) {
 
       console.log(tab, event);
 
     },
 
@@ -110,103 +146,178 @@ export default {
 
   width: 100%;
 
   background-size: 100% 100%;
 
   padding: 0;
 
+  background: #e4f1fb;
 
+
 
   // margin: 90px 0 180px;
 
 }
 
 .announce {
 
   display: flex;
 
   justify-content: space-between;
 
-  // align-items: center;
 
-  margin-top: 40px;
 
-  padding: 0 30px;
 
+  margin: 20px auto 0;
 
+  background: #fff;
 
+  padding: 18px;
 
+  overflow: hidden;
 
 }
 
 .announceL {
 
-  flex: 1;
 
-  height: 400px;
 
-  border: 1px solid #000;
 
+  width: 50%;
 
+  height: 264px;
 
 }
 
 .announceR {
 
-  width: 60%;
 
-  font-size: 28px;
 
+  width: 50%;
 
+  font-size: 14px;
 
   margin-left: 30px;
 
-  .p3 {
 
-    font-size: 69px;
 
-    span {
 
-      font-size: 69px;
 
+  p {
 
+    margin: 0;
 
+    height: 50px;
 
+    line-height: 50px;
 
+    .iconfont{
 
+      font-size: 18px;
 
     }
 
   }
 
+  .p3{
 
+    font-size: 24px;
 
+    color: #005fb6;
 
+    margin-top: 20px;
 
+  }
 
+  /deep/.is-active {
 
+    background: #005fb6;
 
+    color: #fff;
 
+  }
 
+}
 
+.el-tabs .el-tab-pane {
 
+  padding: 14px;
 
 }
 
 /deep/.el-tabs__item {
 
-  font-size: 28px;
 
+  font-size: 16px;
 
+  background: #dbe8f4;
 
+  color: #005fb6;
 
 }
 
+// /deep/.el-tabs__active-bar,.is-top{
 
+//   width: 0;
 
+// }
 
 .outLink {
 
-  font-size: 26px;
 
-  height: 127px;
 
-  line-height: 127px;
 
+  font-size: 20px;
 
+  height: 108px;
 
   text-align: center;
 
-  margin: 20px 30px;
 
-  border: 1px solid #000;
 
-}
 
-p {
 
-  margin-top: 40px;
 
+  margin: 20px auto;
 
+  background: #1b7cc1;
 
+  color: #fff;
 
+  p{
 
+    height: 60px;
 
+    line-height: 60px;
 
+    margin: 0;
 
+  }
 
+  span{
 
+    padding: 6px 12px;
 
+    border: 1px solid #fff;
 
+    color: #fff;
 
+    font-size: 14px;
 
+    border-radius: 20px;
 
+  }
 
 }
 
 span {
 
   color: #333;
 
-  font-size: 26px;
 
+  font-size: 14px;
 
 }
 
+
 
 .outWork {
 
   display: flex;
 
   justify-content: space-between;
 
   align-items: center;
 
-  .outWorkL{
 
-    width: 62%;
 
-    text-align: center;
 
-    h3{
 
-      font-size: 28px;
 
+  margin: 0 auto 20px;
 
+  .outWorkL {
 
+    width: 64%;
 
+    height: 300px;
 
+    background: #fff;
 
+    padding: 4px 10px 10px;
 
+    .outWorkL_top {
 
+      border-bottom: 1px solid #ccc;
 
+      p {
 
+        color: #000;
 
+        font-size: 16px;
 
+        margin: 0;
 
+        height: 30px;
 
+        line-height: 30px;
 
+      }
 
     }
 
-    .outWorkL_down{
 
+    .outWorkL_down {
 
       display: flex;
 
       justify-content: space-between;
 
-      .outWorkL_down_l{
 
-        .outLbox{
 
-          width: 350px;
 
-          height: 85px;
 
-          background-color: rgba(124, 163, 255, 1);
 
+      .outWorkL_down_l {
 
+        .outLbox {
 
+          width: 110px;
 
+          height: 40px;
 
+          background-color: #dbe8f4;
 
           margin: 20px 20px;
 
-          border: 1px solid #000;
 
-          border-radius: 10px;
 
-          line-height: 85px;
 
-          font-size: 26px;
 
-          color: #fff;
 
+          border-radius: 5px;
 
+          line-height: 40px;
 
+          font-size: 16px;
 
+          color: #005fb6;
 
           text-align: center;
 
         }
 
+        .active2 {
 
+          background: #005fb6;
 
+          color: #fff;
 
+        }
 
       }
 
-      .outWorkL_down_r{
 
+      .outWorkL_down_r {
 
         flex: 1;
 
-        li{
 
-          height: 50px;
 
-          line-height: 50px;
 
-          font-size: 26px;
 
+        li {
 
+          height: 30px;
 
+          line-height: 30px;
 
+          font-size: 14px;
 
           display: flex;
 
           justify-content: space-between;
 
           align-items: center;
 
           position: relative;
 
-          .l::before{
 
-            content: '';
 
+          .l {
 
+            width: 240px;
 
+            overflow: hidden;
 
+            text-overflow: ellipsis;
 
+            white-space: nowrap;
 
+          }
 
+          .l::before {
 
+            content: "";
 
             position: absolute;
 
             left: -12px;
 
-            top: 20px;
 
+            top: 10px;
 
             width: 6px;
 
             height: 6px;
 
-            background: #000;
 
+            background: #005fb6;
 
             border-radius: 50%;
 
-        }
 
+          }
 
         }
 
       }
 
     }
 
   }
 
-  .outWorkR{
 
-
 
+  .outWorkR {
 
+    height: 300px;
 
+    flex: 1;
 
+    padding: 4px 10px 10px;
 
+    background: #fff;
 
+    margin-left: 10px;
 
+    .Rtop {
 
+      border-bottom: 1px solid #ccc;
 
+      p {
 
+        color: #000;
 
+        font-size: 16px;
 
+        margin: 0;
 
+        height: 30px;
 
+        line-height: 30px;
 
+      }
 
+    }
 
+    .Rbottom {
 
+      height: 196px;
 
+      width: 100%;
 
+      text-align: center;
 
+      font-size: 14px;
 
+      img{
 
+        margin-top: 20px;
 
+      }
 
+    }
 
   }
 
 }
 
-
 
+.banxin {
 
+  width: 900px;
 
+}
 
 </style>

+ 1 - 1
src/views/currentSystem/hotline/hotline.vue
Zobrazit soubor 

@@ -36,7 +36,7 @@ export default {
 
 .content{
 
     width: 60%;
 
     text-align: center;
 
-    font-size: 26px;
 
+    font-size: 24px;
 
 }
 
 
 </style>