新增阳光村务页面

src/permission.js

@@ -78,10 +78,13 @@ const whiteList = [
   '/sunVillage/financial/products', //惠民金融 - 理财产品
   '/sunVillage/financial/loan', //惠民金融 - 理财产品
   '/sunVillage/injoint', //三资公开-财务公开
+  '/sunVillage/injoint/details',//三资公开-财务公开-详情
   '/sunVillage/injoint/meansOf', //三资公开-清产核资
   '/sunVillage/injoint/meansOf_desc', //三资公开-清产核资-详情页
   '/sunVillage/injoint/assetsPublic',  //三资公开-资产公开
+  '/sunVillage/injoint/assetsPublic_desc', //三资公开-资产公开-详情
   '/sunVillage/injoint/publicResources', //三资公开-资源公开
+  '/sunVillage/injoint/publicResources_desc', //三资公开-资源公开-详情
   //阳光村务公众号 -- 待删
 ]
 

src/router/index.js

@@ -2545,6 +2545,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/index'], resolve)
   },
+  {
+    path: '/sunVillage/injoint/details',
+    name: 'sunVillageInjointDetails',
+    meta: {
+      title: '财务公开', //财务公开
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/details'], resolve)
+  },
   {
     path: '/sunVillage/injoint/meansOf',
     name: 'sunVillageInjointMeansOf',
@@ -2558,7 +2567,7 @@ export const constantRoutes = [
     path: '/sunVillage/injoint/meansOf_desc',
     name: 'sunVillageInjointMeansOfDesc',
     meta: {
-      title: '三资公开', //清产核资 --详情页
+      title: '清产核资', //清产核资 --详情页
       hidden: true,
     },
     component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/meansOf_desc'], resolve)
@@ -2572,6 +2581,15 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/assetsPublic'], resolve)
   },
+  {
+    path: '/sunVillage/injoint/assetsPublic_desc',
+    name: 'sunVillageAssetsPublicDesc',
+    meta: {
+      title: '资产公开', //资产公开
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/assetsPublic_desc'], resolve)
+  },
   {
     path: '/sunVillage/injoint/publicResources',
     name: 'sunVillagePublicResources',
@@ -2580,6 +2598,15 @@ export const constantRoutes = [
       hidden: true,
     },
     component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/publicResources'], resolve)
+  },
+  {
+    path: '/sunVillage/injoint/publicResources_desc',
+    name: 'sunVillagePublicResourcesDesc',
+    meta: {
+      title: '资源公开', //资源公开
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/sunVillage/dynamic/injoint/publicResources_desc'], resolve)
   }
 
 ];

src/views/sunVillage/dynamic/injoint/assetsPublic.vue

@@ -21,13 +21,13 @@
           <div class="flex f4">构建时间</div>
         </div>
         <div class="tbody_main">
-          <div class="item_list">
+          <div class="item_list" @click="skip('/sunVillage/injoint/assetsPublic_desc')">
             <div class="flex f1">18号大楼1233</div>
             <div class="flex f2">1</div>
             <div class="flex f3">经营</div>
             <div class="flex f4">2022/02/25</div>
           </div>
-          <div class="item_list">
+          <div class="item_list" @click="skip('/sunVillage/injoint/assetsPublic_desc')">
             <div class="flex f1">18号大楼1233</div>
             <div class="flex f2">1</div>
             <div class="flex f3">经营</div>

src/views/sunVillage/dynamic/injoint/assetsPublic_desc.vue

@@ -0,0 +1,173 @@
+<template>
+  <div class="home_wrapper">
+    <header-nav :headings="headingsTitle" :currentNav="1"></header-nav>
+    <div class="assetsPublic_main">
+      <div class="title_main">
+        <div class="subtitle">资产信息</div>
+      </div>
+      <div class="form_main">
+        <div class="form_item">
+          <div class="v_title">资产名称</div>
+          <div class="v_content single">办公电脑</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">数量</div>
+          <div class="v_content single">20</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">原值</div>
+          <div class="v_content single">16000原</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">经营状态</div>
+          <div class="v_content single">经营</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">构建时间</div>
+          <div class="v_content single">
+            <i class="icon_date"></i> 2022-02-28
+          </div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">使用情况</div>
+          <div class="v_content single">正常</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">附件</div>
+          <div class="v_content multiple">
+            <ul class="download_list">
+              <li>2022一季度村财务报表.xlsx</li>
+              <li>2022一季度村财务报表.xlsx</li>
+              <li>2022一季度村财务报表.xlsx</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+      <div class="title_main">
+        <div class="subtitle">经营属性</div>
+      </div>
+      <div class="form_main">
+        <div class="form_item">
+          <div class="v_title">资产名称</div>
+          <div class="v_content single">办公电脑</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<style scoped lang="scss">
+.home_wrapper {
+  width: 100%;
+  min-height: 100vh;
+  background: #fff;
+  .assetsPublic_main {
+    margin: 0 24px;
+    .title_main {
+      height: 50px;
+      position: relative;
+      margin-top: 20px;
+      &::before {
+        width: 8px;
+        height: 50px;
+        background: #66ccff;
+        border-radius: 8px;
+        position: absolute;
+        left: 0;
+        top: 0;
+        z-index: 2;
+        content: " ";
+      }
+      &::after {
+        width: 100%;
+        height: 1px;
+        background: #e5e5e5;
+        position: absolute;
+        left: 0;
+        top: 25px;
+        content: " ";
+      }
+      .subtitle {
+        position: relative;
+        background: #fff;
+        height: 50px;
+        font-size: 28px;
+        z-index: 9;
+        margin-left: 8px;
+        width: 175px;
+        display: flex;
+        justify-content: center; /* 相对父元素水平居中 */
+        align-items: center; /*  子元素相对父元素垂直居中 */
+      }
+    }
+
+    .form_main {
+      margin: 0 24px;
+      padding-bottom: 40px;
+      .form_item {
+        margin: 20px 20px 0;
+
+        display: flex;
+        font-size: 28px;
+        border-bottom: 1px solid #e6e6e6;
+        .v_title {
+          width: 308px;
+          color: #999;
+          height: 112px;
+          padding-right: 90px;
+          justify-content: flex-end;
+          display: flex;
+          align-items: center;
+        }
+        .v_content {
+          flex: 1;
+          &.single {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+          }
+          .icon_date {
+            width: 26px;
+            height: 26px;
+            background: url("../../../../assets/images/sunVillage/select_date_icon.jpg")
+              no-repeat;
+            background-size: 100% 100%;
+            display: block;
+            margin-right: 12px;
+          }
+          &.multiple {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: space-between;
+          }
+          .download_list {
+            li {
+              font-size: 24px;
+              color: #799fe9;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
+<script>
+import headerNav from "@/components/sunVillage/common/header.vue";
+
+export default {
+  name: "sunVillageAssetsPublicDesc",
+  components: { headerNav },
+  data() {
+    return {
+      headingsTitle: "资产公开",
+    };
+  },
+  mounted() {},
+  methods: {
+    skip(url) {
+      this.$router.push(url);
+    },
+  },
+};
+</script>

src/views/sunVillage/dynamic/injoint/details.vue

@@ -0,0 +1,103 @@
+<template>
+  <div class="home_wrapper">
+    <header-nav :currentNav="1" :headings="headingsTitle"></header-nav>
+    <div class="article_main">
+      <div class="title">国新办解读中央一号文件：乡村振兴求好不求快</div>
+      <div class="info_wrap">
+        <div class="publisher">阳光村务公开平台</div>
+        <div class="time">2022-02-25 09:00</div>
+      </div>
+    </div>
+    <div class="particulars_main">
+      <p><img src="@/assets/images/sunVillage/3.jpg" /></p>
+      <p>
+        2月22日,阿松大了看啥看三菱电机阿斯兰的阿阿莱克斯大家阿拉山口大家阿斯兰的骄傲
+        埃里克森加大了圣诞节阿拉山口道路喀什觉得拉克丝奥斯陆扩大急啊离开圣诞节奥斯陆扩大爱丽丝大家爱丽丝大家
+      </p>
+      <p>
+        卢卡斯的急啊离开圣诞节阿斯兰的阿萨卢卡斯的骄傲啦卢卡斯的就按设按时打算科技大厦了的骄傲睡了多久啊是阿斯利康大家ask的埃里克森的奥斯陆扩大爱山东
+      </p>
+      <p>
+        卢卡斯的急啊离开圣诞节阿斯兰的阿萨卢卡斯的骄傲啦卢卡斯的就按设按时打算科技大厦了的骄傲睡了多久啊是阿斯利康大家ask的埃里克森的奥斯陆扩大爱山东
+      </p>
+    </div>
+    <div class="particulars_download">
+      <div class="title">附件下载:</div>
+      <div class="main">
+        <ul>
+          <li><<2020一季度村务财务报表>>.xlsx</li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.home_wrapper {
+  width: 100%;
+  min-height: 100vh;
+  background: #fff;
+  .article_main {
+    margin: 0 24px;
+    padding-top: 15px;
+    .title {
+      font-size: 28px;
+      line-height: 45px;
+      margin-bottom: 6px;
+    }
+    .info_wrap {
+      display: flex;
+      line-height: 48px;
+      font-size: 24px;
+      .publisher {
+        color: rgb(92, 107, 140);
+        margin-right: 20px;
+      }
+      .time {
+        color: #999;
+      }
+    }
+  }
+  .particulars_main {
+    margin: 24px 24px 0;
+    font-size: 24px;
+    padding-bottom: 15px;
+    img {
+      max-width: 100%;
+    }
+    p {
+      padding-bottom: 15px;
+    }
+  }
+  .particulars_download {
+    display: flex;
+    margin: 0 24px;
+    padding-bottom: 30px;
+    font-size: 24px;
+    .title {
+    }
+    .main {
+      flex: 1;
+      color: #588be7;
+      li {
+        text-decoration: underline;
+      }
+    }
+  }
+}
+</style>
+
+<script>
+import headerNav from "@/components/sunVillage/common/header.vue";
+export default {
+  name: "sunVillageInjointDetails",
+  components: { headerNav },
+  data() {
+    return {
+      headingsTitle: "财务公开",
+    };
+  },
+  mounted() {},
+  methods: {},
+};
+</script>

src/views/sunVillage/dynamic/injoint/index.vue

@@ -16,7 +16,7 @@
       <ul>
         <li
           class="item_block"
-          @click="skip('/sunVillage/latestReport/details')"
+          @click="skip('/sunVillage/injoint/details')"
         >
           <div class="title">一季度收入说明</div>
           <div class="insets">
@@ -25,7 +25,7 @@
         </li>
         <li
           class="item_block"
-          @click="skip('/sunVillage/latestReport/details')"
+          @click="skip('/sunVillage/injoint/details')"
         >
           <div class="title">一季度收入说明</div>
           <div class="insets">

src/views/sunVillage/dynamic/injoint/meansOf_desc.vue

@@ -111,11 +111,11 @@
 import headerNav from "@/components/sunVillage/common/header.vue";
 
 export default {
-  name: "sunVillageMeansOf",
+  name: "sunVillageInjointMeansOfDesc",
   components: { headerNav },
   data() {
     return {
-      headingsTitle: "三资公开",
+      headingsTitle: "清产核资",
     };
   },
   mounted() {},

src/views/sunVillage/dynamic/injoint/publicResources.vue

@@ -21,13 +21,19 @@
           <div class="flex f4">状态</div>
         </div>
         <div class="tbody_main">
-          <div class="item_list">
+          <div
+            class="item_list"
+            @click="skip('/sunVillage/injoint/publicResources_desc')"
+          >
             <div class="flex f1">18号大楼1233</div>
             <div class="flex f2">19</div>
             <div class="flex f3">经营</div>
             <div class="flex f4">正常</div>
           </div>
-          <div class="item_list">
+          <div
+            class="item_list"
+            @click="skip('/sunVillage/injoint/publicResources_desc')"
+          >
             <div class="flex f1">18号大楼1233</div>
             <div class="flex f2">19</div>
             <div class="flex f3">经营</div>

src/views/sunVillage/dynamic/injoint/publicResources_desc.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="home_wrapper">
+    <header-nav :headings="headingsTitle" :currentNav="1"></header-nav>
+    <div class="assetsPublic_main">
+      <div class="title_main">
+        <div class="subtitle">资源信息</div>
+      </div>
+      <div class="form_main">
+        <div class="form_item">
+          <div class="v_title">资源名称</div>
+          <div class="v_content single">办公电脑</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">总面积</div>
+          <div class="v_content single">20</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">资产状态</div>
+          <div class="v_content single">16000元</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">经营状态</div>
+          <div class="v_content single">经营</div>
+        </div>
+
+        <div class="form_item">
+          <div class="v_title">附件</div>
+          <div class="v_content multiple">
+            <ul class="download_list">
+              <li>《资源说明》.xlsx</li>
+              <li>《资源说明》.xlsx</li>
+              <li>《资源说明》.xlsx</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+      <div class="title_main">
+        <div class="subtitle">经营属性</div>
+      </div>
+      <div class="form_main">
+        <div class="form_item">
+          <div class="v_title">承包方</div>
+          <div class="v_content single">张三</div>
+        </div>
+        <div class="form_item">
+          <div class="v_title">金额</div>
+          <div class="v_content single">450000</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<style scoped lang="scss">
+.home_wrapper {
+  width: 100%;
+  min-height: 100vh;
+  background: #fff;
+  .assetsPublic_main {
+    margin: 0 24px;
+    .title_main {
+      height: 50px;
+      position: relative;
+      margin-top: 20px;
+      &::before {
+        width: 8px;
+        height: 50px;
+        background: #66ccff;
+        border-radius: 8px;
+        position: absolute;
+        left: 0;
+        top: 0;
+        z-index: 2;
+        content: " ";
+      }
+      &::after {
+        width: 100%;
+        height: 1px;
+        background: #e5e5e5;
+        position: absolute;
+        left: 0;
+        top: 25px;
+        content: " ";
+      }
+      .subtitle {
+        position: relative;
+        background: #fff;
+        height: 50px;
+        font-size: 28px;
+        z-index: 9;
+        margin-left: 8px;
+        width: 175px;
+        display: flex;
+        justify-content: center; /* 相对父元素水平居中 */
+        align-items: center; /*  子元素相对父元素垂直居中 */
+      }
+    }
+
+    .form_main {
+      margin: 0 24px;
+      padding-bottom: 40px;
+      .form_item {
+        margin: 20px 20px 0;
+
+        display: flex;
+        font-size: 28px;
+        border-bottom: 1px solid #e6e6e6;
+        .v_title {
+          width: 308px;
+          color: #999;
+          height: 112px;
+          padding-right: 90px;
+          justify-content: flex-end;
+          display: flex;
+          align-items: center;
+        }
+        .v_content {
+          flex: 1;
+          &.single {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+          }
+          .icon_date {
+            width: 26px;
+            height: 26px;
+            background: url("../../../../assets/images/sunVillage/select_date_icon.jpg")
+              no-repeat;
+            background-size: 100% 100%;
+            display: block;
+            margin-right: 12px;
+          }
+          &.multiple {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: space-between;
+          }
+          .download_list {
+            li {
+              font-size: 24px;
+              color: #799fe9;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
+<script>
+import headerNav from "@/components/sunVillage/common/header.vue";
+
+export default {
+  name: "sunVillageInjoint",
+  components: { headerNav },
+  data() {
+    return {
+      headingsTitle: "资源公开",
+    };
+  },
+  mounted() {},
+  methods: {
+    skip(url) {
+      this.$router.push(url);
+    },
+  },
+};
+</script>