首页，功能展示

src/dashoo.cn/frontend_web/src/pages/index.vue

@@ -1,19 +1,106 @@
 <template>
-  <div style="overflow-y: auto">
-    <el-row :gutter="80" style="margin-left: 80px; margin-right: 80px; ">
-      <el-col :span="8" v-for="(o, index) in 4" :key="o">
-        <el-card :body-style="{ padding: '0px' }" style="margin-top: 40px">
-          <img src="https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1554721420&di=d2814210f88fe5afc5f5f4f8b1d9ab1c&src=http://00.minipic.eastday.com/20170411/20170411212923_f3b93bece00e4178f3bc684240278d9a_5.jpeg" class="image">
-          <div style="padding: 14px;">
-            <span>功能业务</span>
+  <div style="width: 100%; overflow-y: auto">
+    <div style="width: 1100px; margin-left: 40px; padding: 10px">
+      <el-row :gutter="40">
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy9.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">准入申请</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button"> | 物资类</el-button>
+                <el-button type="text" class="button"> | 技术服务类</el-button>
+                <el-button type="text" class="button">基建类</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy7.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">增项申请</span>
+            </div>
+            <div class="bottom clearfix">
+              <el-button type="text" class="button"> | 物资类</el-button>
+              <el-button type="text" class="button"> | 技术服务类</el-button>
+              <el-button type="text" class="button">基建类</el-button>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy6.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">年审</span>
+            </div>
             <div class="bottom clearfix">
-              <time class="time">{{ currentDate }}</time>
-              <el-button type="text" class="button">操作按钮</el-button>
+              <el-button type="text" class="button">年审列表</el-button>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <el-row :gutter="40" style="margin-top: 20px">
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy2.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">资质变更</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">资质变更</el-button>
+              </div>
             </div>
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy7.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">信息变更</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">信息变更</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy4.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">在线缴费</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">缴费</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <el-row :gutter="40" style="margin-top: 20px">
+        <el-col :span="8">
+          <el-card style="margin-bottom: 20px">
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy5.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">业务查询</span>
+              <div class="bottom clearfix">
+                <span>报表及图表的查询功能</span>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card style="margin-bottom: 20px">
+            <img style="height: 130px" src="http://www.ihaier.com/public/web/images/hyqy6.png" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">资质管理</span>
+              <div class="bottom clearfix">
+                <span>资质管理的统一管理功能</span>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+    </div>
+
   </div>
 </template>