first commit

src/views/InformationQuery.vue

@@ -0,0 +1,674 @@
+<template>
+  <div class="wrapper">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="box">
+      <!-- 搜索框 -->
+      <div class="search">
+        <input type="text" placeholder="请输入组织名称" v-model.trim="searchVal" @keyup.enter="getData()" />
+        <label @click="getData()" style="cursor:pointer">搜索</label>
+      </div>
+      <!-- 分类搜索 -->
+      <div class="select-box">
+        <select name="type" v-model="type_value" @change="scree()">
+          <option value="组织类型">组织类型</option>
+          <template v-for="(type, index) in types">
+            <option :key="index" :value="index">{{ type }}</option>
+          </template>
+        </select>
+
+        <select name="year" v-model="year_value" @change="scree()">
+          <option value="年检时间">年检时间</option>
+          <template v-for="(year, index) in years">
+            <option :key="index" :value="index">{{ year }}</option>
+          </template>
+        </select>
+
+        <select name="condition" v-model="year_status" @change="scree()">
+          <option value="年检结果">年检结果</option>
+          <option value="0">不合格</option>
+          <option value="1">合格</option>
+        </select>
+      </div>
+      <!-- 搜索记录 -->
+      <!-- <div class="record">
+        <template v-for="(item,index) in record">
+          <div class="list" :key="index" @click="searchRecord(item.nameOf)">
+            <span>{{item.category + '：' + item.nameOf}}</span>
+            <span class="iconfont icon-cuowu" @click="del(index)"></span>
+          </div>
+        </template>
+      </div>-->
+      <!-- 表格 -->
+      <div class="box-table">
+        <div class="caption">
+          <span
+            v-for="(list, index) in text"
+            :class="sub == index ? 'color' : ''"
+            :key="index"
+            @click="btn(index)"
+          >{{ list }}</span>
+        </div>
+        <table>
+          <tr>
+            <th>序号</th>
+            <th>社会组织名称</th>
+            <th>统一社会信用代码</th>
+            <th>社会组织类型</th>
+            <th>法定代表人</th>
+            <th>成立登记日期</th>
+            <th>状态</th>
+          </tr>
+          <template v-if="searchValue.length == 0">
+            <tr
+              v-for="(info, index) in conversion"
+              :key="index"
+              :class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
+              class="tr"
+            >
+              <td @click="$jP('socialcredit',{id:info.id})" class="orgname">{{ info.name }}</td>
+              <td>{{ info.unicode }}</td>
+              <td>{{ info.society_type }}</td>
+              <td>{{ info.legal_person }}</td>
+              <td>{{ info.reg_time }}</td>
+              <td v-if="info.status == '白名单'" style="color:#2fd63f">信用良好</td>
+              <td v-if="info.status == '黑名单'" style="color:#e13232">活动异常</td>
+            </tr>
+          </template>
+          <template v-if="searchValue.length > 0">
+            <tr
+              class="tr"
+              v-for="(info, index) in searchValue"
+              :key="index"
+              :class="index % 2 == 0 ? 'bgcbz' : 'bgcz'"
+            >
+              <td>{{ info.name }}</td>
+              <td>{{ info.unicode }}</td>
+              <td>{{ info.society_type }}</td>
+              <td>{{ info.legal_person }}</td>
+              <td>{{ info.reg_time }}</td>
+              <td v-if="info.status == '白名单'" style="color:#2fd63f">信用良好</td>
+              <td v-if="info.status == '黑名单'" style="color:#e13232">活动异常</td>
+            </tr>
+          </template>
+        </table>
+      </div>
+      <!-- 分页按钮 -->
+      <div class="page">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          :pager-count="5"
+          background
+          layout="prev, pager, next"
+          :total="totalCount"
+        ></el-pagination>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from '../components/HeaderNav'
+import FooterNav from '../components/FooterNav'
+
+export default {
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  props: {},
+  data () {
+    return {
+      index_num: 1,
+      text: ['全部', '异常名录', '信用良好名录'],
+      sub: 0,
+      imgUrl: {
+        xa: require('../../static/img/xa.png')
+      },
+      searchVal: '',
+      searchValue: [],
+      record: [],
+      types: [],
+      years: '',
+      year_status: '年检结果',
+      type_value: '组织类型',
+      year_value: '年检时间',
+      bgData: [],
+      arr1: [],
+      arr0: [],
+      conversion: [],
+      pageSize: 1,
+      currentPage: 1,
+      totalCount: 1,
+      status: ''
+    }
+  },
+  computed: {},
+  watch: {
+    // record(newVal, oldVal) { }
+  },
+  methods: {
+    /** 筛选函数 */
+    scree () {
+      this.currentPage = 1
+      if (this.sub === 0) {
+        this.sub = ''
+      } else if (this.sub === 1) {
+        this.sub = 0
+      } else {
+        this.sub = 1
+      }
+      this.getData(
+        this.searchVal,
+        this.type_value,
+        this.years[this.year_value],
+        this.year_status,
+        this.sub,
+        this.currentPage
+      )
+      if (this.sub === '') {
+        this.sub = 0
+      } else if (this.sub === 0) {
+        this.sub = 1
+      } else {
+        this.sub = 2
+      }
+    },
+    /** 删除单条数据 */
+    // del(index) {
+    //   let delArr = this.record.splice(index, 1)
+    // },
+    /** 调用搜索函数 */
+    // searchRecord(str) {
+    //   this.getSearch(str)
+    // },
+    /** 名单切换 */
+    btn (index) {
+      let s = this.sub
+      s = index
+      this.sub = s
+      this.currentPage = 1
+      switch (this.sub) {
+        case 0:
+          this.getData(
+            this.searchVal,
+            this.type_value,
+            this.years[this.year_value],
+            this.year_status,
+            (this.status = '')
+          )
+          break
+        case 1:
+          this.getData(
+            this.searchVal,
+            this.type_value,
+            this.years[this.year_value],
+            this.year_status,
+            (this.status = 0)
+          )
+          break
+        case 2:
+          this.getData(
+            this.searchVal,
+            this.type_value,
+            this.years[this.year_value],
+            this.year_status,
+            (this.status = 1)
+          )
+          break
+      }
+    },
+    /** 获取后台数据 */
+    getData (
+      name = this.searchVal,
+      type = this.type_value,
+      year = this.years[this.year_value],
+      yearStatus = this.year_status,
+      status = this.status,
+      page = this.currentPage
+    ) {
+      if (type === '组织类型') {
+        type = ''
+        // this.type_value = ''
+      }
+
+      if (year === '年检时间') {
+        year = ''
+        // this.years[this.year_value] = ''
+      }
+
+      if (yearStatus === '年检结果') {
+        yearStatus = ''
+        // this.year_status = ''
+      }
+      let _this = this
+
+      this.$http({
+        method: 'post',
+        url: 'v1/society/society',
+        data: {
+          name: name,
+          type: type,
+          year: year,
+          yearStatus: yearStatus,
+          status: status,
+          page: page
+        }
+      })
+        .then(res => {
+          if (res.data.data.code !== 200) {
+            return
+          }
+          // if (this.page == 1) {
+          if (res.data.data.data.info.length === 0) {
+            this.currentPage=1
+            alert('您所查询的数据暂时没有！')
+            return
+          } else {
+            _this.conversion = res.data.data.data.info
+            _this.totalCount = res.data.data.data.allPage
+            // console.log(_this.conversion);
+          }
+          _this.page++
+        })
+        .catch(err => {
+          console.log(err)
+        })
+
+      // console.log(this.type_value);
+
+      if (this.type_value === '') {
+        this.type_value = '组织类型'
+      }
+
+      if (this.years[this.year_value] === '') {
+        this.year_value = '年检时间'
+      }
+
+      if (this.year_status === '') {
+        this.year_status = '年检结果'
+      }
+    },
+    /** 获取类型 */
+    getDataG () {
+      let _this = this
+      this.$http({
+        method: 'get',
+        url: 'v1/society/get-type',
+        params: {}
+      })
+        .then(res => {
+          if (res.data.code !== 200) {
+            return
+          }
+          _this.types = res.data.data.type
+          _this.years = res.data.data.year
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    handleSizeChange (val) {
+      this.pageSize = val
+      this.getPackData()
+    },
+    handleCurrentChange (val) {
+      this.currentPage = val
+      this.getData()
+      this.getPackData()
+    },
+    getPackData () { }
+  },
+  created () {
+    this.getDataG()
+    this.getData()
+  },
+  mounted () { }
+}
+</script>
+
+<style lang="scss" scoped>
+.wrapper {
+  min-width: 1280px;
+  box-sizing: border-box;
+  position: relative;
+  .orgname{
+    cursor: pointer;
+  }
+
+  #box {
+    width: 1200px;
+    background-color: #ffffff;
+    margin: 40px auto 80px;
+    box-sizing: border-box;
+    padding: 35px 30px 86px;
+
+    .page {
+      margin-top: 60px;
+      height: 36px;
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+
+      /deep/ .el-pagination.is-background .el-pager li {
+        color: #333 !important;
+      }
+
+      /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+        background-color: #e60012;
+        color: #fff !important;
+      }
+
+      /deep/ .el-icon.el-icon-arrow-left::before {
+        content: "上一页";
+        font-family: "MicrosoftYaHei";
+        font-size: 12px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666;
+      }
+
+      /deep/ .el-pagination .btn-prev {
+        width: 80px;
+      }
+
+      /deep/ .el-pagination .btn-next {
+        width: 80px;
+      }
+
+      /deep/ .el-icon.el-icon-arrow-right::before {
+        content: "下一页";
+        font-family: "MicrosoftYaHei";
+        font-size: 12px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666;
+      }
+    }
+
+    .box-table {
+      width: 100%;
+      margin-top: -25px;
+
+      table {
+        width: 1130px;
+        counter-reset: items 0; /* 0 可以省略 */
+        counter-increment: counter-name integer;
+        box-sizing: border-box;
+
+        .tr {
+          counter-increment: items 1; /* 1 同样可以省略 */
+          &:before {
+            content: counter(items);
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #595959;
+            width: 86px;
+            height: 40px;
+            display: inline-block;
+            text-align: center;
+            line-height: 40px;
+            box-sizing: border-box;
+          }
+        }
+
+        th {
+          line-height: 40px;
+          text-align: center;
+          height: 40px;
+          font-family: "MicrosoftYaHei";
+          font-size: 16px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #666666;
+          background-color: #f6fafd;
+          box-sizing: border-box;
+
+          &:nth-of-type(1) {
+            width: 86px;
+          }
+          &:nth-of-type(2) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(3) {
+            width: 240px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(4) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(5) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(6) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(7) {
+            width: 140px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+        }
+
+        .bgcz {
+          background-color: #f6fafd;
+        }
+        .bgcbz {
+          background-color: #fff;
+        }
+
+        td {
+          border: none !important;
+          line-height: 40px;
+          text-align: center;
+          height: 40px;
+          font-family: "MicrosoftYaHei";
+          font-size: 16px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          box-sizing: border-box;
+          color: #595959;
+
+          &:nth-of-type(1) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(2) {
+            width: 240px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(3) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(4) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(5) {
+            width: 160px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          &:nth-of-type(6) {
+            width: 140px;
+            border-left: 1px solid #dcebf6 !important;
+          }
+          /*
+          &:nth-of-type(7) {
+            width: 144px;
+          }
+          */
+        }
+      }
+
+      .caption {
+        width: 1140px;
+        height: 38px;
+        border-bottom: 1px solid #dedede;
+        margin-top: 76px;
+        margin-bottom: 30px;
+        padding-left: 30px;
+        box-sizing: border-box;
+
+        span {
+          display: inline-block;
+          height: 38px;
+          text-align: center;
+          font-family: "MicrosoftYaHei";
+          font-size: 20px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #333333;
+          margin-right: 49px;
+
+          &:nth-of-type(1) {
+            width: 60px;
+          }
+          &:nth-of-type(2) {
+            width: 110px;
+          }
+          &:nth-of-type(3) {
+            width: 121px;
+          }
+        }
+
+        .color {
+          color: #e60012;
+          position: relative;
+
+          &::after {
+            content: "";
+            width: 100%;
+            height: 2px;
+            background-image: linear-gradient(#e60012, #e60012),
+              linear-gradient(#ff7f7f, #ff7f7f);
+            background-blend-mode: normal, normal;
+            position: absolute;
+            left: 0%;
+            bottom: 0%;
+          }
+        }
+      }
+    }
+
+    .record {
+      display: flex;
+      justify-content: flex-start;
+      flex-wrap: wrap;
+
+      .list {
+        margin-right: 25px;
+        border-radius: 4px;
+        border: solid 1px #c7c7c7;
+        padding: 10px 24px;
+        font-family: "MicrosoftYaHei";
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #666666;
+        margin-bottom: 25px;
+
+        .iconfont {
+          margin-left: 10px;
+        }
+      }
+    }
+
+    .select-box {
+      display: flex;
+      align-items: center;
+
+      select {
+        color: #666 !important;
+        font-size: 18px;
+        &:nth-of-type(1) {
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 170px;
+          padding: 0 30px;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+        }
+        /* 清除默认的箭头样式 */
+        appearance: none;
+        -moz-appearance: none;
+        -webkit-appearance: none;
+        /* 右侧添加小箭头的背景图 */
+        background: url("../../static/img/xa.png") 126px center no-repeat;
+        background-size: 14px 8px;
+        width: 170px;
+        height: 38px;
+        background-color: #f9f8f8;
+        border-radius: 4px;
+        border: solid 1px #c7c7c7;
+        margin-right: 55px;
+        padding-left: 30px;
+        box-sizing: border-box;
+        outline: none;
+        margin-bottom: 30px;
+      }
+    }
+
+    .search {
+      width: 100%;
+      height: 50px;
+      box-sizing: border-box;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 30px;
+
+      input {
+        font-family: "MicrosoftYaHei";
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 2px;
+        color: #666666;
+        padding: 0 18px;
+        box-sizing: border-box;
+        width: 1025px;
+        height: 50px;
+        border: solid 1px #c7c7c7;
+        outline: none;
+      }
+
+      label {
+        width: 96px;
+        height: 50px;
+        background-color: #e60012;
+        font-family: "MicrosoftYaHei";
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 50px;
+        letter-spacing: 0px;
+        color: #ffffff;
+        text-align: center;
+      }
+    }
+  }
+}
+</style>

src/views/Login.vue

@@ -0,0 +1,235 @@
+<template>
+  <div class="wrapper">
+    <img :src="imgUrl.login" id="img" />
+    <div class="box">
+      <div class="box-o">
+        <h3>欢 迎 登 录</h3>
+        <div class="input">
+          <input
+            type="text"
+            v-model="account"
+            name="account"
+            placeholder="组织名称"
+          />
+          <img class="one" :src="imgUrl.yh" alt />
+          <input
+            type="password"
+            v-model="password"
+            name="password"
+            placeholder="密码"
+          />
+          <img class="two" :src="imgUrl.mm" alt />
+        </div>
+        <div class="three">
+          <span @click="$jump('registered')">注册</span>
+          <span v-show="0">忘记密码</span>
+        </div>
+        <div class="btn" @click="login()">
+          <button type="submit">立即登录</button>
+        </div>
+        <div id="home" @click="$jump('homePage')">
+          <span>返回首页</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      imgUrl: {
+        login: require('../../static/img/login.png'),
+        yh: require('../../static/img/yh.png'),
+        registered: require('../../static/img/registered.png'),
+        mm: require('../../static/img/mm.png')
+      },
+      account: '',
+      password: ''
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    login () {
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/login/login',
+        data: {
+          user: _this.account,
+          password: _this.password
+        }
+      })
+        .then(res => {
+          if (res.data.data.code === 200) {
+            this.$message.success('登陆成功')
+            this.$router.push('/')
+            window.sessionStorage['id'] = res.data.data.data.id
+            window.sessionStorage['name'] = res.data.data.data.name
+            window.sessionStorage['party_id'] = res.data.data.data.party_id
+            window.sessionStorage['party_name'] = res.data.data.data.party_name
+          } else {
+            alert(res.data.data.msg)
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  },
+  created () {},
+  mounted () {}
+}
+</script>
+
+<style lang="scss" scoped>
+.wrapper {
+  min-width: 1280px;
+  height: 720px;
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  #home {
+    width: 100%;
+    color: red;
+    font-size: 12px;
+    margin: 20px auto 0;
+    text-align: center;
+    cursor: pointer;
+  }
+
+  #img {
+    position: fixed;
+    left: 0%;
+    top: 0%;
+    width: 100vw;
+    height: 100vh;
+    z-index: -1;
+  }
+
+  .box {
+    z-index: 999;
+    width: 736px;
+    height: 489px;
+    background-color: rgba($color: #fff, $alpha: 0.5);
+    box-shadow: 0px 3px 29px 0px rgba(0, 0, 0, 0.18);
+    border-radius: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    .box-o {
+      width: 434px;
+      height: 309px;
+
+      .btn {
+        width: 218px;
+        height: 56px;
+        margin: 0 auto;
+
+        button {
+          box-sizing: border-box;
+          width: 218px;
+          height: 56px;
+          background-color: #e60012;
+          border: 1px solid #e60012;
+          box-shadow: 3px 5px 9px 0px rgba(252, 142, 142, 0.47);
+          border-radius: 28px;
+          text-align: center;
+          line-height: 50px;
+          font-family: 'MicrosoftYaHei';
+          font-size: 18px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #ffffff;
+          cursor: pointer;
+          outline: none;
+        }
+      }
+
+      .three {
+        margin: 15px auto 31px;
+        width: 96%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        span {
+          font-family: 'MicrosoftYaHei';
+          font-size: 14px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #666666;
+          cursor: pointer;
+        }
+      }
+
+      .input {
+        width: 100%;
+        height: 135px;
+        margin-top: 33px;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        align-items: center;
+        position: relative;
+
+        .one {
+          width: 15px;
+          height: 17px;
+          position: absolute;
+          top: 14%;
+          left: 5%;
+        }
+
+        .two {
+          width: 18px;
+          height: 19px;
+          position: absolute;
+          bottom: 14%;
+          left: 5%;
+        }
+
+        input {
+          width: 434px;
+          height: 56px;
+          border-radius: 28px;
+          border: solid 1px #a5acbb;
+          opacity: 0.8;
+          padding: 0 54px;
+          box-sizing: border-box;
+          outline: none;
+          font-family: 'MicrosoftYaHei';
+          font-size: 18px;
+          font-weight: normal;
+          font-stretch: normal;
+          line-height: 88px;
+          letter-spacing: 0px;
+          color: #333333;
+        }
+      }
+
+      h3 {
+        // font-family: "HanWangKaiBold-Gb5";
+        font-family: 'MicrosoftYaHei';
+
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+        text-align: center;
+      }
+    }
+  }
+}
+</style>

src/views/Registered.vue

@@ -0,0 +1,300 @@
+<template>
+  <div class="wrapper">
+    <img :src="imgUrl.registered" id="img" />
+    <div class="box">
+      <div class="boxx">
+        <h3>立 即 注 冊</h3>
+        <form enctype="multipart/form-data" action method onsubmit="return false">
+          <!-- 请输入组织名称 pattern
+              oninvalid="setCustomValidity('不能为空')"
+              oninput="setCustomValidity('')"
+          -->
+          <template v-for="(reg,index) in reg.data">
+            <label :key="index">
+              <span :class="index === 0 ? 'one' : 'two'">
+                <span class="iconfont" :class="reg.icon"></span>
+                <span class="iconfont icon-vertical_line"></span>
+              </span>
+              <input
+                class="input"
+                :type="reg.data_type"
+                :placeholder="'请输入'+ reg.notes"
+                :name="reg.name"
+                v-model="obj[reg.name]"
+                required
+              />
+              <span v-if="index === 0" class="span1">注：组织名称将用于用户登录</span>
+            </label>
+          </template>
+          <label class="s" @click="submit()">
+            <input type="submit" class="sub" value="立即注册" />
+          </label>
+        </form>
+        <div id="home" @click="$jump('homePage')">
+          <span>返回首页</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      imgUrl: {
+        registered: require('../../static/img/registered.png'),
+        yy: require('../../static/img/yy.png')
+      },
+      fieldsName: [],
+      reg: [],
+      arr: [],
+      obj: {}
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    submit () {
+      for (var key of Object.keys(this.obj)) {
+        if (this.obj[key] === '') {
+          alert('以上内容不可为空！')
+          return
+        }
+      }
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/login/reg',
+        data: {
+          object: _this.obj
+        }
+      }).then(res => {
+        if (res.data.code === 200) {
+          // alert(res.data.data.msg)
+          if (res.data.data.code !== 200) {
+            alert(res.data.data.msg)
+            return false
+          }
+          _this.$router.push({
+            name: 'login'
+          })
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    getData () {
+      let _this = this
+      this.$http({
+        method: 'get',
+        url: 'v1/login/reg-fields',
+        params: {}
+      }).then(res => {
+        if (res.data.code === 200) {
+          _this.reg = res.data
+          _this.reg.data.forEach(item => {
+            _this.obj[item.name] = ''
+          })
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  },
+  created () {
+    this.getData()
+  },
+  mounted () { }
+}
+</script>
+
+<style lang='scss' scoped>
+/** 无效 */
+input:required:invalid {
+  border-color: #ccc !important;
+}
+/** 有效 */
+input:required:valid {
+  border-color: green !important;
+}
+.wrapper {
+  min-width: 1280px;
+  height: 1398px;
+  box-sizing: border-box;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  #home {
+    width: 100%;
+    color: red;
+    font-size: 12px;
+    margin: 20px auto 0;
+    text-align: center;
+    cursor: pointer;
+  }
+
+  #img {
+    width: 100vw;
+    height: auto;
+    position: absolute;
+    left: 0%;
+    top: 0%;
+    z-index: -1;
+  }
+
+  .box {
+    width: 736px;
+    background-color: rgba($color: #fff, $alpha: 0.5);
+    box-shadow: 0px 3px 29px 0px rgba(0, 0, 0, 0.18);
+    border-radius: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 120px 0px;
+    box-sizing: border-box;
+    .boxx {
+      width: 474px;
+
+      h3 {
+        font-family: 'HanWangKaiBold-Gb5';
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 24px;
+        letter-spacing: 0px;
+        color: #333333;
+        text-align: center;
+        margin-bottom: 33px;
+      }
+
+      form {
+        .s {
+          width: 100%;
+          text-align: center;
+          .sub {
+            margin: 0 auto;
+            width: 218px;
+            height: 56px;
+            background-color: #e60012;
+            box-shadow: 3px 5px 9px 0px rgba(252, 142, 142, 0.47);
+            border-radius: 28px;
+            font-family: 'MicrosoftYaHei';
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 56px;
+            text-align: center;
+            letter-spacing: 0px;
+            color: #ffffff;
+            outline: none;
+          }
+        }
+
+        .label {
+          display: flex;
+          align-items: center;
+          height: 15px;
+
+          .checkout {
+            width: 14px;
+            height: 14px;
+            background-image: linear-gradient(0deg, #e5e2e2 0%, #ffffff 100%);
+            border-radius: 3px;
+            border: solid 1px #bfbfbf;
+            margin-right: 16px;
+          }
+
+          .span2 {
+            font-family: 'MicrosoftYaHei';
+            font-size: 14px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 62px;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+
+          .span3 {
+            font-family: 'MicrosoftYaHei';
+            font-size: 14px;
+            font-weight: normal;
+            letter-spacing: 0px;
+            color: #e60012;
+          }
+        }
+        label {
+          position: relative;
+          margin-bottom: 25px;
+          display: inline-block;
+
+          .two {
+            position: absolute;
+            left: 4%;
+            top: 33%;
+            display: flex;
+
+            .iconfont {
+              font-size: 20px;
+              font-weight: 900;
+              color: #000;
+            }
+          }
+
+          .one {
+            position: absolute;
+            left: 4%;
+            top: 24%;
+            display: flex;
+
+            .iconfont {
+              font-size: 20px;
+              font-weight: 900;
+              color: #000;
+            }
+          }
+          .input {
+            width: 474px;
+            height: 56px;
+            border-radius: 28px;
+            border: solid 1px #a5acbb;
+            opacity: 0.8;
+            outline: none;
+            padding: 0 60px;
+            box-sizing: border-box;
+
+            font-family: 'MicrosoftYaHei';
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 88px;
+            letter-spacing: 0px;
+            color: #666666;
+          }
+
+          .span1 {
+            display: inline-block;
+            margin-top: 8px;
+            margin-left: 25px;
+            font-family: 'MicrosoftYaHei';
+            font-size: 14px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #999999;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/views/activedetail.vue

@@ -0,0 +1,85 @@
+<template>
+  <div>
+    <header-nav :index_num="index_num"></header-nav>
+    <div class="content">
+      <div>
+        <span>状态：</span>
+        <span>劳动组织</span>
+      </div>
+      <div>
+        <span>监测方：</span>
+        <span>组织</span>
+      </div>
+      <div>
+        <span>预测时间：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>项目名称 ：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>机构名称：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>活动名称：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>活动地点：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>活动内容：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>预计参与人数：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>项目联系人：</span>
+        <span>示例文字</span>
+      </div>
+      <div>
+        <span>联系方式：</span>
+        <span>示例文字</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import HeaderNav from "../components/HeaderNav";
+export default {
+  name: "dangzuzhixq",
+  components: {
+    HeaderNav
+  },
+  data() {
+    return {
+      index_num: 0
+    };
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.content{
+    margin-left:121px;
+    margin-top: 67px;
+    &>div{
+        margin-bottom: 38px;
+        display: flex;
+    }
+    .line{
+        width: 1088px;
+        height: 1px;
+        border-top: 1px dashed #E7E7E7;
+        position: relative;
+        top: 8px;
+        left: 20px;  
+    }
+}
+</style>

src/views/dangzuzhixq.vue

@@ -0,0 +1,247 @@
+<template>
+  <div>
+    <header-nav :index_num="index_num"></header-nav>
+    <div class="content">
+      <div class="top">
+        <div class="homeicon">
+          <img src="../../static/img/homeicon.png" alt="" class="homeicon">
+        </div>
+        <div class="el-icon-right"></div>
+        <div class="titleshot">党组织信息</div>
+      </div>
+      <!-- <img src="../../static/img/apple.png" alt class="apply" /> -->
+      <div class="infobox">
+         <div class="infotablebg">
+        <div class="infotable">
+          <div class="tabletitle">党组织信息</div>
+          <table>
+            <!-- <tr>
+<th class="tabletitle">社会组织信息</th>
+            </tr>-->
+
+            <tr>
+              <td class="key">社会组织名称</td>
+              <td class="val">{{result.name}}</td>
+              <td class="key">社会组织类型</td>
+              <td class="val">{{result.type}}</td>
+            </tr>
+            <tr>
+              <td class="key">流动党员数量</td>
+              <td class="val">{{result.flow_party_person}}人</td>
+              <td class="key">已有党员数量</td>
+              <td class="val">{{result.party_person}}人</td>
+            </tr>
+            <tr>
+              <td class="key">从业人员总数</td>
+              <td class="val">{{result.work_person}}</td>
+              <td class="key">党组织名称</td>
+              <td class="val">{{result.party_name}}</td>
+            </tr>
+            <tr>
+              <td class="key">是否建立党组织</td>
+              <td class="val">{{result.is_reg_party==1?"是":"否"}}</td>
+              <td class="key">是否建立功能性党组织</td>
+              <td class="val">{{result.is_reg_fun_party==1?"是":"否"}}</td>
+            </tr>
+            <tr>
+              <td class="key">近三年发展党员数</td>
+              <td class="val">{{result.near_party_person}}人</td>
+              <td class="key">是否建立群团组织</td>
+              <td class="val">{{result.is_reg_group==1?"是":"否"}}</td>
+            </tr>
+            <tr>
+              <td class="key">党组织书记姓名</td>
+              <td class="val">{{result.sec_name}}</td>
+              <td class="key">党组织书记性别</td>
+              <td class="val">{{result.sec_sex==1?"男":"女"}}</td>
+            </tr>
+            <tr>
+              <td class="key">党组织书记年龄</td>
+              <td class="val">{{result.sec_age}}</td>
+              <td class="key">党组织书记行政职务</td>
+              <td class="val">{{result.sec_job}}</td>
+            </tr>
+            <tr>
+              <td class="key">
+                <p class="keywrap">近三年参加上级党组织培训情况</p>
+              </td>
+              <td class="val">
+                <p class="valwrap">{{result.sec_study}}</p>
+              </td>
+              <td class="key">
+                <p class="keywrap">是否派选党建工作指导员</p>
+              </td>
+              <td class="val">
+                <p class="valwrap">{{result.is_choice_instructor ==1?"是":"否"}}</p>
+              </td>
+            </tr>
+
+            <tr>
+              <td class="key">是否建立群团组织</td>
+              <td class="val">{{result.is_reg_group==1?"是":"否"}}</td>
+              <td class="key">专执党务工作者人数</td>
+              <td class="val">{{result.major_party_person}}人</td>
+            </tr>
+            <tr>
+              <td class="key">
+                <p class="keywrap">党组织年度活动经费（万元）</p>
+              </td>
+              <td class="val">
+                <p class="valwrap">{{result.year_money}}</p>
+              </td>
+              <td class="key">
+                <p class="keywrap">党组织年度活动面积（平米）</p>
+              </td>
+              <td class="val">
+                <p class="valwrap">{{result.active_year}}</p>
+              </td>
+            </tr>
+          </table>
+          <table>
+            <tr>
+              <td class="key">登记管理机关</td>
+              <td class="valself">{{result.reg_manage}}</td>
+            </tr>
+            <tr>
+              <td class="key">业务主管单位</td>
+              <td class="valself">{{result.supervisor}}</td>
+            </tr>
+            <tr>
+              <td class="key">隶属的上一级党组织名称</td>
+              <td class="valself">{{result.party_pname}}</td>
+            </tr>
+          </table>
+        </div>
+      </div>
+      </div>
+     
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from "../components/HeaderNav";
+import FooterNav from "../components/FooterNav";
+export default {
+  name: "dangzuzhixq",
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  data() {
+    return {
+      index_num: 1,
+      result: []
+    };
+  },
+  mounted() {
+    console.log(this.$route.query.id);
+    this.$http({
+      method: "get",
+      url: "v1/user/get-info",
+      params:{id:this.$route.query.id}
+      // params: { sid: sessionStorage.getItem("party_id") }
+    }).then(res => {
+      console.log(res);
+      this.result = res.data.data;
+    });
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.infobox {
+  width: 100vw;
+  display: flex;
+  justify-content: center;
+      margin-top: 70px;
+}
+.el-icon-s-home {
+  color: #9a9899;
+  font-size: 20px;
+}
+.content {
+  background-color: #f5f5f5;
+  .top {
+    width: 178px;
+    position: relative;
+    top: 50px;
+    left: 70px;
+    display: flex;
+    justify-content: space-around;
+    .titleshot {
+      font-size: 20px;
+      // font-weight: bold;
+    }
+    .homeicon{
+      width: 22px;
+      height: 22px;
+    }
+  }
+  .apply {
+    width: 233px;
+    float: right;
+    margin-right: 71px;
+  }
+  .infotablebg {
+    width: 1200px;
+    background-color: white;
+    margin: 0 auto;
+
+    // margin-top: 67px;
+    display: flex;
+    justify-content: center;
+    padding-bottom: 180px;
+    .infotable {
+      margin-top: 36px;
+      .tabletitle {
+        background-color: #f24e77;
+        width: 1070px;
+        height: 60px;
+        color: white;
+        text-align: center;
+        line-height: 60px;
+        font-size: 24px;
+      }
+      .key {
+        width: 266px;
+        height: 40px;
+        line-height: 40px;
+        background-color: #f7f5f6;
+        text-align: left;
+        text-indent: 40px;
+      }
+      .keywrap {
+        width: 150px;
+        margin: 0 auto;
+        line-height: 35px;
+        text-indent: -17px;
+        text-align: left;
+      }
+      .valwrap {
+        // line-height: 50px;
+        position: relative;
+        top: 15px;
+      }
+      .valself {
+        width: 802px;
+        height: 40px;
+        line-height: 40px;
+        text-align: left;
+        text-indent: 30px;
+      }
+      .val {
+        width: 266px;
+        height: 40px;
+        line-height: 40px;
+      }
+    }
+  }
+}
+</style>
+<style>
+body table td {
+  border: 2px solid #dfe0eb !important;
+}
+</style>

src/views/excutes/Excute.vue

@@ -0,0 +1,491 @@
+<template>
+  <div class="cl">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="excute_box">
+      <!--内容-->
+      <div class="excute_con">
+        <h3>一、项目申报书</h3>
+        <p>
+          <a :href="centers.probook?centers.probook:''" download>{{centers.probook?((centers.probook.split('/')[8]).split('_')[0]?(centers.probook.split('/')[8]).split('_')[0]:(centers.probook.split('/')[8])):''}}</a>
+          <a :href="centers.probook?centers.probook:''" target="_blank">预览</a>
+        </p>
+        <h3>二、项目实施方案</h3>
+        <p>
+          <a :href="centers.fangan?centers.fangan:''" download>{{centers.fangan?((centers.fangan.split('/')[8]).split('_')[0]?(centers.fangan.split('/')[8]).split('_')[0]:centers.fangan.split('/')[8]):''}}</a>
+          <a :href="centers.fangan?centers.fangan:''" target="_blank">预览</a>
+        </p>
+        <h3>三、中期报告</h3>
+        <h3>1、基本信息</h3>
+        <aside>
+          <div style="margin-bottom:15px;position:relative;right:94px">
+            <label style="font-size:20px">一、项目名称:</label>
+            <span style="font-size:20px;margin-left:20px">{{zDatc.name}}</span>
+            <!-- <el-input
+              v-model="zDatc.name"
+              name="name"
+              placeholder="请输入项目名称"
+              style="width:300px;margin-left:10px"
+            ></el-input>-->
+            <!-- <input
+              type="text"
+              name="name"
+              readonly
+              v-model="zDatc.name"
+              required
+              disabled
+              class="division"
+            />-->
+          </div>
+          <div style="margin-bottom:15px;position:relative;right:94px">
+            <label style="font-size:20px">机构名称:</label>
+            <span style="font-size:20px;margin-left:20px">{{zDatc.company}}</span>
+            <!-- <el-input
+              v-model="zDatc.company"
+              name="name"
+              placeholder="请输入机构名称"
+              style="width:300px;margin-left:10px"
+            ></el-input>-->
+            <!-- <input
+              type="text"
+              name="name"
+              value
+              v-model="zDatc.company"
+              required
+              disabled
+              class="division"
+            />-->
+          </div>
+          <div style="margin-bottom:15px;position:relative;right:94px">
+            <label style="font-size:20px">申请日期:</label>
+            <span style="font-size:20px;margin-left:20px">{{zDatc.aterm}}</span>
+            <!-- <el-date-picker
+              v-model="zDatc.month"
+              type="date"
+              value-format="timestamp"
+              placeholder="选择日期时间"
+              style="margin-left:10px;margin-bottom:10px"
+            ></el-date-picker>-->
+
+            <!-- <input type="date" name="aterm" v-model="zDatc.aterm" value required />
+            <span>至</span>
+            <input type="date" name="fterm" v-model="zDatc.fterm" value required />-->
+          </div>
+          <div style="margin-bottom:15px">
+            <label style="font-size:20px;white-space:nowrap;margin-left:34px">项目执行团队人员构成及分工</label>
+            <span style="font-size:15px;margin-left:20px">{{zDatc.people}}</span>
+            <div class="rich">
+              <!-- <team @team1="team1" :teamVal="teamval"></team> -->
+              <aboutUs @aboutUs="inform2" :aboutUsVal="centers.people" :writeable="!ifupdate"></aboutUs>
+            </div>
+            <!-- <el-input
+              v-model="zDatc.people"
+              name="name"
+              placeholder="请输入项目执行团队人员构成及分工"
+              style="width:300px;margin-left:10px"
+            ></el-input>-->
+            <!-- <input
+              type="text"
+              name="name"
+              value
+              v-model="zDatc.people"
+              required
+              disabled
+              class="division"
+            />-->
+          </div>
+        </aside>
+        <h3>2、发展性状况</h3>
+        <div class="rich">
+            <ProjectBrief
+                    @projectBrief="inform"
+                    :projectBriefVal="centers.develop"
+                    :writeable="!ifupdate"
+                  ></ProjectBrief>
+        </div>
+        <!-- <p>我国仍处于井将长期处于社会主义初级阶段,是最大的国情和实际。“我们开展各项工作,要一切从实际出发,牢牢立足这个最大国情和实际,不要超越阶段。从能源来看,我国當富煤少油缺气?的资源禀赋,决定了煤炭在较长一个时期内作为我国主体能源的地位不会发玍变化,这就婓求我们坚持从煤炭资源丰富的囯情出发,切实抓好煤炭清洁高效利用。”章建华</p> -->
+        <h3>3、项目实施情况</h3>
+        <div class="rich">
+          <ProjectAssessment
+                    @projectAssessment="goals"
+                    :projectAssessmentVal="centers.pro_condition"
+                    :writeable="!ifupdate"
+                  ></ProjectAssessment>
+
+        </div>
+        <h3>4、项目取得的成就</h3>
+       <div class="rich">
+                <ExistingBasis
+                    @existingBasis="effect"
+                    :existingBasisVal="centers.result"
+                    :writeable="!ifupdate"
+                  ></ExistingBasis>
+          </div>
+        <h3>5、对项目实施至今的情况总结</h3>
+            <div class="rich">
+                        <MethodsWay
+                    @methodsWay="plement"
+                    :methodsWayVal="centers.summary"
+                    :writeable="!ifupdate"
+                  ></MethodsWay>
+          </div>
+        <!-- <p>{{ centers.summary }}</p> -->
+        <h3>
+          6、项目财务报告
+          <span class="download">
+            <span style="margin-left:15px;margin-right:5px"> {{caiwu?(caiwu.split(".")[0]).split('_')[0]+'.'+caiwu.split('.')[1]:''}}</span>
+           
+            <a :href="centers.fina" download v-if="caiwu">下载</a> |
+            <a :href="centers.fina" target="_blank" v-if="caiwu">预览</a>
+          </span>
+        </h3>
+        <h3>
+          7、中期电子报告
+  
+          <span class="download">
+             <span style="margin-left:15px;margin-right:5px"> {{dianzi?(dianzi.split('.')[0]).split('_')[0]+'.'+dianzi.split('.')[1]:''}}</span>
+            <a :href="centers.elereport" download>下载</a> |
+            <a :href="centers.elereport" target="_blank">预览</a>
+          </span>
+        </h3>
+        <h3>
+          四、项目调整申请表及批复意见表
+         
+          <span class="download">
+             <span style="margin-left:15px;margin-right:5px">  {{shenqing?(shenqing.split('.')[0]).split('_')[0]+shenqing.split('.')[1]:''}}</span>
+            <a :href="centers.adjust" download v-if="shenqing">下载 |</a> 
+            <a :href="centers.adjust" target="_blank" v-if="shenqing">预览</a>
+          </span>
+        </h3>
+        <h3>五、活动类/培训类/会议类材料</h3>
+        <h3 v-for="(i,j) in centers.ziliao" :key="j">
+          <a :href="i.elereport">{{i.name}}</a>
+          <a :href="i.elereport?i.elereport:''" download style="margin-left:15px">{{i.elereport?(i.elereport.split('/')[8]).split('_')[0]+'.'+(i.elereport.split('/')[8]).split('.')[1]:''}}</a> 
+          <span class="download" >
+            <a :href="i.elereport" download v-if="i.elereport">下载 |</a> 
+            <a :href="i.elereport" target="_blank" v-if="i.elereport">预览</a>
+          </span>
+        </h3>
+        <!-- <h3>
+          呵呵呵的爱心活动
+          <span class="download">
+            <a href="#" download>下载</a> |
+            <a href="#">预览</a>
+          </span>
+        </h3>
+        <h3>
+          呵呵呵的爱心活动
+          <span class="download">
+            <a href="#" download>下载</a> |
+            <a href="#">预览</a>
+          </span>
+        </h3> -->
+        <h3>
+          六、财务中期预算表
+          <span class="download">
+             <span style="margin-left:15px;margin-right:5px">  {{midcaiwu?(midcaiwu.split('.')[0]).split('_')[0]+midcaiwu.split('.')[1]:""}}</span>
+            <a :href="centers.budget" download  v-if="midcaiwu">下载</a> |
+            <a :href="centers.budget" target="_blank" v-if="midcaiwu">预览</a>
+          </span>
+        </h3>
+        <h3>
+          七、其他类
+          <span class="download">
+             <span style="margin-left:15px;margin-right:5px">  {{qita?(qita.split(".")[0]).split('_')[0]+'.'+qita.split('.')[1]:''}}</span>
+            <a :href="centers.other" download v-if="qita">下载</a> |
+            <a :href="centers.other" target="_blank" v-if="qita">预览</a>
+          </span>
+        </h3>
+        <h3>
+          八、中期PPT文件
+          <span class="download">
+                <span style="margin-left:15px;margin-right:5px">  {{ppt?(ppt.split('.')[0]).split('_')[0]+'.'+ppt.split('.')[1]:""}}</span>
+            <a :href="centers.PPT" download v-if="ppt">下载</a> |
+            <a :href="centers.PPT" target="_blank" v-if="ppt">预览</a>
+          </span>
+        </h3>
+      </div>
+      <section id="preview" v-if="popupStatus">
+        <div class="tc" @click="preview()"></div>
+        <section class="tc-text">
+          <a
+            v-for="(list, index) in dataFile"
+            :key="index"
+            :href="list.url"
+            target="_blank"
+          >{{ list.url }}</a>
+        </section>
+        <!-- <img class="tc-text" :src="zData.proimages" /> -->
+      </section>
+      <section id="popup" v-if="pop" @click="popUp()">
+        <aside @click.stop>
+          <img :src="linkData" alt />
+        </aside>
+      </section>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
+<script>
+import HeaderNav from "../../components/HeaderNav";
+import FooterNav from "../../components/FooterNav";
+const path = require("path");
+const files = require.context("@/components", false, /\.vue$/);
+const modules = {};
+files.keys().forEach(key => {
+  const names = path.basename(key, ".vue");
+  modules[names] = files(key).default || files(key);
+});
+var preD = function(e) {
+  e.preventDefault();
+};
+export default {
+  // components: {
+  //   HeaderNav,
+  //   FooterNav
+  // },
+  components: modules,
+  data() {
+    return {
+      index_num: 2,
+      sub: 0,
+      name: " ",
+      info: ["1"],
+      zDatc: [],
+      zDatb: [],
+      dataFile: null,
+      id: null,
+      fileName: null,
+      centers: null,
+      linkData: "",
+      popupStatus: false,
+      pop: false,
+      informVal: "aaaa",
+      goalsVal:"",
+      effectVal:'',
+       plementVal: "",
+       ifupdate:true,
+       caiwu:"",
+       dianzi:"",
+       shenqing:"",
+       midcaiwu:"",
+       qita:"",
+       ppt:""
+
+    };
+  },
+  created() {
+    this.GetListImg();
+  },
+  methods: {
+    inform(data) {
+      console.log(data, "e");
+      this.infomrText = data;
+    },
+    inform2(data) {
+      console.log(data, "111111e");
+      this.team = data;
+    },
+      goals(data) {
+      this.goalsText = data;
+    },
+    preview() {
+      this.popupStatus = !this.popupStatus;
+    },
+       effect(data) {
+      this.effectText = data;
+    },
+        plement(data) {
+      this.plementText = data;
+    },
+    aterm() {},
+    fterm() {},
+    getData() {
+      this.$http({
+        method: "post",
+        url: "v1/project/details",
+        data: {
+          id: this.id
+        }
+      })
+        .then(res => {
+          console.log(res, 234568);
+
+          if (res.data.data.code === 200) {
+            this.zDatc = res.data.data.data.ProjectDetails;
+            console.log(this.zDatc, 256);
+          } else {
+            alert("请求失败！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    },
+    getCenter() {
+      this.$http({
+        method: "get",
+        url: "v1/pro/center",
+        params: {
+          // id: 83,
+          id: this.id,
+          category: "center"
+        }
+      })
+        .then(res => {
+          if (res.data.data.code === 200) {
+            let data = res.data.data.data[0];
+            this.centers = data;
+            console.log(this.centers);
+               this.caiwu = this.centers.fina.substring(
+              this.centers.fina.lastIndexOf("/") + 1
+            );
+              this.dianzi = this.centers.elereport.substring(
+              this.centers.elereport.lastIndexOf("/") + 1
+            );
+                this.shenqing = this.centers.adjust.substring(
+              this.centers.adjust.lastIndexOf("/") + 1
+            );
+                 this.midcaiwu = this.centers.budget.substring(
+              this.centers.budget.lastIndexOf("/") + 1
+            );
+                    this.qita = this.centers.other.substring(
+              this.centers.other.lastIndexOf("/") + 1
+            );
+                       this.ppt = this.centers.PPT.substring(
+              this.centers.PPT.lastIndexOf("/") + 1
+            );
+          } else {
+            alert(res.data.data.msg);
+            //  this.$jParams("schedule", { id: this.id, mid_sub: 1 });
+            this.$router.push({path: `/schedule${this.id}`});
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    }, //预览
+    popUp(link) {
+      console.log(link);
+      this.pop = !this.pop;
+      this.linkData = link;
+    }
+  },
+  created() {
+    this.id = this.$route.query.id;
+    this.getData();
+    this.getCenter();
+  }
+};
+</script>
+<style lang="scss" scoped>
+.rich {
+  margin-bottom: 105px;
+}
+#preview {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0%;
+  left: 0%;
+  z-index: 999;
+
+  .tc {
+    width: 100%;
+    height: 100%;
+    background-color: rgba($color: #000, $alpha: 0.58);
+    position: fixed;
+    top: 0%;
+    left: 0%;
+  }
+
+  .tc-text {
+    // width: 350px;
+    // width:100%;
+    padding: 30px;
+    box-sizing: border-box;
+    height: auto;
+    background-color: #fff;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translateX(-50%) translateY(-50%);
+
+    a {
+      display: inline-block;
+      margin-top: 10px;
+      cursor: pointer;
+    }
+  }
+}
+#excute_box {
+  width: 100%;
+  .excute_con {
+    width: 1200px;
+    margin: 0 auto;
+    padding: 50px 30px;
+    background: white;
+    margin-top: 50px;
+    margin-bottom: 50px;
+    h3 {
+      line-height: 260%;
+      font-size: 20px;
+    }
+    p a {
+      line-height: 10%;
+      color: #7471ef;
+      font-size: 14px;
+      margin-right: 10px;
+    }
+    label {
+      margin-left: 16px;
+      font-family: "MicrosoftYaHei";
+      font-size: 14px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 25px;
+      letter-spacing: 0px;
+      color: #333333;
+      text-align: right;
+      display: inline-block;
+      width: 200px;
+    }
+    input {
+      box-sizing: border-box;
+      width: 33.8%;
+      height: 35px;
+      background-color: #ffffff;
+      border: solid 1px #c7c7c7;
+      outline: none;
+      margin-left: 35px;
+      margin-bottom: 15px;
+      font-family: "MicrosoftYaHei";
+      font-size: 18px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #323232;
+      margin-right: 35px;
+    }
+    .division {
+      width: 76%;
+    }
+    span {
+      font-size: 18px;
+    }
+    span a {
+      color: #7471ef;
+    }
+    p {
+      font-size: 17px;
+      color: #666;
+      line-height: 30px;
+    }
+    .download {
+      color: #7471ef;
+      padding-left: 30px;
+      font-size: 14px;
+    }
+  }
+}
+</style>

src/views/excutes/Over.vue

@@ -0,0 +1,360 @@
+<template>
+  <div class="cl">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="excute_box">
+      <!--内容-->
+      <div class="excute_con">
+        <h3>一、项目申报书</h3>
+        <p>
+          <a :href="over.probook">{{over.probook?((over.probook.split('/')[8]).split('_')[0]?(over.probook.split('/')[8]).split('_')[0]:over.probook.split('/')[8])+'.'+over.probook.split('.')[3]:'未上传'}}</a>
+          <a :href="over.probook" target="_blank" v-if="over.probook">预览</a>
+        </p>
+        <h3>二、立项批复文件</h3>
+        <p>
+          <a :href="over.fangan">{{over.fangan?(over.fangan.split('/')[8].split('_')[0]?over.fangan.split('/')[8].split('_')[0]:over.fangan.split('/')[8]):'未上传'}}</a>
+          <a :href="over.fangan" target="_blank" v-if="over.fangan">预览</a>
+        </p>
+        <h3>三、实施方案</h3>
+        <p>
+    <a :href="over.fangan">{{over.fangan?(over.fangan.split('/')[8].split('_')[0]?over.fangan.split('/')[8].split('_')[0]:over.fangan.split('/')[8]):'未上传'}}</a>
+          <a :href="over.fangan" target="_blank"  v-if="over.fangan">预览</a>
+        </p>
+        <!-- <h3>四、街道（地区办事处）关于2019年社会建设资金购买社会组织服务结项材料的说明</h3>
+        <p>
+          <span>
+            <a href="#">下载</a> |
+            <a href="#">预览</a>
+          </span>
+        </p> -->
+        <h3>四、项目实施各阶段情况报告（月度报告）</h3>
+        <p>
+          <!-- <a href="#">未上传</a> -->
+
+           <a :href="over.pro_condition">{{over.pro_condition?(over.pro_condition.split('/')[8].split('_')[0]?over.pro_condition.split('/')[8].split('_')[0]:over.pro_condition.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+           <a :href="over.pro_condition" download="" v-if="over.pro_condition">下载</a>
+          <a :href="over.pro_condition" target="_blank" v-if="over.pro_condition">预览</a>
+        </p>
+        <!-- <h3>六、中期评估报告</h3>
+        <p>
+          <span>
+            <a href="#">下载</a> |
+            <a href="#">预览</a>
+          </span>
+        </p> -->
+        <h3>五、结项报告（绩效报告）</h3>
+        <h3>1、基本信息</h3>
+        <aside>
+          <div class="baseinfo">
+            <label>一、项目名称:</label>
+            <p class="right" style="right:12px">{{over.name}}</p>
+          </div>
+          <div class="baseinfo">
+            <label class="left">机构名称:</label>
+         <p class="right">{{over.company}}</p>
+          </div>
+          <div class="baseinfo">
+            <label class="left">申请日期:</label>
+            <p class="right">{{over.aterm}}</p>
+          </div>
+          <div>
+            <label class="left" style="margin-left:29px">项目执行团队人员构成及分工:</label>
+            <!-- <input
+              type="text"
+              name="name"
+              value
+              v-model="over.people"
+              required
+              disabled
+              class="division"
+            /> -->
+                       <DivisionLabor
+                    @divisionLabor="plement"
+                    :divisionLaborVal="over.people"
+                    :writeable="false"
+                  ></DivisionLabor>
+            <!-- <p v-html="over.people"></p> -->
+          </div>
+        </aside>
+        <!-- <h3>2、发展性状况</h3> -->
+        <!-- <p></p> -->
+        <!-- <h3>3、项目实施情况</h3> -->
+        <!-- <p>{{over.pro_condition}}</p> -->
+        <!-- <p v-html="over.pro_condition"></p> -->
+         <!-- <DivisionLabor
+                    @divisionLabor="plement"
+                    :divisionLaborVal="over.pro_condition"
+                    :writeable="false"
+                  ></DivisionLabor> -->
+
+        <h3>1、项目取得的成就</h3>
+        <!-- <p>{{over.result}}</p> -->
+        <!-- <p v-html="over.result"></p> -->
+                 <DivisionLabor
+                    @divisionLabor="plement"
+                    :divisionLaborVal="over.result"
+                    :writeable="false"
+                  ></DivisionLabor>
+        <h3>2、对项目实施至今的情况总结</h3>
+        <!-- <p>{{ over.summary }}</p> -->
+        <!-- <p v-html="over.summary"></p> -->
+            <DivisionLabor
+                    @divisionLabor="plement"
+                    :divisionLaborVal="over.summary"
+                    :writeable="false"
+                  ></DivisionLabor>
+        <h3>
+          3、项目财务报告
+          <span class="download">
+            <!-- {{over.fina}} -->
+          <a :href="over.fina">{{over.fina?(over.fina.split('/')[8].split('_')[0]?over.fina.split('/')[8].split('_')[0]:over.fina.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="over.fina" download v-if="over.fina"> 下载 |</a>
+            <a :href="over.fina" target="_blank" v-if="over.fina">预览</a>
+          </span>
+        </h3>
+        <h3>
+          4、结项电子报告
+          <span class="download">
+          <a :href="over.elereport">{{over.elereport?(over.elereport.split('/')[8].split('_')[0]?over.elereport.split('/')[8].split('_')[0]:over.elereport.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+
+            <a :href="over.elereport" download v-if="over.elereport"> 下载 |</a> 
+            <a :href="over.elereport" target="_blank" v-if="over.elereport">预览</a>
+          </span>
+        </h3>
+        <h3>
+          六、项目调整申请表及批复意见表
+          <span class="download">
+            <a :href="over.adjust">{{over.adjust?(over.adjust.split('/')[8].split('_')[0]?over.adjust.split('/')[8].split('_')[0]:over.adjust.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="over.adjust" download v-if="over.adjust">下载 |</a>
+            <a :href="over.adjust" target="_blank" v-if="over.adjust">预览</a>
+          </span>
+        </h3>
+        <h3>七、会议活动相关资料（通知、议程、参加人员名单及签到表、现场照片或视频、会议纪要、活动总结报告、媒体报道、满意度测评表及报告等）</h3>
+          <span class="download" v-for="(item,index) in over.ziliao" :key="index" style="display:block;margin: 20px 0">
+            <a :href="item.elereport">{{item.elereport?(item.elereport.split('/')[8].split('_')[0]?item.elereport.split('/')[8].split('_')[0]:item.elereport.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="item.elereport" download v-if="item.elereport">下载 |</a> 
+            <a :href="item.elereport" target="_blank" v-if="item.elereport">预览</a>
+          </span>
+        <h3>
+          八、反映项目实施效果的相关资料
+          （媒体报道、获奖情况、文字成果、案例等）
+          <span class="download">
+              <a :href="over.pro_result">{{over.pro_result.split('/')[8]?(over.pro_result.split('/')[8].split('_')[0]?over.pro_result.split('/')[8].split('_')[0]:over.pro_result.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="over.pro_result" download v-if="over.pro_result">下载 |</a> 
+            <a :href="over.pro_result" target="_blank" v-if="over.pro_result">预览</a>
+          </span>
+        </h3>
+        <h3>
+          九、财务管理制度
+          <span class="download">
+             <a :href="over.manage">{{over.manage?(over.manage.split('/')[8].split('_')[0]?over.manage.split('/')[8].split('_')[0]:over.manage.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="over.manage" download v-if="over.manage">下载 |</a>
+            <a :href="over.manage" target="_blank" v-if="over.manage">预览</a>
+          </span>
+        </h3>
+        <h3>
+          十、项目经费表、决算表
+          <span class="download">
+            <a :href="over.money">{{over.money.split('/')[8]?(over.money.split('/')[8].split('_')[0]?over.money.split('/')[8].split('_')[0]:over.money.split('/')[8]):'未上传'}}</a>
+            &nbsp;&nbsp;&nbsp;
+            <a :href="over.money" download v-if="over.money">下载 |</a>
+            <a :href="over.money" target="_blank" v-if="over.money">预览</a>
+          </span>
+        </h3>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+<script>
+import HeaderNav from '../../components/HeaderNav'
+import FooterNav from '../../components/FooterNav'
+const path = require("path");
+const files = require.context("@/components", false, /\.vue$/);
+const modules = {};
+files.keys().forEach(key => {
+  const names = path.basename(key, ".vue");
+  modules[names] = files(key).default || files(key);
+});
+// eslint-disable-next-line no-unused-vars
+var preD = function (e) {
+  e.preventDefault()
+}
+export default {
+  components: modules,
+  data () {
+    return {
+      index_num: 2,
+      sub: 0,
+      name: ' ',
+      info: ['1'],
+      zDatc: [],
+      zDatb: [],
+      dataFile: null,
+      id: null,
+      fileName: null,
+      over: null,
+      probook:""
+    }
+  },
+  created () {
+    this.GetListImg()
+  },
+  methods: {
+    plement(){},
+    aterm () { },
+    fterm () { },
+    getData () {
+      this.$http({
+        method: 'post',
+        url: 'v1/project/details',
+        data: {
+          id: this.id
+        }
+      })
+        .then(res => {
+          console.log(res, 234568)
+
+          if (res.data.data.code === 200) {
+            this.zDatc = res.data.data.data.ProjectDetails
+            console.log(this.zDatc, 256)
+          } else {
+            alert('请求失败！')
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    getOver () {
+      this.$http({
+        method: 'get',
+        url: 'v1/pro/center',
+        params: {
+          // id: 83,
+          id:this.$route.query.id,
+          category: 'over'
+        }
+      })
+        .then(res => {
+          // console.log(res,500)
+          if (res.data.data.code === 200) {
+            let data = res.data.data.data[0]
+            this.over = data
+            console.log(this.over.probook.split('/')[8],500)
+            //   var index = file.response.data.url.lastIndexOf(".");
+            // var filetype = file.response.data.url.substr(index + 1);
+          } else {
+            alert(res.data.data.msg)
+             this.$router.push({path: `/schedule${this.id}`});
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  },
+  // eslint-disable-next-line no-dupe-keys
+  created () {
+    this.id = this.$route.query.id
+    this.getData()
+    this.getOver()
+  }
+}
+</script>
+<style lang="scss" scoped>
+.baseinfo{
+  // min-width:180px;
+  display: flex;
+  .right{
+    margin-left: 15px;
+    margin-bottom: 20px;
+    position: relative;
+    top: -5px;
+  }
+  .left{
+    margin-left:29px;
+  }
+}
+#excute_box {
+  width: 100%;
+  .excute_con {
+    width: 1200px;
+    margin: 0 auto;
+    padding: 80px 30px;
+    background: white;
+    margin-top: 50px;
+    margin-bottom: 50px;
+    h3 {
+      line-height: 260%;
+      font-size: 20px;
+    }
+    p a {
+      line-height: 10%;
+      color: #7471ef;
+      font-size: 14px;
+      margin-right: 10px;
+    }
+    p{
+      font-size: 20px!important;
+      margin-left: 33px;
+    }
+    label {
+      // margin-left: 16px;
+      font-family: "MicrosoftYaHei";
+      font-size: 14px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 25px;
+      letter-spacing: 0px;
+      color: #333333;
+      // text-align: right;
+      display: inline-block;
+      font-size: 20px;
+      // width: 200px;
+    }
+    input {
+      box-sizing: border-box;
+      width: 33.8%;
+      height: 35px;
+      background-color: #ffffff;
+      border: solid 1px #c7c7c7;
+      outline: none;
+      margin-left: 35px;
+      margin-bottom: 15px;
+      font-family: "MicrosoftYaHei";
+      font-size: 18px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #323232;
+      margin-right: 35px;
+    }
+    .division {
+      width: 76%;
+    }
+    span {
+      font-size: 18px;
+    }
+    span a {
+      color: #7471ef;
+    }
+    p {
+      font-size: 17px;
+      color: #666;
+      line-height: 30px;
+    }
+    .download {
+      color: #7471ef;
+      padding-left: 30px;
+      font-size: 14px;
+    }
+  }
+}
+</style>

src/views/home/ApplyFor.vue

@@ -0,0 +1,831 @@
+<template>
+  <div class="wr">
+    <header-nav :index_num="index_num"></header-nav>
+    <div class="wrapperr">
+      <p class="title">党组织申请</p>
+      <!-- 进度条 -->
+      <div class="he">
+        <div
+          class="list"
+          v-for="(item,index) in text"
+          :key="index"
+          :style="{'background-image': sub == index ? 'url('+imgUrl.bg0+')' : 'url('+imgUrl.bg1+')'}"
+        >
+          <span :style="sub == index ? 'color:#fff' : 'color:#000'">{{item}}</span>
+        </div>
+      </div>
+
+      <!-- 用户填写的内容 -->
+      <form action method onsubmit="return false" enctype="multipart/form-data">
+        <!-- 党组织申请1 -->
+        <div id="boxOne" v-if="sub == 0">
+          <h3>基本信息</h3>
+          <div class="b">
+            <div class="o">
+              <label>
+                <span>社会组织名称:</span>
+                <input class="input" type="text" name="name" v-model="name" disabled />
+              </label>
+              <label>
+                <span>社会组织类型:</span>
+                <select name="type" v-model="type">
+                  <template v-for="(list,index) in types">
+                    <option :key="index" :value="index">{{list}}</option>
+                  </template>
+                </select>
+              </label>
+            </div>
+            <div class="o">
+              <label>
+                <span>流动党员数量:</span>
+                <input
+                  class="input"
+                  type="number"
+                  min="0"
+                  name="flow_party_person"
+                  v-model="flow_party_person"
+                />
+              </label>
+              <label>
+                <span>已有党员数量:</span>
+                <input
+                  class="input"
+                  type="number"
+                  min="0"
+                  name="party_person"
+                  v-model="party_person"
+                />
+              </label>
+            </div>
+            <div class="o">
+              <label>
+                <span>从业人员总数:</span>
+                <input class="input" type="number" min="0" name="work_person" v-model="work_person" />
+              </label>
+              <label>
+                <span>党组织名称:</span>
+                <input class="input" type="text" name="party_name" v-model="party_name" />
+              </label>
+            </div>
+            <div class="o-zero">
+              <span>是否建立党组织:</span>
+              <div>
+                <label for>
+                  <input type="radio" name="is_reg_party" v-model="is_reg_party" value="1" checked />&nbsp;&nbsp;是
+                </label>&nbsp;&nbsp;&nbsp;&nbsp;
+                <label for>
+                  <input type="radio" name="is_reg_party" v-model="is_reg_party" value="2" />&nbsp;&nbsp;否
+                </label>
+              </div>
+            </div>
+            <div class="o-one">
+              <span>是否建立“功能型”党组织:</span>
+              <div>
+                <label for>
+                  <input type="radio" name="is_reg_fun_party" v-model="is_reg_fun_party" value="1" />&nbsp;&nbsp;是
+                </label>&nbsp;&nbsp;&nbsp;&nbsp;
+                <label for>
+                  <input type="radio" name="is_reg_fun_party" v-model="is_reg_fun_party" value="2" />&nbsp;&nbsp;否
+                </label>
+              </div>
+            </div>
+            <div class="o-o">
+              <label>登记管理机关:</label>
+              <input type="text" name="reg_manage" v-model="reg_manage" />
+            </div>
+            <div class="o-o">
+              <label>业务主管单位:</label>
+              <input type="text" name="supervisor" v-model="supervisor" />
+            </div>
+            <div class="o-two">
+              <label>隶属的上一级党组织名称:</label>
+              <input type="text" name="party_pname" v-model="party_pname" />
+            </div>
+          </div>
+          <div class="btn" @click="btn(1)">下一页</div>
+        </div>
+        <!-- 党组织申请2 -->
+        <div id="boxTwo" v-if="sub == 1">
+          <!-- !!!!!! -->
+          <h3>党组织书记情况</h3>
+          <div class="b">
+            <div>
+              <label for>姓名:</label>
+              <input type="text" name="sec_name" v-model="sec_name" />
+            </div>
+            <div style="display: flex;
+          align-items: center;">
+              <label for>姓别:</label>
+              <label class="label">
+                <input type="radio" name="sec_sex" v-model="sec_sex" value="1" />&nbsp;&nbsp;男&nbsp;&nbsp;&nbsp;&nbsp;
+                <input
+                  type="radio"
+                  name="sec_sex"
+                  v-model="sec_sex"
+                  value="0"
+                />&nbsp;&nbsp;女
+              </label>
+            </div>
+            <div>
+              <label for>年龄:</label>
+              <input type="text" v-model="sec_age" name="sec_age" title="请输入大于或等于零的阿拉伯数字" />
+            </div>
+            <div>
+              <label for>行政职务:</label>
+              <input type="text" v-model="sec_job" name="sec_job" />
+            </div>
+            <div>
+              <label for>近三年参加上级党组织培训次数:</label>
+              <input type="text" name="sec_study" v-model="sec_study" title="请输入大于或等于零的阿拉伯数字" />
+            </div>
+          </div>
+          <!-- !!!!!! -->
+          <h3 style="margin-top:35px;">党组织信息</h3>
+          <div class="b">
+            <div>
+              <label for>近三年发展党员数:</label>
+              <input
+                type="text"
+                name="near_party_person"
+                v-model="near_party_person"
+                title="请输入大于或等于零的阿拉伯数字"
+              />
+            </div>
+            <div style="display: flex;
+          align-items: center;">
+              <label for>是否建立群团组织:</label>
+              <label class="label">
+                <input type="radio" name="is_reg_group" value="1" v-model="is_reg_group" />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+                <input
+                  type="radio"
+                  name="is_reg_group"
+                  value="2"
+                  v-model="is_reg_group"
+                />&nbsp;&nbsp;否
+              </label>
+            </div>
+            <div>
+              <label for>专职党务工作者人数:</label>
+              <input
+                type="text"
+                name="major_party_person"
+                v-model="major_party_person"
+                title="请输入大于或等于零的阿拉伯数字"
+              />
+            </div>
+            <div style="display: flex;
+          align-items: center;">
+              <label for>是否选派党建工作指导员:</label>
+              <label class="label">
+                <input
+                  type="radio"
+                  name="is_choice_instructor"
+                  value="1"
+                  v-model="is_choice_instructor"
+                />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+                <input
+                  type="radio"
+                  name="is_choice_instructor"
+                  value="2"
+                  v-model="is_choice_instructor"
+                />&nbsp;&nbsp;否
+              </label>
+            </div>
+            <div>
+              <label for>党组织年度活动经费(万元):</label>
+              <input type="text" name="year_money" v-model="year_money" title="请输入大于或等于零的阿拉伯数字" />
+            </div>
+            <div>
+              <label for>党组织年度活动场所面积(平米):</label>
+              <input type="text" name="active_year" v-model="active_year" title="请输入大于或等于零的阿拉伯数字" />
+            </div>
+          </div>
+          <div
+            @click="btn(2)"
+            style="outline:none;display:flex;justify-content:center;margin-top:35px;"
+          >
+            <input type="submit" value="立即提交" />
+          </div>
+        </div>
+      </form>
+
+      <!-- succeed -->
+      <div class="succeed" v-if="sub == 2">
+        <div>
+          <img :src="imgUrl.succeed" alt />
+          <span>党组织申请已提交成功！</span>
+        </div>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from '../../components/HeaderNav'
+import FooterNav from '../../components/FooterNav'
+
+export default {
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  props: {},
+  data () {
+    return {
+      imgUrl: {
+        bg0: require('../../../static/img/bg0.png'),
+        bg1: require('../../../static/img/bg1.png'),
+        succeed: require('../../../static/img/succeed.png')
+      },
+      text: ['1 填写基本信息', '2 填写党组织信息', '3 提交审核'],
+      sub: 0,
+      index_num: 0,
+      types: [],
+      type: '',
+      supervisor: '',
+      reg_manage: '',
+      work_person: '',
+      flow_party_person: '',
+      party_person: '',
+      is_reg_party: '',
+      is_reg_fun_party: '',
+      party_name: '',
+      party_pname: '',
+      sec_name: '',
+      sec_sex: '',
+      sec_job: '',
+      sec_age: '',
+      sec_study: '',
+      near_party_person: '',
+      major_party_person: '',
+      is_reg_group: '',
+      is_choice_instructor: '',
+      year_money: '',
+      active_year: ''
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    btn (n) {
+      // let regz = /^(0|\+?[1-9][0-9]*)$/
+      let s = this.sub
+      s = n
+      if (s === 1) {
+        if (this.type === '' || this.flow_party_person === '' || this.party_person === '' || this.work_person === '' ||
+          this.party_name === '' || this.is_reg_party === '' || this.is_reg_fun_party === '' ||
+          this.reg_manage === '' || this.supervisor === '' || this.party_pname === ''
+        ) {
+          alert('以上内容不可为空！')
+        } else {
+          if (this.flow_party_person < 0 || this.party_person < 0 || this.work_person < 0) {
+            alert('不能出现负数呦！')
+          } else {
+            this.sub = s
+          }
+        }
+      }
+      if (s === 2) {
+        if (this.sec_name === '' || this.sec_sex === '' || this.sec_age === '' || this.sec_job === '' ||
+          this.sec_study === '' || this.near_party_person === '' || this.is_reg_group === '' ||
+          this.major_party_person === '' || this.is_choice_instructor === '' || this.year_money === '' ||
+          this.active_year === ''
+        ) {
+          alert('以上内容不可为空！')
+        } else if (isNaN(this.sec_age) || isNaN(this.sec_study) || isNaN(this.near_party_person) ||
+          isNaN(this.major_party_person) || isNaN(this.year_money) || isNaN(this.active_year)
+        ) {
+          alert('请输入数字！')
+        } else if (this.sec_age < 0 || this.sec_study < 0 || this.near_party_person < 0 ||
+          this.major_party_person < 0 || this.year_money < 0 || this.active_year < 0
+        ) {
+          alert('请输入大于或等于零的阿拉伯数字!')
+        } else {
+          let sid = sessionStorage.id
+          let _this = this
+          this.$http({
+            method: 'post',
+            url: 'v1/user/apply',
+            data: {
+              sid: sid,
+              type: _this.type,
+              supervisor: _this.supervisor,
+              reg_manage: _this.reg_manage,
+              work_person: _this.work_person,
+              flow_party_person: _this.flow_party_person,
+              party_person: _this.party_person,
+              is_reg_party: _this.is_reg_party,
+              is_reg_fun_party: _this.is_reg_fun_party,
+              party_name: _this.party_name,
+              party_pname: _this.party_pname,
+              sec_name: _this.sec_name,
+              sec_sex: _this.sec_sex,
+              sec_job: _this.sec_job,
+              sec_age: _this.sec_age,
+              sec_study: _this.sec_study,
+              near_party_person: _this.near_party_person,
+              major_party_person: _this.major_party_person,
+              is_reg_group: _this.is_reg_group,
+              is_choice_instructor: _this.is_choice_instructor,
+              year_money: _this.year_money,
+              active_year: _this.active_year
+            }
+          }).then(res => {
+            if (res.data.code === 200) {
+              if (res.data.data.code !== 200) {
+                alert(res.data.data.msg)
+                return
+              }
+              _this.sub = s
+            } else {
+              _this.$message.warning(res.data.message)
+            }
+          })
+            .catch(err => {
+              console.log(err)
+            })
+        }
+      }
+    },
+    getData () {
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/user/get-society-type',
+        data: {}
+      }).then(res => {
+        if (res.data.code === 200) {
+          _this.types = res.data.data
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  },
+  created () {
+    this.name = sessionStorage.name
+    this.getData()
+  },
+  mounted () { }
+}
+</script>
+
+<style lang='scss' scoped>
+.wr {
+  min-width: 1280px;
+  box-sizing: border-box;
+
+  .footer {
+    margin-top: 80px;
+  }
+}
+
+.wrapperr {
+  width: 1200px;
+  margin: 40px auto;
+  padding: 34px 31px 100px;
+  box-sizing: border-box;
+  background-color: #ffffff;
+
+  .succeed {
+    margin-top: 70px;
+
+    div {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      flex-direction: column;
+      align-items: center;
+
+      img {
+        width: 118px;
+        height: 118px;
+        margin-bottom: 28px;
+      }
+
+      span {
+        font-family: "MicrosoftYaHei";
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+      }
+    }
+  }
+
+  form {
+    h3 {
+      width: 1138px;
+      height: 38px;
+      font-family: "MicrosoftYaHei";
+      font-size: 20px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #333333;
+      border-bottom: 2px solid #dedede;
+      padding-left: 30px;
+      box-sizing: border-box;
+      margin-bottom: 58px;
+    }
+
+    input[type="submit"] {
+      outline: none;
+    }
+
+    label input[type="radio"] {
+      width: 17px;
+      height: 17px;
+      appearance: none;
+      -webkit-appearance: none;
+      outline: none;
+      margin: 0;
+      cursor: pointer;
+    }
+
+    label input[type="radio"]:after {
+      width: 17px;
+      height: 17px;
+      display: block;
+      content: "";
+      background: url("../../../static/img/wxz.png") no-repeat;
+      background-size: 100% 100%;
+    }
+
+    label input[type="radio"]:checked:after {
+      background: url("../../../static/img/xz.png") no-repeat;
+    }
+
+    #boxTwo {
+      .b {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+
+        div {
+          margin-bottom: 30px;
+          height: 43px;
+
+          label {
+            text-align: right;
+            width: 229px;
+            height: 16px;
+            display: inline-block;
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+
+          input[type="text"] {
+            margin-left: 28px;
+            width: 386px;
+            height: 43px;
+            background-color: #ffffff;
+            border: solid 1px #c7c7c7;
+            outline: none;
+            padding-left: 30px;
+            box-sizing: border-box;
+          }
+
+          .label {
+            width: 386px;
+            height: 43px;
+            margin-left: 30px;
+            display: flex;
+            align-items: center;
+          }
+        }
+      }
+
+      input[type="submit"] {
+        width: 330px;
+        height: 63px;
+        line-height: 63px;
+        text-align: center;
+        background-color: #e60012;
+        border-radius: 5px;
+
+        font-family: "MicrosoftYaHei";
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #ffffff;
+      }
+    }
+
+    #boxOne {
+      .b {
+        width: 100%;
+
+        .o-two {
+          width: 100%;
+          height: 43px;
+          display: flex;
+          align-items: center;
+          padding-left: 16px;
+          box-sizing: border-box;
+          margin-bottom: 60px;
+
+          label {
+            display: inline-block;
+            width: 181px;
+            height: 16px;
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+
+          input {
+            width: 913px;
+            height: 43px;
+            background-color: #ffffff;
+            border: solid 1px #c7c7c7;
+            margin-left: 28px;
+            outline: none;
+            padding-left: 30px;
+            box-sizing: border-box;
+          }
+        }
+
+        .o-o {
+          width: 100%;
+          height: 43px;
+          display: flex;
+          align-items: center;
+          padding-left: 96px;
+          box-sizing: border-box;
+          margin-bottom: 25px;
+
+          label {
+            display: inline-block;
+            width: 101px;
+            height: 16px;
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+
+          input {
+            width: 913px;
+            height: 43px;
+            background-color: #ffffff;
+            border: solid 1px #c7c7c7;
+            margin-left: 28px;
+            outline: none;
+            padding-left: 30px;
+            box-sizing: border-box;
+          }
+        }
+
+        .o-one {
+          width: 100%;
+          height: 43px;
+          box-sizing: border-box;
+          display: flex;
+          align-items: center;
+          margin-bottom: 11px;
+
+          div {
+            margin-left: 30px;
+            display: flex;
+            align-items: center;
+
+            label {
+              display: flex;
+              align-items: center;
+              font-family: "MicrosoftYaHei";
+              font-size: 16px;
+              font-weight: normal;
+              font-stretch: normal;
+              line-height: 25px;
+              letter-spacing: 0px;
+              color: #333333;
+            }
+
+            /*
+              label input[type="radio"] {
+                width: 17px;
+                height: 17px;
+                appearance: none;
+                -webkit-appearance: none;
+                outline: none;
+                margin: 0;
+                cursor: pointer;
+              }
+              label input[type="radio"]:after {
+                width: 17px;
+                height: 17px;
+                display: block;
+                content: "";
+                background: url("../../../static/img/wxz.png") no-repeat;
+                background-size: 100% 100%;
+              }
+
+              label input[type="radio"]:checked:after {
+                background: url("../../../static/img/xz.png") no-repeat;
+              }*/
+          }
+
+          span {
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+        }
+
+        .o-zero {
+          margin-bottom: 11px;
+          width: 100%;
+          height: 43px;
+          padding-left: 80px;
+          box-sizing: border-box;
+          display: flex;
+          align-items: center;
+
+          div {
+            margin-left: 30px;
+            display: flex;
+            align-items: center;
+
+            label {
+              display: flex;
+              align-items: center;
+              font-family: "MicrosoftYaHei";
+              font-size: 16px;
+              font-weight: normal;
+              font-stretch: normal;
+              line-height: 25px;
+              letter-spacing: 0px;
+              color: #333333;
+            }
+
+            /*
+              label input[type="radio"] {
+                width: 17px;
+                height: 17px;
+                appearance: none;
+                -webkit-appearance: none;
+                outline: none;
+                margin: 0;
+                cursor: pointer;
+              }
+              label input[type="radio"]:after {
+                width: 17px;
+                height: 17px;
+                display: block;
+                content: "";
+                background: url("../../../static/img/wxz.png") no-repeat;
+                background-size: 100% 100%;
+              }
+
+              label input[type="radio"]:checked:after {
+                background: url("../../../static/img/xz.png") no-repeat;
+              }
+              */
+          }
+
+          span {
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+          }
+        }
+
+        .o {
+          margin-bottom: 30px;
+          width: 100%;
+          height: 43px;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          padding-left: 96px;
+          box-sizing: border-box;
+
+          label {
+            // width: 547px;
+            height: 43px;
+            display: inline-block;
+            box-sizing: border-box;
+
+            select {
+              width: 386px;
+              height: 43px;
+              background-color: #ffffff;
+              border: solid 1px #c7c7c7;
+              outline: none;
+              box-sizing: border-box;
+              padding-left: 30px;
+              box-sizing: border-box;
+
+              /* 清除默认的箭头样式 */
+              appearance: none;
+              -moz-appearance: none;
+              -webkit-appearance: none;
+              /* 右侧添加小箭头的背景图 */
+              background: url("../../../static/img/xa.png") 360px center
+                no-repeat;
+              background-size: 14px 8px;
+            }
+
+            .input {
+              width: 386px;
+              height: 43px;
+              background-color: #ffffff;
+              border: solid 1px #c7c7c7;
+              outline: none;
+              box-sizing: border-box;
+              padding-left: 30px;
+              box-sizing: border-box;
+            }
+
+            span {
+              margin-right: 20px;
+              font-family: "MicrosoftYaHei";
+              font-size: 16px;
+              font-weight: normal;
+              font-stretch: normal;
+              letter-spacing: 0px;
+              color: #333;
+              display: inline-block;
+              width: 101px;
+              text-align: right;
+              white-space: nowrap;
+            }
+          }
+        }
+      }
+
+      .btn {
+        cursor: pointer;
+        margin: 0 auto;
+        width: 230px;
+        height: 63px;
+        background-color: #e60012;
+        border-radius: 5px;
+        font-family: "MicrosoftYaHei";
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 63px;
+        letter-spacing: 0px;
+        color: #ffffff;
+        text-align: center;
+      }
+    }
+  }
+
+  .he {
+    margin: 44px auto 70px;
+    width: 598px;
+    height: 34px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .list {
+      width: 192px;
+      height: 34px;
+      line-height: 34px;
+      text-align: center;
+      background-size: 100% 100%;
+      font-family: "MicrosoftYaHei";
+      font-size: 14px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+    }
+  }
+
+  .title {
+    text-align: center;
+    font-family: "MicrosoftYaHei";
+    font-size: 22px;
+    font-weight: normal;
+    font-stretch: normal;
+    letter-spacing: 0px;
+    color: #333333;
+  }
+}
+</style>

src/views/home/NewsDetails.vue

@@ -0,0 +1,345 @@
+<template>
+  <div class="wrapper" v-if="bgData">
+    <header-nav :index_num="index_num"></header-nav>
+    <div class="box">
+      <div class="left">
+        <dl>
+          <dt>
+            <div>
+  <img class="one" :src="bgData.cover ? bgData.cover : 'imgUrl.moren'" alt />
+            </div>
+          
+            <span
+              @click="collection(bgData.id)"
+              class="iconfont icon-changyongtubiao-mianxing-"
+              :class="coll ? 'colorTrue' : 'colorFalse'"
+              v-if="1"
+            ></span>
+          </dt>
+          <dd>
+            <span class="d-o">{{bgData.title}}</span>
+          </dd>
+          <dd>
+            <span class="d-b">
+              来源:{{bgData.author}}
+              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+              发布时间:{{bgData.created_at}}
+              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+              浏览量:{{bgData.view}}
+            </span>
+          </dd>
+        </dl>
+        <div class="text" v-html="bgData.content">{{bgData.content}}</div>
+      </div>
+      <div class="right">
+        <h3>热点新闻</h3>
+        <div>
+          <template v-for="(hotArticle,index) in bgDataZ">
+            <dl :key="index" v-if="index < 4" @click="news(hotArticle.id)">
+              <dt>
+                <img :src="hotArticle.cover ? hotArticle.cover : imgUrl.moren" alt />
+              </dt>
+              <dd>
+                <span class="dd">{{hotArticle.title}}</span>
+              </dd>
+              <dd>
+                <time>{{hotArticle.created_at}}</time>
+              </dd>
+            </dl>
+          </template>
+        </div>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from '../../components/HeaderNav'
+import FooterNav from '../../components/FooterNav'
+
+export default {
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  props: {},
+  data () {
+    return {
+      index_num: 0,
+      coll: 0,
+      imgUrl: {
+        img4: require('../../../static/img/img4.png'),
+        moren: require('../../../static/img/default.jpg'),
+        img5: require('../../../static/img/img5.png'),
+        wjx: require('../../../static/img/wjx.png')
+      },
+      bgData: [],
+      bgDataZ: [],
+      id: Number
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    news (newId) {
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/article/details',
+        data: {
+          id: newId
+        }
+      }).then(res => {
+        if (res.data.data.code === 200) {
+          _this.bgData = res.data.data.data
+          _this.bgDataZ = res.data.data.hotArticle
+          _this.coll = res.data.data.is_collection
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    collection (articleId) {
+      console.log(11111)
+      if (!sessionStorage.id) {
+        alert('请先登录~')
+        return
+      }
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/article/collection',
+        data: {
+          sid:  sessionStorage.getItem("party_id"),
+          article_id: articleId
+        }
+      }).then(res => {
+        if (res.data.data.code === 200) {
+          _this.coll = _this.coll === 1 ? 0 : 1
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    getData (id) {
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/article/details',
+        data: {
+          id: id
+        }
+      }).then(res => {
+        if (res.data.data.code === 200) {
+          _this.bgData = res.data.data.data
+          _this.bgDataZ = res.data.data.hotArticle
+          _this.coll = res.data.data.is_collection
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    }
+  },
+  created () {
+    // this.id = this.$route.params.id
+    // let type = this.$route.params.type
+    // this.getData(this.id)
+  },
+  mounted () {
+    this.id = this.$route.query.id
+    // let type = this.$route.query.type
+    this.getData(this.id)
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+.wrapper {
+  min-width: 1280px;
+  box-sizing: border-box;
+
+  .box {
+    margin: 0 auto;
+    width: 1280px;
+    padding: 42px 40px 0px;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+
+    .left {
+      width: 840px;
+      height: auto;
+      background-color: #ffffff;
+      padding: 35px 30px 70px;
+      box-sizing: border-box;
+
+      dl {
+        position: relative;
+        width: 780px;
+        // height: 587px;
+        box-sizing: border-box;
+
+        dd {
+          width: 95%;
+          .d-o {
+            display: inline-block;
+            margin: 28px 0 23px;
+            font-family: "MicrosoftYaHei";
+            font-size: 24px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333333;
+            display: -webkit-box;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+            word-wrap: break-word;
+            white-space: normal;
+          }
+
+          .d-b {
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #999999;
+          }
+        }
+
+        dt {
+          .one {
+            width: 780px;
+            height: 494px;
+          }
+
+          .colorFalse {
+            font-size: 28px;
+            color: #ccc;
+            position: absolute;
+            right: 0%;
+            bottom: 5%;
+          }
+
+          .colorTrue {
+            font-size: 28px;
+            color: #fec300;
+            position: absolute;
+            right: 0%;
+            bottom: 5%;
+          }
+        }
+      }
+
+      .text {
+        margin: 38px auto 0px;
+        overflow: hidden;
+        width: 775px;
+        height: auto;
+        font-family: "MicrosoftYaHei";
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 40px;
+        letter-spacing: 0px;
+        color: #666666;
+
+        p {
+          text-indent: 1em;
+          line-height: 0px !important;
+        }
+      }
+    }
+
+    .right {
+      width: 301px;
+      height: 1282px;
+      background-color: #ffffff;
+      border: solid 1px rgba($color: #ccc, $alpha: 0.48);
+      padding-top: 33px;
+      box-sizing: border-box;
+
+      div {
+        display: flex;
+        flex-direction: column;
+        justify-content: flex-start;
+        align-items: center;
+      }
+
+      dl {
+        margin-bottom: 30px;
+        dt {
+          img {
+            width: 260px;
+            height: 144px;
+            border-radius: 10px;
+          }
+        }
+        dd {
+          span {
+            margin-top: 10px;
+            display: inline-block;
+            width: 266px;
+            font-family: "MicrosoftYaHei";
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 30px;
+            letter-spacing: 1px;
+            color: #333333;
+            display: -webkit-box;
+            overflow: hidden;
+            -o-text-overflow: ellipsis;
+            text-overflow: ellipsis;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+            word-wrap: break-word;
+            white-space: normal;
+          }
+
+          time {
+            display: inline-block;
+            width: 266px;
+            text-align: right;
+            font-family: "MicrosoftYaHei";
+            font-size: 16px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 30px;
+            letter-spacing: 1px;
+            color: #999999;
+          }
+        }
+      }
+
+      h3 {
+        margin-left: 20px;
+        margin-bottom: 30px;
+        font-family: "MicrosoftYaHei";
+        font-size: 22px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+      }
+    }
+  }
+
+  .footer {
+    margin-top: 80px;
+  }
+}
+</style>

src/views/home/NewsList.vue

@@ -0,0 +1,251 @@
+<template>
+  <div class="wrapper">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="box">
+      <template v-if="cd > 0">
+        <!-- @click="$jParams('newsDetails',{id:info.id,type:getType})" -->
+        <router-link id="news" v-for="(info,index) in bgData.info" :key="index" :to="{path:'/newsDetails',query:{id:info.id}}" target="_blank">
+          <div class="news-box">
+            <img :src="info.cover ? info.cover : 'moren'" />
+            <section>
+              <h3>{{info.title}}</h3>
+              <aside>
+                <span>来源:{{info.author}}</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                <span>发布时间:{{info.created_at}}</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                <span>浏览量:{{info.view}}</span>
+              </aside>
+              <p>{{info.content}}</p>
+            </section>
+          </div>
+        </router-link>
+      </template>
+
+      <template v-else>
+          <span>没有内容了呦</span>
+      </template>
+
+      <!-- 分页按钮 -->
+      <div class="page">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          :pager-count="5"
+          background
+          layout="prev, pager, next"
+          :total="totalCount"
+        ></el-pagination>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from '../../components/HeaderNav'
+import FooterNav from '../../components/FooterNav'
+
+export default {
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  props: {},
+  data () {
+    return {
+      moren: require('../../../static/img/default.jpg'),
+      index_num: 0,
+      pageSize: 1, /** 每页的条数 */
+      currentPage: 1, /** 当前页数 */
+      totalCount: 1, /** 总页数 */
+      bgData: [],
+      getType: null,
+      cd: Number
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    getData () {
+      let _this = this
+      this.$http({
+        method: 'get',
+        url: 'v1/article/list',
+        params: {
+          page: _this.currentPage,
+          type: _this.getType
+        }
+      }).then(res => {
+        if (res.data.data.code === 200) {
+          _this.bgData = res.data.data.data
+          _this.cd = _this.bgData.info.length
+          _this.totalCount = _this.bgData.allPage
+        } else {
+          _this.$message.error('请求数据有问题！')
+        }
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    handleSizeChange (val) {
+      this.pageSize = val
+      this.getPackData()
+    },
+    handleCurrentChange (val) {
+      this.currentPage = val
+      this.getData()
+      this.getPackData()
+    },
+    getPackData () { }
+  },
+  created () {
+    this.getType = this.$route.params.type
+    this.currentPage = Number(localStorage.getItem('pagination')) || 1
+    this.getType = this.getType || Number(localStorage.getItem('getType'))
+    this.handleCurrentChange(this.currentPage)
+  },
+  mounted () { },
+  beforeUpdate () {
+    localStorage.setItem('pagination', this.currentPage)
+    localStorage.setItem('getType', this.getType)
+  },
+  beforeDestroy () {
+    // localStorage.clear()
+    localStorage.setItem('pagination', this.currentPage)
+    localStorage.setItem('getType', this.getType)
+  },
+  destroyed () {
+    localStorage.setItem('pagination', 1)
+    localStorage.setItem('getType', this.getType)
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+.wrapper {
+  min-width: 1280px;
+  box-sizing: border-box;
+  position: relative;
+
+  #box {
+    width: 1200px;
+    background-color: #ffffff;
+    margin: 40px auto 80px;
+    box-sizing: border-box;
+    padding: 21px 30px 100px 11px;
+
+    .news-box {
+      width: 1159px;
+      height: 255px;
+      padding: 14px 7px 40px 19px;
+      box-sizing: border-box;
+      border-bottom: 1px solid #e6e6e6;
+      margin-bottom: 26px;
+
+      img {
+        width: 290px;
+        height: 200px;
+        border-radius: 10px;
+      }
+
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      section {
+        width: 813px;
+        height: 96%;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        align-items: flex-start;
+        h3 {
+          font-family: "MicrosoftYaHei";
+          font-size: 22px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #333333;
+        }
+
+        aside {
+          // width: 434px;
+          height: 17px;
+          font-family: "MicrosoftYaHei";
+          font-size: 16px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #999999;
+        }
+
+        p {
+          width: 813px;
+          height: 100px;
+          font-family: "MicrosoftYaHei";
+          font-size: 18px;
+          font-weight: normal;
+          font-stretch: normal;
+          line-height: 36px;
+          letter-spacing: 0px;
+          color: #666666;
+          overflow: hidden;
+          -o-text-overflow: clip;
+          text-overflow: clip;
+          -webkit-line-clamp: 3;
+          -webkit-box-orient: vertical;
+          word-wrap: break-word;
+          white-space: normal;
+        }
+      }
+    }
+
+    .page {
+      margin-top: 60px;
+      height: 36px;
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+
+      /deep/ .el-pagination.is-background .el-pager li {
+        color: #333 !important;
+      }
+
+      /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+        background-color: #e60012;
+        color: #fff !important;
+      }
+
+      /deep/ .el-icon.el-icon-arrow-left::before {
+        content: "上一页";
+        font-family: "MicrosoftYaHei";
+        font-size: 12px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666;
+      }
+
+      /deep/ .el-pagination .btn-prev {
+        width: 80px;
+      }
+
+      /deep/ .el-pagination .btn-next {
+        width: 80px;
+      }
+
+      /deep/ .el-icon.el-icon-arrow-right::before {
+        content: "下一页";
+        font-family: "MicrosoftYaHei";
+        font-size: 12px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666;
+      }
+    }
+  }
+}
+</style>

src/views/middetail.vue

@@ -0,0 +1,201 @@
+<template>
+<div>
+    <header-nav :index_num="index_num"></header-nav>
+  <div class="box">
+
+    <div class="box1">
+      <p class="title">一、项目申报书</p>
+      <a class="link">预览</a>|
+      <a class="link">下载</a>
+    </div>
+    <div class="box1">
+      <p class="title">二、项目实施方案</p>
+      <a class="link">预览</a>|
+      <a class="link">下载</a>
+    </div>
+    <div class="box1">
+      <p class="title">三、中期报告</p>
+    </div>
+    <div class="box1">
+      <p class="title">1.基本信息</p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">项目名称：</span>
+        <span>世界婚博会</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">机构名称：</span>
+        <span>世界婚博会</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">项目起止日期：</span>
+        <span>世界婚博会</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">项目执行团队人员构成及分工：</span>
+        <span>世界婚博会</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p class="article">
+        <span class="title">2.项目发展性状况：</span>
+        <span>我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+        <p class="article">
+<span class="title">3.1 项目目标</span>
+        <span>我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+        </p>
+        
+    </div>
+    <div class="box1">
+      <p class="article">
+        <span class="title">3.2 项目活动</span>
+        <span >我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p class="article">
+        <span class="title">3.3项目中期完成目标与活动对照表</span>
+        <span class="article">我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">4项目取得的成效</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p  class="article">
+        <span class="title">4.1 项目活动</span>
+        <span>我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p class="article">
+        <span class="title">4.2 项目产生的其他重要影响</span>
+        <span >我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p class="article">
+        <span class="title">4.3 媒体报道</span>
+        <span >我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p  class="article">
+        <span class="title">5.对项目实施至今整体情况的总结：</span>
+        <span>我国仍处于并将长期处于社会主义初级阶段，是最大的国情和实际。“我们开展各项工作，要一切从实际出发，牢牢立足这个最大国情和实际，不要超越阶段。从能源来看，我国‘富煤少油缺气’的资源禀赋，决定了煤炭在较长一个时期内作为我国主体能源的地位不会发生变化，这就要求我们坚持从煤炭资源丰富的国情出发，切实抓好煤炭清洁高效利用。”章建华说。</span>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">6.项目财务报告</span>
+        <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">四、项目调整申请表及批复意见表</span>
+        <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+    <div class="box1">
+      <p>
+        <span class="title">五、活动类/培训类/会议类材料</span>
+      </p>
+    </div>
+        <div class="box1">
+      <p>
+        <span>xxx活动</span>
+           <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+            <div class="box1">
+      <p>
+        <span>xxx活动</span>
+           <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+            <div class="box1">
+      <p>
+        <span>xxx活动</span>
+           <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+        <div class="box1">
+      <p>
+        <span class="title">六、财务中期预算表</span>
+        <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+            <div class="box1">
+      <p>
+        <span class="title">七、其他类 </span>
+        <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+            <div class="box1">
+      <p>
+        <span class="title">八、中期PPT文件 </span>
+        <a class="link">预览</a>|
+        <a class="link">下载</a>
+      </p>
+    </div>
+  </div>
+</div>
+
+</template>
+
+<script>
+import HeaderNav from "../components/HeaderNav";
+export default {
+  name: "middetail",
+  components: {
+    HeaderNav
+  },
+  data() {
+    return {
+      index_num: 0
+    };
+  }
+};
+</script>
+
+<style lang='scss' scoped>
+.box {
+        margin-left: 28px;
+    margin-top: 16px;
+  .box1{
+    display: flex;
+    margin-top:27px;
+  }
+  .title {
+    font-weight: bold;
+    margin-right: 11px;
+  }
+  .link {
+    color: #5f73e1;
+  }
+  .article{
+      width: 1000px;
+      line-height: 30px;
+  }
+}
+</style>

src/views/personal/Apply.vue

@@ -0,0 +1,758 @@
+<template>
+  <div class="w" :style="{ height: num + 'px' }">
+    <div class="img-box" v-if="is_value">
+      <img class="img" :src="imgUrl.tg" v-if="bgData.examine == 1" />
+      <img class="img" :src="imgUrl.btg" v-if="bgData.examine == 2" />
+      <img class="img" :src="imgUrl.dsh" v-if="bgData.examine == 0" />
+    </div>
+    <form
+      v-if="is_value"
+      action
+      method
+      enctype="multipart/form-data"
+      onsubmit="return false"
+    >
+      <div class="items" v-if="!zhuangtai">
+        <h3>基本信息</h3>
+        <!-- start -->
+        <div class="item">
+          <label for>社会组织名称:</label>
+          <input class="input0" type="text" :value="name" disabled />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>社会组织类型:</label>
+          <select class="input1" name="type" disabled>
+            <option :value="bgData.type">{{ bgData.type }}</option>
+          </select>
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>流动党员数量:</label>
+          <input
+            class="input0"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.flow_party_person"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>已有党员数量:</label>
+          <input
+            class="input0"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.party_person"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>从业人员总数:</label>
+          <input
+            class="input0"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.work_person"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>党组织名称:</label>
+          <input
+            class="input0"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.party_name"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>是否建立党组织:</label>
+          <label class="label" for>
+            <input
+              type="radio"
+              name="is_reg_party"
+              v-model="bgData.is_reg_party"
+              value="1"
+              :disabled="bgData.examine === 0"
+            />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+            <input
+              type="radio"
+              name="is_reg_party"
+              v-model="bgData.is_reg_party"
+              value="2"
+              :disabled="bgData.examine === 0"
+            />&nbsp;&nbsp;否
+          </label>
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>是否建立“功能型”党组织:</label>
+          <label class="label" for>
+            <input
+              type="radio"
+              :disabled="bgData.examine === 0"
+              value="1"
+              name="is_reg_fun_party"
+              v-model="bgData.is_reg_fun_party"
+            />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+            <input
+              type="radio"
+              :disabled="bgData.examine === 0"
+              name="is_reg_fun_party"
+              v-model="bgData.is_reg_fun_party"
+              value="2"
+            />
+            &nbsp;&nbsp;否
+          </label>
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>登记管理机关:</label>
+          <input
+            class="input2"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.reg_manage"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>业务主管单位:</label>
+          <input
+            class="input2"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.supervisor"
+          />
+        </div>
+        <!-- end -->
+        <!-- start -->
+        <div class="item">
+          <label for>隶属的上一级党组织名称:</label>
+          <input
+            class="input2"
+            type="text"
+            :disabled="bgData.examine === 0"
+            v-model="bgData.party_pname"
+          />
+        </div>
+        <!-- end -->
+        <div class="btn" @click="anNui()">下一页</div>
+      </div>
+      <div class="items" v-if="zhuangtai">
+        <div>
+          <h3>党组织书记情况</h3>
+          <!-- start -->
+          <div class="it">
+            <label for>姓名:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.sec_name"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>性别:</label>
+            <label class="label" for>
+              <input
+                type="radio"
+                name="sec_sex"
+                v-model="bgData.sec_sex"
+                value="1"
+                :disabled="bgData.examine === 0"
+              />&nbsp;&nbsp;男&nbsp;&nbsp;&nbsp;&nbsp;
+              <input
+                type="radio"
+                name="sec_sex"
+                :disabled="bgData.examine === 0"
+                v-model="bgData.sec_sex"
+                value="0"
+              />
+              &nbsp;&nbsp;女
+            </label>
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>年龄:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.sec_age"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>行政职务:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.sec_job"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>近三年参加上级党组织培训次数:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.sec_study"
+            />
+          </div>
+          <!-- end -->
+        </div>
+        <div style="margin-top:60px;">
+          <h3>党组织信息</h3>
+          <!-- start -->
+          <div class="it">
+            <label for>近三年发展党员数:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.near_party_person"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>是否建立群团组织:</label>
+            <label class="label" for>
+              <input
+                type="radio"
+                name="is_reg_group"
+                v-model="bgData.is_reg_group"
+                :disabled="bgData.examine === 0"
+                value="1"
+              />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+              <input
+                type="radio"
+                name="is_reg_group"
+                v-model="bgData.is_reg_group"
+                :disabled="bgData.examine === 0"
+                value="2"
+              />
+              &nbsp;&nbsp;否
+            </label>
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>专职党务工作者人数:</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.major_party_person"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>是否选派党建工作指导员:</label>
+            <label class="label" for>
+              <input
+                type="radio"
+                name="is_choice_instructor"
+                :disabled="bgData.examine === 0"
+                v-model="bgData.is_choice_instructor"
+                value="1"
+              />&nbsp;&nbsp;是&nbsp;&nbsp;&nbsp;&nbsp;
+              <input
+                type="radio"
+                name="is_choice_instructor"
+                v-model="bgData.is_choice_instructor"
+                :disabled="bgData.examine === 0"
+                value="2"
+              />
+              &nbsp;&nbsp;否
+            </label>
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>党组织年度活动经费(万元):</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.year_money"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div class="it">
+            <label for>党组织年度活动场所面积(平米):</label>
+            <input
+              class="input0"
+              type="text"
+              :disabled="bgData.examine === 0"
+              v-model="bgData.active_year"
+            />
+          </div>
+          <!-- end -->
+          <!-- start -->
+          <div id="btn">
+            <button type="button" v-if="bgData.examine !== 0" @click="anNui()" style="cursor:pointer">
+              上一页
+            </button>
+            <button type="submit" v-if="bgData.examine !== 0" @click="submit()" style="cursor:pointer">
+              重新提交
+            </button>
+          </div>
+          <!-- end -->
+        </div>
+      </div>
+    </form>
+    <div class="img-g" v-if="!is_value" @click="$jump('applyFor')">
+      <!-- <div class="img-bx">
+        <img :src="imgUrl.wjx" alt />
+        <span>申请成为党组织</span>
+      </div>-->
+      <img :src="imgUrl.apple" alt />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      imgUrl: {
+        tg: require('../../../static/img/tg.png'),
+        btg: require('../../../static/img/btg.png'),
+        dsh: require('../../../static/img/dsh.png'),
+        xa: require('../../../static/img/xa.png'),
+        wjx: require('../../../static/img/wjx.png'),
+        apple: require('../../../static/img/apple.png')
+      },
+      state: 0,
+      zhuangtai: false,
+      num: 1050,
+      bgData: [],
+      is_value: Boolean,
+      name: '',
+      typeVal: []
+    }
+  },
+  computed: {},
+  watch: {
+    num (newValue, oldValue) {
+      this.$emit('listenToChildExen', this.num)
+    }
+  },
+  methods: {
+    submit () {
+      for (var key of Object.keys(this.bgData)) {
+        if (this.bgData[key] === '') {
+          alert('以上所有内容都不可为空呦！')
+          return
+        }
+      }
+
+      let _this = this
+      for (var list in _this.typeVal) {
+        if (_this.typeVal[list] === _this.bgData.type) {
+          _this.bgData.type = list
+        }
+      }
+
+      this.$http({
+        method: 'post',
+        url: 'v1/user/resubmit',
+        data: {
+          object: _this.bgData
+        }
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            alert(res.data.message)
+            _this.$router.go(1)
+          } else {
+            alert(res.data.message)
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    getData () {
+      let sid = sessionStorage.id
+      let _this = this
+      this.$http({
+        method: 'get',
+        url: 'v1/user/get-info',
+        params: {
+          sid: sid
+        }
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            if (res.data.data === null) {
+              _this.is_value = false
+            } else {
+              _this.is_value = true
+            }
+            _this.bgData = res.data.data
+          } else {
+            _this.$message.error('请求数据有问题！')
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    getType () {
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/user/get-society-type',
+        data: {}
+      })
+        .then(res => {
+          _this.typeVal = res.data.data
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    anNui () {
+      if (this.zhuangtai) {
+        this.num = 1050
+        this.zhuangtai = !this.zhuangtai
+      } else {
+        this.num = 1200
+        this.zhuangtai = !this.zhuangtai
+      }
+    },
+    sendMsgToParent () {
+      this.$emit('listenToChildExen', this.num)
+    }
+  },
+  created () {
+    this.name = sessionStorage.name
+    this.getData()
+    this.getType()
+  },
+  mounted () {
+    this.sendMsgToParent()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.w {
+  width: 934px;
+  background-color: #ffffff;
+  padding: 35px 30px 0px;
+  box-sizing: border-box;
+  position: relative;
+
+  .img-g {
+    width: 100%;
+    /*
+    display: flex;
+    justify-content: flex-end;
+    */
+    cursor: pointer;
+    text-align: center;
+    /*
+    .img-bx {
+      width: 131px;
+      height: 27px;
+      background-image: linear-gradient(35deg, #f82747 0%, #fe5b2c 100%);
+      border-radius: 25px;
+      text-align: center;
+      line-height: 27px;
+      position: relative;
+
+      img {
+        width: 15px;
+        height: 15px;
+        position: absolute;
+        left: -5%;
+        top: 24%;
+      }
+
+      span {
+        font-family: "MicrosoftYaHei";
+        font-size: 14px;
+        font-weight: bold;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #fbfffb;
+        text-shadow: 2px 4px 7px rgba(175, 14, 39, 0.83);
+      }
+    }
+    */
+  }
+
+  .items {
+    width: 100%;
+
+    label input[type='radio'] {
+      width: 17px;
+      height: 17px;
+      appearance: none;
+      -webkit-appearance: none;
+      outline: none;
+      margin: 0;
+      cursor: pointer;
+    }
+    label input[type='radio']:after {
+      width: 17px;
+      height: 17px;
+      display: block;
+      content: '';
+      background: url('../../../static/img/wxz.png') no-repeat;
+      background-size: 100% 100%;
+    }
+
+    label input[type='radio']:checked:after {
+      background: url('../../../static/img/xz.png') no-repeat;
+    }
+
+    h3 {
+      width: 874px;
+      height: 37px;
+      padding-left: 29px;
+      box-sizing: border-box;
+      font-family: 'MicrosoftYaHei';
+      font-size: 20px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #333333;
+      border-bottom: 1px solid #dedede;
+      margin-bottom: 60px;
+    }
+
+    .btn {
+      width: 230px;
+      height: 63px;
+      background-color: #e60012;
+      border-radius: 5px;
+      margin: 60px auto 0px;
+      text-align: center;
+      line-height: 63px;
+      font-family: 'MicrosoftYaHei';
+      font-size: 26px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #ffffff;
+      cursor: pointer;
+    }
+
+    .item {
+      width: 100%;
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      margin-bottom: 24px;
+
+      .label {
+        display: inline-block;
+        width: 386px;
+        height: 43px;
+        margin-left: 30px;
+        text-align: left;
+      }
+
+      label {
+        width: 197px;
+        height: 43px;
+        font-family: 'MicrosoftYaHei';
+        font-size: 16px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 43px;
+        text-align: right;
+        letter-spacing: 0px;
+        color: #333333;
+      }
+      .input0 {
+        margin-left: 30px;
+        width: 386px;
+        height: 43px;
+        background-color: #ffffff;
+        border: solid 1px #c7c7c7;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+        padding-left: 30px;
+        box-sizing: border-box;
+        outline: none;
+      }
+
+      .input1 {
+        margin-left: 30px;
+        /* 清除默认的箭头样式 */
+        appearance: none;
+        -moz-appearance: none;
+        -webkit-appearance: none;
+        /* 右侧添加小箭头的背景图 */
+        background: url('../../../static/img/xa.png') 360px center no-repeat;
+        background-size: 14px 8px;
+        width: 386px;
+        height: 43px;
+        background-color: #ffffff;
+        border: solid 1px #c7c7c7;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+        padding-left: 30px;
+        box-sizing: border-box;
+        outline: none;
+      }
+
+      .input2 {
+        margin-left: 30px;
+        width: 647px;
+        height: 43px;
+        background-color: #ffffff;
+        border: solid 1px #c7c7c7;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+        padding-left: 30px;
+        box-sizing: border-box;
+        outline: none;
+      }
+    }
+
+    #btn {
+      margin: 60px auto 0px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      width: 500px;
+
+      button[type='submit'] {
+        width: 230px;
+        height: 63px;
+        background-color: #e60012;
+        border-radius: 5px;
+        outline: none;
+        border: 0;
+        font-family: 'MicrosoftYaHei';
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 63px;
+        letter-spacing: 0px;
+        color: #ffffff;
+      }
+
+      button[type='button'] {
+        width: 230px;
+        height: 63px;
+        background-color: #ff9800;
+        border-radius: 5px;
+        outline: none;
+        border: 0;
+        font-family: 'MicrosoftYaHei';
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 63px;
+        letter-spacing: 0px;
+        color: #ffffff;
+      }
+    }
+
+    .it {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-bottom: 24px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      .label {
+        display: inline-block;
+        width: 386px;
+        height: 43px;
+        margin-left: 30px;
+        text-align: left;
+      }
+
+      label {
+        width: 229px;
+        height: 43px;
+        font-family: 'MicrosoftYaHei';
+        font-size: 16px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 43px;
+        text-align: right;
+        letter-spacing: 0px;
+        color: #333333;
+      }
+
+      .input0 {
+        margin-left: 30px;
+        width: 386px;
+        height: 43px;
+        background-color: #ffffff;
+        border: solid 1px #c7c7c7;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+        padding-left: 30px;
+        box-sizing: border-box;
+        outline: none;
+      }
+    }
+  }
+
+  .img-box {
+    width: 158px;
+    height: 121px;
+    opacity: 0.5;
+    position: absolute;
+    right: 0%;
+    top: 0%;
+    img {
+      width: 158px;
+      height: 121px;
+    }
+  }
+}
+</style>

src/views/personal/Collection.vue

@@ -0,0 +1,278 @@
+<template>
+  <div class="wr">
+    <template v-for="(item, index) in collect">
+      <div class="page" :key="index">
+        <time>
+          <span class="iconfont icon-shizhong"></span>
+          {{ item.date }}
+        </time>
+        <div id="box">
+          <template v-for="(list, index) in item.data"> 
+            <div class="box" :key="index" @click="tonewsdetail(list.article_id)">
+              <span class="iconfont icon-changyongtubiao-mianxing-"></span>
+              <aside>
+                <span class="span1">{{list.title}}</span>
+                <span class="span2">来源板块：{{list.type}}</span>
+              </aside>
+              <p>
+               {{list.content}}
+              </p>
+            </div>
+          </template>
+        </div>
+      </div>
+    </template>
+    <!-- 分页按钮 -->
+    <div class="pages">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage"
+        :page-size="pageSize"
+        background
+        layout="prev, pager, next"
+        :total="pageall"
+      ></el-pagination>
+    </div>
+    <!-- end -->
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      pageSize: 1,
+      currentPage: 1,
+      totalCount: 1,
+      mData: [
+        { time: '2019-10-14', shujv: [1, 2, 3, 4] },
+        { time: '2019-10-14', shujv: [1, 2, 3, 4, 5] }
+      ],
+      num: 1019,
+      collect:[],
+      pageall:1
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    tonewsdetail(e){
+      console.log(e)
+         let routeUrl = this.$router.resolve({
+        path: '/newsDetails',
+        query: { id: e }
+      })
+      window.open(routeUrl.href, '_blank')
+    },
+    getData (e) {
+      let id = sessionStorage.id
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/user/collection',
+        data: {
+          id: id,
+          page:e?e:1
+        }
+      })
+        .then(res => {
+          if (res.data.data.code === 200) {
+            console.log(res)
+            this.collect=res.data.data.data.info
+            this.pageall=res.data.data.data.allPage
+
+          } else {
+            _this.$message.error('请求数据有问题！')
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    sendMsgToParent () {
+      this.$emit('listenToChildExen', this.num)
+    },
+    handleSizeChange (val) {
+      this.pageNum = val
+      this.getPackData()
+    },
+    handleCurrentChange (val) {
+      this.currentPage = val
+      this.getPackData()
+    },
+    getPackData () {}
+  },
+  created () {
+    this.currentPage = Number(localStorage.getItem('pagination')) || 1
+    this.handleCurrentChange(this.currentPage)
+    this.getData()
+  },
+  mounted () {
+    this.sendMsgToParent()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.wr {
+  width: 934px;
+  height: 1019px;
+  background-color: #ffffff;
+  box-sizing: border-box;
+  padding-top: 35px;
+
+  .pages {
+    margin-top: 60px;
+    margin-right: 24px;
+    height: 36px;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+
+    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+      background-color: #e60012;
+    }
+
+    /deep/ .el-icon.el-icon-arrow-left::before {
+      content: '上一页';
+      font-family: 'MicrosoftYaHei';
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 1px;
+      color: #646464;
+    }
+
+    /deep/ .el-pagination .btn-prev {
+      width: 80px;
+    }
+
+    /deep/ .el-pagination .btn-next {
+      width: 80px;
+    }
+
+    /deep/ .el-icon.el-icon-arrow-right::before {
+      content: '下一页';
+      font-family: 'MicrosoftYaHei';
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 1px;
+      color: #646464;
+    }
+  }
+
+  .page {
+    margin-bottom: 60px;
+    height: 364px;
+    box-sizing: border-box;
+
+    #box {
+      overflow-y: scroll;
+      height: 375px;
+      padding-bottom: 40px;
+      box-sizing: border-box;
+
+      &::-webkit-scrollbar {
+        width: 0px;
+      }
+
+      display: flex;
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
+    .box {
+      width: 875px;
+      height: 135px;
+      box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.15);
+      border-radius: 5px;
+      margin-top: 40px;
+      padding: 31px 23px 32px 28px;
+      box-sizing: border-box;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      &:nth-of-type(1) {
+        margin-top: 30px;
+      }
+
+      .iconfont {
+        font-size: 23px;
+        color: #fec300;
+        position: absolute;
+        right: 23px;
+        top: 23px;
+      }
+
+      aside {
+        width: 689px;
+        height: 23px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        .span1 {
+          display: inline-block;
+          width: 60%;
+          font-family: 'MicrosoftYaHei';
+          font-size: 22px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #333333;
+          overflow: hidden;
+          -o-text-overflow: ellipsis;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .span2 {
+          font-family: 'MicrosoftYaHei';
+          font-size: 16px;
+          font-weight: normal;
+          letter-spacing: 1px;
+          color: #999999;
+        }
+      }
+
+      p {
+        height: 20px;
+        line-height: 20px;
+        width: 100%;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666666;
+        overflow: hidden;
+        -o-text-overflow: ellipsis;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+
+    time {
+      font-family: 'MicrosoftYaHei';
+      font-size: 18px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #666666;
+      display: flex;
+      align-items: center;
+      margin-left: 30px;
+
+      .iconfont {
+        font-size: 24px;
+        margin-right: 24px;
+      }
+    }
+  }
+}
+</style>

src/views/personal/Collection1.vue

@@ -0,0 +1,279 @@
+<template>
+  <div>
+    <div class="wr">
+    <template v-for="(item, index) in list">
+      <div class="page" :key="index">
+        <time>
+          <span class="iconfont icon-shizhong"></span>
+          {{item.date}}
+        </time>
+        <div id="box">
+          <template v-for="(list, index) in item.data">
+            <div class="box" :key="index">
+              <!-- <span class="iconfont icon-changyongtubiao-mianxing-"></span> -->
+              <aside>
+                <span class="span1">活动策划是提高市场占有率的有效行为</span>
+                <!-- <span class="span2">来源板块：{{list.society_name}}</span> -->
+              </aside>
+              <p>
+                {{list.content}}
+              </p>
+            </div>
+          </template>
+        </div>
+      </div>
+    </template>
+    <!-- 分页按钮 -->
+ 
+    <!-- end -->
+  </div>
+     <div class="pages">
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage"
+        :page-size="pageSize"
+        background
+        layout="prev, pager, next"
+        :total="pageall"
+      ></el-pagination>
+    </div>
+  </div>
+  
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      pageSize: 1,
+      currentPage: 1,
+      totalCount: 1,
+      pageall:1,
+      mData: [
+        { time: '2019-10-14', shujv: [1, 2, 3, 4] },
+        { time: '2019-10-14', shujv: [1, 2, 3, 4, 5] }
+      ],
+      num: 1019,
+      list:[]
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    getData (e) {
+      let id = sessionStorage.id
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/user/get-contact-list',
+        data: {
+          page:e?e:1,
+          sid:sessionStorage.getItem("party_id") 
+        }
+      })
+        .then(res => {
+          if (res.data.data.code === 200) {
+            console.log(res)
+          
+            this.list=res.data.data.data.info
+              console.log(this.list)
+              this.pageall=res.data.data.data.allPage
+      
+          } else {
+            _this.$message.error('请求数据有问题！')
+          }
+        })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    sendMsgToParent () {
+      this.$emit('listenToChildExen', this.num)
+    },
+    handleSizeChange (val) {
+      this.pageNum = val
+      this.getPackData()
+    },
+    handleCurrentChange (val) {
+      this.currentPage = val
+      // this.getPackData()
+      this.getData(val)
+    },
+    getPackData () {}
+  },
+  created () {
+    this.currentPage = Number(localStorage.getItem('pagination')) || 1
+    this.handleCurrentChange(this.currentPage)
+    this.getData()
+  },
+  mounted () {
+    this.sendMsgToParent()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .pages {
+    margin-top: 34px;
+    margin-right: 24px;
+    height: 36px;
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+
+    /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+      background-color: #e60012;
+    }
+
+    /deep/ .el-icon.el-icon-arrow-left::before {
+      content: '上一页';
+      font-family: 'MicrosoftYaHei';
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 1px;
+      color: #646464;
+    }
+
+    /deep/ .el-pagination .btn-prev {
+      width: 80px;
+    }
+
+    /deep/ .el-pagination .btn-next {
+      width: 80px;
+    }
+
+    /deep/ .el-icon.el-icon-arrow-right::before {
+      content: '下一页';
+      font-family: 'MicrosoftYaHei';
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 1px;
+      color: #646464;
+    }
+  }
+.wr {
+  width: 934px;
+  height: 951px;
+  background-color: #ffffff;
+  box-sizing: border-box;
+  padding-top: 35px;
+  overflow-y: auto;
+
+
+
+  .page {
+    margin-bottom: 60px;
+    height: 364px;
+    box-sizing: border-box;
+
+    #box {
+      overflow-y: scroll;
+      height: 375px;
+      padding-bottom: 40px;
+      box-sizing: border-box;
+
+      &::-webkit-scrollbar {
+        width: 0px;
+      }
+
+      display: flex;
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
+    .box {
+      width: 875px;
+      height: 135px;
+      box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.15);
+      border-radius: 5px;
+      margin-top: 40px;
+      padding: 31px 23px 32px 28px;
+      box-sizing: border-box;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      &:nth-of-type(1) {
+        margin-top: 30px;
+      }
+
+      .iconfont {
+        font-size: 23px;
+        color: #fec300;
+        position: absolute;
+        right: 23px;
+        top: 23px;
+      }
+
+      aside {
+        width: 689px;
+        height: 23px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        .span1 {
+          display: inline-block;
+          width: 60%;
+          font-family: 'MicrosoftYaHei';
+          font-size: 22px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #333333;
+          overflow: hidden;
+          -o-text-overflow: ellipsis;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        .span2 {
+          font-family: 'MicrosoftYaHei';
+          font-size: 16px;
+          font-weight: normal;
+          letter-spacing: 1px;
+          color: #999999;
+        }
+      }
+
+      p {
+        height: 20px;
+        line-height: 20px;
+        width: 100%;
+        font-family: 'MicrosoftYaHei';
+        font-size: 18px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 1px;
+        color: #666666;
+        overflow: hidden;
+        -o-text-overflow: ellipsis;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+
+    time {
+      font-family: 'MicrosoftYaHei';
+      font-size: 18px;
+      font-weight: normal;
+      font-stretch: normal;
+      letter-spacing: 0px;
+      color: #666666;
+      display: flex;
+      align-items: center;
+      margin-left: 30px;
+
+      .iconfont {
+        font-size: 24px;
+        margin-right: 24px;
+      }
+    }
+  }
+}
+</style>

src/views/personal/Declare.vue

@@ -0,0 +1,867 @@
+<template>
+  <div class="wra">
+    <div id="box">
+      <div class="bottom">
+        <!-- 公告 -->  
+        <div class="top">
+          <img :src="imgUrl.xlb" alt />
+          <!-- {{bgValue.announcement[0].name}} -->
+          <div v-if="bgValue.announcement[0].name.length">
+            <span>
+              {{
+              bgValue.announcement[0].name + bgValue.announcement[0].pro_content
+              }}
+            </span>
+            <time>{{ bgValue.announcement[0].protime }}</time>
+          </div>
+          <div v-else>
+            <span>暂无项目申报内容</span>
+            <time>
+              {{
+              new Date().getFullYear() +
+              "-" +
+              (new Date().getMonth() + 1) +
+              "-" +
+              new Date().getDate()
+              }}
+            </time>
+          </div>
+        </div>
+        <!-- 表格 -->
+        <div class="table">
+          <div class="top-p">项目概览</div>
+          <div class="top-b">
+            <div>
+              <section>
+                <span>初筛通过</span>
+                <span>{{ bgValue.overview_one }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>立项通过</span>
+                <span>{{ bgValue.overview_two }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>执行中</span>
+                <span>{{ bgValue.overview_three }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>已完结</span>
+                <span>{{ bgValue.overview_four }}</span>
+              </section>
+            </div>
+          </div>
+        </div>
+        <!-- 下拉框 -->
+        <div class="select">
+          <div >
+            <el-date-picker
+              v-model="value_date"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="bolting()"
+            ></el-date-picker>
+          </div>
+                   <el-select v-model="typeval" placeholder="请选择项目类型" @change="prolist" style="text-align:center">
+            <el-option
+              v-for="(i,j) in bgValue.type"
+              :key="j"
+               :label="bgValue.type[j]"
+              :value="j"
+            ></el-option>
+          </el-select>
+          <!-- <select class="two" name="type" v-model="type_value" @change="bolting()">
+            <option>项目类型</option>
+            <template v-for="(type, index) in bgValue.type">
+              <option :key="index" :value="index">{{ type }}</option>
+            </template>
+          </select> -->
+
+              <el-select v-model="statusval" placeholder="请选择项目状态" @change="prolist">
+            <el-option
+              v-for="(i,j) in bgValue.status"
+              :key="j"
+               :label="bgValue.status[j]"
+              :value="j"
+            ></el-option>
+          </el-select>
+          <!-- <select class="two" name="type" v-model="status_value" @change="bolting()">
+            <option>项目状态</option>
+            <template v-for="(status, index) in bgValue.status">
+              <option :key="index" :value="index">{{ status }}</option>
+            </template>
+          </select> -->
+
+           <el-select v-model="areaval" placeholder="请选择落地区域" @change="prolist">
+            <el-option
+              v-for="(i,j) in bgValue.area"
+              :key="j"
+               :label="bgValue.area[j]"
+              :value="j"
+            ></el-option>
+          </el-select>
+          <!-- <select class="three" name="area" v-model="area_value" @change="bolting()">
+            <option>落地区域</option>
+            <template v-for="(area, index) in bgValue.area">
+              <option :key="index" :value="index">{{ area }}</option>
+            </template>
+          </select> -->
+        </div>
+        <div class="reporting">
+          <span @click="$jump('application')" style="cursor:pointer">项目申报</span>
+        </div>
+        <!-- container -->
+        <div class="con">
+          <!-- 导航 -->
+          <div class="top-t">
+            <h3
+              @click="btn(index)"
+              v-for="(item, index) in text"
+              :key="index"
+              :class="sub == index ? 'style' : ''"
+            >{{ item }}</h3>
+          </div>
+          <!-- 主题内容 -->
+          <div class="cc">
+            <template v-if="cd > 0">
+              <div
+                class="list"
+                v-for="(item, index) in bgData.info"
+                :key="index"
+                @click="
+                  item.tid == 1000
+                    ? $jP('application', { id: item.id })
+                    : $jParams('schedule', { id: item.id })
+                "
+              >
+                <div class="div">
+                  <div class="bb">
+                    <h3>{{ item.name }}</h3>
+                    <h5>项目</h5>
+                  </div>
+                  <time>{{ item.protime }}</time>
+                </div>
+                <dl>
+                  <dt>
+                    <img :src="imgUrl.tg" v-if="item.tid == 5" />
+                    <img :src="imgUrl.btg" v-else-if="item.tid == 4 || item.tid == 9" />
+                    <img :src="imgUrl.zxz" v-else-if="item.tid == 10" />
+                    <img :src="imgUrl.wtj" v-else-if="item.tid == 1000" />
+                    <img
+                      :src="imgUrl.yjx"
+                      v-else-if="item.tid == 110"
+                      style="width:119px;height:95px"
+                    />
+                    <img :src="imgUrl.shz" v-else />
+                  </dt>
+                  <dd >
+                    <span class="iconfont icon-zuzhijiegou"></span>
+                    <span>{{ item.party_id }}</span>
+                  </dd>
+                  <dd>
+                    <span class="iconfont icon-weizhi"></span>
+                    <span>{{ item.postaladdress }}</span>
+                  </dd>
+                  <dd>
+                     <div class="block-ky">
+                       <span class="iconfont icon-shenhetongguo1"></span>
+                      <b>当前申报阶段：</b>
+                      <el-tooltip class="item" effect="dark" :content="item.status " placement="top">
+                        <p class="status1">{{ item.status }}</p>
+                      </el-tooltip>
+                      
+                    </div>
+                    <!-- <span class="iconfont icon-shenhetongguo1"></span>
+                    <span>当前申报阶段：{{ item.status }}</span> -->
+                  </dd>
+                </dl>
+              </div>
+            </template>
+            <template v-else>
+              <span>您搜索的内容暂无！</span>
+            </template>
+          </div>
+        </div>
+        <!-- 分页按钮 -->
+        <div class="page">
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :page-size="pageSize"
+            :pager-count="7"
+            background
+            layout="prev, pager, next"
+            :total="totalCount"
+          ></el-pagination>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data() {
+    return {
+         typeval:'',
+      areaval:'',
+      statusval:"",
+      num: 1240,
+      pageSize: 1,
+      currentPage: 1,
+      totalCount: 1,
+      imgUrl: {
+        xlb: require("../../../static/img/xlb.png"),
+        tg: require("../../../static/img/tg.png"),
+        btg: require("../../../static/img/btg.png"),
+        shz: require("../../../static/img/shz.png"),
+        zxz: require("../../../static/img/zxz.png"),
+        wtj: require("../../../static/img/wtj.png"),
+        yjx: require("../../../static/img/yjx.png")
+      },
+      // text: ['全部', '项目初筛', '项目立项'],
+      text: ["全部"],
+      sub: 0,
+      bgData: [],
+      bgValue: [],
+      type_value: "项目类型",
+      status_value: "项目状态",
+      area_value: "落地区域",
+      value_date: [],
+      start_time: "",
+      end_time: "",
+      cd: Number
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    /** 筛选函数 */
+        prolist(time0, time1, type, area, status, currentPage) {
+      this.$http({
+        method: "get",
+        url: "v1/project/list",
+        params: {
+          start_time: this.value_date[0],
+          end_time: this.value_date[1],
+          type: this.typeval,
+          area: this.areaval,
+          status: this.statusval,
+          page: currentPage ? currentPage : 0,
+          num: 6
+        }
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            this.bgData = res.data.data.data;
+  
+            this.totalCount = this.bgData.allPage;
+            this.cd = this.bgData.info.length;
+          } else {
+            this.$message.error("请求数据有问题！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    },
+    bolting() {
+      this.start_time = this.value_date[0];
+      this.end_time = this.value_date[1];
+      this.getDataTwo(
+        this.start_time,
+        this.end_time,
+        this.type_value,
+        this.status_value,
+        this.area_value
+      );
+    },
+
+    /** 获取项目列表 */
+    getDataTwo(
+      start_time = this.start_time,
+      end_time = this.end_time,
+      type = this.type_value,
+      status = this.status_value,
+      area = this.area_value
+    ) {
+      if (type === "项目类型") {
+        this.type_value = "";
+        type = "";
+      }
+      if (status === "项目状态") {
+        this.status_value = "";
+        status = "";
+      }
+      if (area === "落地区域") {
+        this.area_value = "";
+        area = "";
+      }
+
+      let _this = this;
+      this.$http({
+        method: "get",
+        url: "v1/project/list",
+        params: {
+          start_time: start_time,
+          end_time: end_time,
+          type: type,
+          area: area,
+          status: status,
+          page: _this.currentPage,
+          num: 4
+        }
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            _this.bgData = res.data.data.data;
+            _this.totalCount = _this.bgData.allPage;
+            _this.cd = _this.bgData.info.length;
+          } else {
+            _this.$message.error("请求数据有问题！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+
+      if (this.type_value === "") {
+        this.type_value = "项目类型";
+      }
+      if (this.status_value === "") {
+        this.status_value = "项目状态";
+      }
+      if (this.area_value === "") {
+        this.area_value = "落地区域";
+      }
+    },
+    /** 获取下拉框数据 */
+    getDataOne() {
+      let _this = this;
+      this.$http({
+        method: "get",
+        url: "v1/project/get-info",
+        data: {}
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            console.log(res)
+            _this.bgValue = res.data.data;
+            // console.log(_this.bgValue)
+             delete _this.bgValue.area[""];
+          } else {
+            _this.$message.error("请求数据有问题！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    },
+    btn(index) {
+      let s = this.sub;
+      s = index;
+      this.sub = s;
+    },
+    sendMsgToParent() {
+      this.$emit("listenToChildExen", this.num);
+    },
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getPackData();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getDataTwo();
+      this.getPackData();
+    },
+    getPackData() {}
+  },
+  created() {
+    this.currentPage = Number(localStorage.getItem("page")) || 1;
+    this.handleCurrentChange(this.currentPage);
+    this.getDataOne();
+  },
+  mounted() {
+    this.sendMsgToParent();
+  },
+  beforeUpdate() {
+    localStorage.setItem("page", this.currentPage);
+  },
+  beforeDestroy() {
+    localStorage.setItem("page", 1);
+  },
+  destroyed() {
+    localStorage.removeItem("page");
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.wra /deep/ .el-input--suffix /deep/ .el-input__inner{
+  text-align: center;
+}
+.block-ky{
+  display: flex;
+  font-size: 14px;
+  color: #666666;
+  .status1{
+    width: 100px;
+    overflow: hidden;
+text-overflow:ellipsis;
+white-space: nowrap;
+
+  }
+}
+.wra {
+  width: 934px;
+  height: 1240px;
+  background-color: #ffffff;
+  padding: 35px 30px 100px;
+  box-sizing: border-box;
+
+  #box {
+    margin: 0 auto;
+    width: 100%;
+    box-sizing: border-box;
+
+    .bottom {
+      padding: 0px 30px 0px;
+      box-sizing: border-box;
+      width: 100%;
+      height: auto;
+      background-color: #ffffff;
+
+      .page {
+        margin-top: 60px;
+        height: 36px;
+        display: flex;
+        justify-content: flex-end;
+        align-items: center;
+
+        /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+          background-color: #e60012;
+        }
+
+        /deep/ .el-icon.el-icon-arrow-left::before {
+          content: "上一页";
+          font-family: "MicrosoftYaHei";
+          font-size: 12px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #646464;
+        }
+
+        /deep/ .el-pagination .btn-prev {
+          width: 80px;
+        }
+
+        /deep/ .el-pagination .btn-next {
+          width: 80px;
+        }
+
+        /deep/ .el-icon.el-icon-arrow-right::before {
+          content: "下一页";
+          font-family: "MicrosoftYaHei";
+          font-size: 12px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #646464;
+        }
+      }
+
+      .con {
+        width: 100%;
+        height: auto;
+
+        .cc {
+          display: flex;
+          flex-wrap: wrap;
+          justify-content: space-between;
+          align-items: flex-start;
+
+          .list {
+            margin-bottom: 60px;
+            width: 367px;
+            height: 184px;
+            background-color: #ffffff;
+            box-shadow: 0px 19px 21px 3px rgba(145, 142, 142, 0.1);
+            border-radius: 10px;
+            padding: 19px 29px 0px 16px;
+            box-sizing: border-box;
+
+            dl {
+              width: 100%;
+              height: 97px;
+              margin-top: 25px;
+              position: relative;
+
+              dd {
+                margin-bottom: 22px;
+                .iconfont {
+                  font-size: 17px;
+                  color: #ccc;
+                  margin-right: 16px;
+                }
+                span {
+                  font-family: "MicrosoftYaHei";
+                  font-size: 14px;
+                  font-weight: normal;
+                  font-stretch: normal;
+                  letter-spacing: 0px;
+                  color: #666666;
+                }
+              }
+
+              dt {
+                img {
+                  position: absolute;
+                  right: -8.5%;
+                  bottom: -26%;
+                  width: 119px;
+                  height: 95px;
+                }
+              }
+            }
+
+            .div {
+              width: 100%;
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
+              time {
+                font-family: "MicrosoftYaHei";
+                font-size: 14px;
+                font-weight: normal;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #999999;
+              }
+              .bb {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                h5 {
+                  margin-left: 6px;
+                  height: 18px;
+                  color: #f6ad35;
+                  text-align: center;
+                  line-height: 18px;
+                  border: 1px solid #f6ad35;
+                  border-radius: 4px;
+                  font-size: 12px;
+                }
+                h3 {
+                  font-family: "MicrosoftYaHei";
+                  font-size: 16px;
+                  font-weight: normal;
+                  font-stretch: normal;
+                  letter-spacing: 0px;
+                  color: #333333;
+                }
+              }
+            }
+          }
+        }
+
+        .top-t {
+          width: 100%;
+          height: 38px;
+          padding-left: 12px;
+          box-sizing: border-box;
+          display: flex;
+          justify-content: flex-start;
+          align-items: flex-start;
+          border-bottom: 1px solid #ccc;
+          margin-bottom: 60px;
+
+          h3 {
+            text-align: center;
+            margin-right: 78px;
+            width: 90px;
+            font-family: "MicrosoftYaHei";
+            font-size: 20px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333;
+          }
+
+          .style {
+            color: #e60012;
+            position: relative;
+            &::after {
+              content: "";
+              width: 91px;
+              height: 2px;
+              background-image: linear-gradient(#e60012, #e60012),
+                linear-gradient(#ff7f7f, #ff7f7f);
+              background-blend-mode: normal, normal;
+              position: absolute;
+              left: 0%;
+              bottom: -94%;
+            }
+          }
+        }
+      }
+
+      .select {
+        width: 100%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-top: 50px;
+        margin-bottom: 50px;
+
+        .block {
+          /deep/.el-range-editor.el-input__inner {
+            width: 325px;
+            background: url("../../../static/img/xa.png") 90% center no-repeat;
+            background-color: #f9f8f8;
+          }
+
+          /deep/.el-date-editor .el-range-input {
+            background-color: #f9f8f8;
+            font-family: "MicrosoftYaHei";
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 33px;
+            letter-spacing: 0px;
+            color: #666666;
+          }
+
+          /deep/.el-input__inner {
+            border: 1px solid #c7c7c7;
+          }
+
+          /deep/.el-date-editor .el-range-separator {
+            font-family: "MicrosoftYaHei";
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 33px;
+            letter-spacing: 0px;
+            color: #666666;
+          }
+
+          /deep/ .el-input__icon {
+            width: 0px;
+          }
+        }
+
+        .one {
+          // padding-left: 30px;
+          box-sizing: border-box;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 325px;
+          padding: 0px 30px;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666 !important;
+        }
+
+        .two {
+          // padding-left: 30px;
+          // padding-right: 48px;
+          box-sizing: border-box;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 134px;
+          padding: 0px 30px;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666 !important;
+        }
+
+        .three {
+          // padding-left: 30px;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 134px;
+          padding: 0px 32px 0 30px;
+          box-sizing: border-box;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666 !important;
+        }
+      }
+
+      .reporting {
+        width: 100%;
+        text-align: right;
+
+        span {
+          display: inline-block;
+          text-align: center;
+          line-height: 32px;
+          width: 96px;
+          height: 32px;
+          background-image: linear-gradient(
+              69deg,
+              #cc263f 0%,
+              #f42b47 100%,
+              #ed162d 100%,
+              #e60012 100%
+            ),
+            linear-gradient(#e60012, #e60012);
+          background-blend-mode: normal, normal;
+          border-radius: 4px;
+          font-family: "MicrosoftYaHei";
+          font-size: 16px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #ffffff;
+        }
+      }
+
+      .table {
+        width: 100%;
+        height: 181px;
+        border: solid 1px #dadada;
+        background-color: #f6f6f6;
+
+        .top-b {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+
+          div {
+            width: 202px;
+            height: 139px;
+            background-color: #fff;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            section {
+              width: 72px;
+              height: 67px;
+              display: flex;
+              flex-direction: column;
+              justify-content: space-between;
+              align-items: center;
+
+              span:first-child {
+                font-family: "MicrosoftYaHei";
+                font-size: 18px;
+                font-weight: normal;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #666666;
+              }
+
+              span:last-child {
+                font-family: "MicrosoftYaHei";
+                font-size: 24px;
+                font-weight: bold;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #e60012;
+              }
+            }
+          }
+        }
+
+        .top-p {
+          font-family: "MicrosoftYaHei";
+          font-size: 18px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #333333;
+          width: 100%;
+          height: 40px;
+          background-color: #f6f6f6;
+          text-align: center;
+          line-height: 40px;
+          border: 1px solid #dadada;
+        }
+      }
+    }
+
+    .top {
+      width: 100%;
+      height: 40px;
+      margin: 0px 0 30px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      img {
+        width: 33px;
+        height: 27px;
+      }
+      div {
+        width: 750px;
+        height: 21px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        span {
+          font-family: "MicrosoftYaHei";
+          font-size: 18px;
+          width: 538px;
+          line-height: 28px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #666666;
+        }
+
+        time {
+          font-family: "MicrosoftYaHei";
+          font-size: 20px;
+          font-weight: normal;
+          letter-spacing: 0px;
+          color: #999999;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/personal/Modify.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="wrap">
+    <form action method onsubmit="return false" enctype="multipart/form-data">
+      <div class="box">
+        <label for>请输入原密码:</label>
+        <input class="input" type="password" v-model="password_old" />
+      </div>
+      <div class="box">
+        <label for>请输入新密码:</label>
+        <input class="input" type="password" v-model="password_new" />
+      </div>
+      <div class="box">
+        <label for>请再次输入新密码:</label>
+        <input class="input" type="password" v-model="password_re" />
+      </div>
+      <div class="btn" @click="oBtn()">
+        <input type="submit" value="保存" style="cursor:pointer"/>
+      </div>
+    </form>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: {},
+  data () {
+    return {
+      num: 654,
+      password_old: '',
+      password_new: '',
+      password_re: '',
+      id: null
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    oBtn () {
+      if (this.password_new !== this.password_re) {
+        alert('新密码不相符！')
+        return
+      }
+      if (this.password_old === '' || this.password_new === '' || this.password_re === '') {
+        alert('不可为空！')
+        return
+      }
+      let _this = this
+      this.$http({
+        method: 'post',
+        url: 'v1/login/update-pwd',
+        data: {
+          id: _this.id,
+          password_old: _this.password_old,
+          password_new: _this.password_new,
+          password_re: _this.password_re
+        }
+      }).then(res => {
+        alert(res.data.data.msg)
+        _this.$router.push({
+          name: 'login'
+        })
+      })
+        .catch(err => {
+          console.log(err)
+        })
+    },
+    sendMsgToParent () {
+      this.$emit('listenToChildExen', this.num)
+    }
+  },
+  created () {
+    this.id = sessionStorage.id
+  },
+  mounted () {
+    this.sendMsgToParent()
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+.wrap {
+  width: 934px;
+  height: 654px;
+  background-color: #ffffff;
+  padding-top: 36px;
+  box-sizing: border-box;
+  display: flex;
+  justify-content: center;
+  align-items: flex-start;
+
+  form {
+    .box {
+      width: 100%;
+      margin-bottom: 30px;
+      label {
+        font-family: "MicrosoftYaHei";
+        font-size: 16px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 40px;
+        letter-spacing: 0px;
+        color: #333333;
+        width: 133px;
+        height: 40px;
+        text-align: right;
+        display: inline-block;
+      }
+
+      .input {
+        width: 400px;
+        height: 40px;
+        background-color: #ffffff;
+        border-radius: 5px;
+        border: solid 1px #dbdbda;
+        outline: none;
+        margin-left: 30px;
+      }
+    }
+
+    .btn {
+      display: flex;
+      justify-content: center;
+      margin-top: 60px;
+
+      input[type="submit"] {
+        width: 230px;
+        height: 63px;
+        background-color: #e60012;
+        border-radius: 5px;
+        font-family: "MicrosoftYaHei";
+        font-size: 26px;
+        font-weight: normal;
+        font-stretch: normal;
+        line-height: 63px;
+        text-align: center;
+        letter-spacing: 0px;
+        color: #ffffff;
+        outline: none;
+      }
+    }
+  }
+}
+</style>

src/views/personal/PersonalZte.vue

@@ -0,0 +1,150 @@
+<template>
+  <div class="wrapper">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="box">
+      <div class="left" :style="{height:heightVal+'px'}">
+        <div
+          class="list"
+          @click="btn(index)"
+          v-for="(list,index) in text"
+          :key="index"
+          :class="sub == index ? 'color' : ''"
+        >{{list}}</div>
+      </div>
+      <div class="right">
+        <apply v-if="sub == 0" @listenToChildExen="showMsgFromChild"></apply>
+        <collection v-if="sub == 1" @listenToChildExen="showMsgFromChild"></collection>
+        <declare v-if="sub == 2" @listenToChildExen="showMsgFromChild"></declare>
+        <modify v-if="sub == 3" @listenToChildExen="showMsgFromChild"></modify>
+        <collection1 v-if="sub == 4" @listenToChildExen="showMsgFromChild"></collection1>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from "../../components/HeaderNav";
+import FooterNav from "../../components/FooterNav";
+import Apply from "./Apply";
+import Collection from "./Collection";
+import Collection1 from "./Collection1";
+import Declare from "./Declare";
+import Modify from "./Modify";
+
+export default {
+  components: {
+    HeaderNav,
+    FooterNav,
+    Apply,
+    Collection,
+    Collection1,
+    Declare,
+    Modify
+  },
+  props: {},
+  data() {
+    return {
+      index_num: 3,
+      text: [
+        "党组织申请",
+        "我的收藏",
+        "项目申报",
+        "个人中心-修改密码",  
+        "@书记"
+      ],
+      // text: [
+      //   "党组织申请",
+      //   "我的收藏",
+      //   "项目申报",
+      //   "个人中心-修改密码",
+      //   "it数据",
+      //   "@书记"
+      // ],
+      // text: ['党组织申请', '项目申报', '个人中心-修改密码'],
+      sub: 0,
+      heightVal: 1050
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    showMsgFromChild(data) {
+      this.heightVal = data;
+    },
+    btn(index) {
+      let s = this.sub;
+      s = index;
+      this.sub = s;
+      // console.log(this.sub)
+    }
+  },
+  created() {},
+  mounted() {}
+};
+</script>
+
+<style lang='scss' scoped>
+.wrapper {
+  min-width: 1280px;
+
+  #box {
+    width: 1200px;
+    margin: 40px auto 0;
+    box-sizing: border-box;
+    // padding: 0 40px;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+
+    .left {
+      width: 241px;
+      background-color: #ffffff;
+      box-shadow: 0px 7px 11px 0px rgba(231, 231, 231, 0.7);
+      border-radius: 2px;
+
+      .list {
+        width: 100%;
+        height: 48px;
+        margin-top: 21px;
+        text-align: left;
+        line-height: 48px;
+        padding-left: 37px;
+        box-sizing: border-box;
+        font-family: "MicrosoftYaHei";
+        font-size: 20px;
+        font-weight: normal;
+        font-stretch: normal;
+        letter-spacing: 0px;
+        color: #333333;
+         cursor: pointer;
+      }
+
+      .color {
+        position: relative;
+        color: #e60012;
+       
+        &::after {
+          content: "";
+          width: 5px;
+          height: 48px;
+          background-color: #e60012;
+          border-radius: 8px;
+          position: absolute;
+          left: 0%;
+          top: 0%;
+        }
+      }
+    }
+
+    .right {
+      width: 934px;
+      background-color: #ffffff;
+    }
+  }
+
+  .footer {
+    margin-top: 80px;
+  }
+}
+</style>

src/views/project/Project (复制 1).vue

@@ -0,0 +1,902 @@
+<template>
+  <div class="wrapper">
+    <header-nav :index_num="index_num"></header-nav>
+    <div id="box">
+      <!-- 公告 -->
+      <div class="top">
+        <img :src="imgUrl.xlb" alt />
+        <!-- v-if="cd !== 0" -->
+        <div class="div-v" >
+          <!-- <aside class="animation" v-for="(list,index) in bgValue.announcement" :key="index">
+            <span>{{list.name + list.pro_content}}</span>
+            <time>{{list.protime}}</time>
+          </aside>-->
+          <span>
+            {{
+            bgValue.announcement[0].name + bgValue.announcement[0].pro_content
+            }}
+          </span>
+          <time>{{ bgValue.announcement[0].protime }}</time>
+        </div>
+        <!-- <div v-else>
+          <span>暂无项目申报内容</span>
+          <time>
+            {{
+            new Date().getFullYear() +
+            "-" +
+            (new Date().getMonth() + 1) +
+            "-" +
+            new Date().getDate()
+            }}
+          </time>
+        </div> -->
+      </div>
+      <div class="bottom">
+        <!-- 表格 -->
+        <div class="table">
+          <div class="top-p">项目概览</div>
+          <div class="top-b">
+            <div>
+              <section>
+                <span>初筛通过</span>
+                <span>{{ bgValue.overview_one }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>立项通过</span>
+                <span>{{ bgValue.overview_two }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>执行中</span>
+                <span>{{ bgValue.overview_three }}</span>
+              </section>
+            </div>
+            <div>
+              <section>
+                <span>已完结</span>
+                <span>{{ bgValue.overview_four }}</span>
+              </section>
+            </div>
+          </div>
+        </div>
+        <!-- 下拉框 -->
+        <div class="select">
+          <div class="block">
+            <el-date-picker
+              v-model="value_date"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="bolting()"
+            ></el-date-picker>
+          </div>
+          <select class="two" v-model="type_value" name="type" @change="bolting()">
+            <option>项目类型</option>
+            <template v-for="(type, index) in bgValue.type">
+              <option :key="index" :value="index">{{ type }}</option>
+            </template>
+          </select>
+          <select class="two" v-model="status_value" name="status" @change="bolting()" style="padding:7px;padding-right:38px">
+            <option>{{"\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0"}}项目状态</option>
+            <template v-for="(status, index) in bgValue.status">
+              <option :key="index" :value="index">{{ status }}</option>
+            </template>
+          </select>
+          <select class="three" v-model="area_value" name="area" @change="bolting()">
+            <option>落地区域</option>
+            <template v-for="(area, index) in bgValue.area">
+              <option :key="index" :value="index">{{ area }}</option>
+            </template>
+          </select>
+          <span @click="$jump('application')" class="procreate">项目申报</span>
+        </div>
+        <!-- container -->
+        <div class="con">
+          <!-- 导航 -->
+          <div class="top-t">
+            <h3
+              @click="btn(index)"
+              v-for="(item, index) in text"
+              :key="index"
+              :class="sub == index ? 'style' : ''"
+            >{{ item }}</h3>
+          </div>
+          <!-- 主题内容 -->
+          <div class="cc">
+            <template v-if="cd > 0">
+              <div
+                class="list"
+                v-for="(item, index) in bgData.info"
+                :key="index"
+                @click="
+                  item.tid == 1000
+                    ? $jP('application', { id: item.id })
+                    : $jParams('schedule', { id: item.id })
+                "
+              >
+                <div class="div">
+                  <div class="bb">
+                    <h3>{{ item.name }}</h3>
+                    <h5>项目</h5>
+                  </div>
+                  <time>{{ item.protime }}</time>
+                </div>
+                <dl>
+                  <dt>
+                    <img :src="imgUrl.tg" v-if="item.tid == 5" />
+                    <img :src="imgUrl.btg" v-else-if="item.tid == 4 || item.tid == 9" />
+                    <img :src="imgUrl.zxz" v-else-if="item.tid == 10" />
+                    <img :src="imgUrl.wtj" v-else-if="item.tid == 1000" />
+                    <img
+                      :src="imgUrl.yjx"
+                      v-else-if="item.tid == 110"
+                      style="width:120px;height:90px"
+                    />
+                    <img :src="imgUrl.shz" v-else />
+                    <!-- <img
+                      :src="imgUrl.yjx"
+                      style="width:120px;height:90px"
+                    /> -->
+                  </dt>
+                  <dd>
+                    <span class="iconfont icon-zuzhijiegou"></span>
+                    <span>{{ item.party_id }}</span>
+                  </dd>
+                  <dd>
+                    <span class="iconfont icon-weizhi"></span>
+                    <span>{{ item.postaladdress }}</span>
+                  </dd>
+                  <dd>
+                    <span class="iconfont icon-shenhetongguo1"></span>
+                    <div class="block-ky">
+                      <b>项目状态：</b>
+                      <el-tooltip class="item" effect="dark" :content="item.status " placement="top">
+                        <p class="status1">{{ item.status }}</p>
+                      </el-tooltip>
+                      
+                    </div>
+                  </dd>
+                </dl>
+              </div>
+            </template>
+            <template v-else>
+              <span>您搜索的内容暂无！</span>
+            </template>
+          </div>
+        </div>
+        <!-- 分页按钮 -->
+        <div class="page">
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :page-size="pageSize"
+            :pager-count="5"
+            background
+            layout="prev, pager, next"
+            :total="totalCount"
+          ></el-pagination>
+        </div>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from "../../components/HeaderNav";
+import FooterNav from "../../components/FooterNav";
+export default {
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  props: {},
+  data() {
+    return {
+      index_num: 2,
+      pageSize: 1,
+      currentPage: 1,
+      totalCount: 1,
+      imgUrl: {
+        xlb: require("../../../static/img/xlb.png"),
+        tg: require("../../../static/img/tg.png"),
+        btg: require("../../../static/img/btg.png"),
+        shz: require("../../../static/img/shz.png"),
+        zxz: require("../../../static/img/zxz.png"),
+        wtj: require("../../../static/img/wtj.png"),
+        yjx: require("../../../static/img/yjx.png")
+      },
+      // text: ["全部", "项目初筛", "项目立项"],
+      text: ["全部"],
+      sub: 0,
+      bgData: [],
+      bgValue: [],
+      type_value: "项目类型",
+      status_value: "\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0"+"项目状态",
+      area_value: "落地区域",
+      value_date: "",
+      start_time: "",
+      end_time: "",
+      cd: Number
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    /** 筛选函数 */
+    bolting() {
+      // console.log(9999)
+      if (this.value_date) {
+        this.start_time = this.value_date[0];
+        this.end_time = this.value_date[1];
+        // console.log(1112)
+        this.getDataTwo(
+          this.start_time,
+          this.end_time,
+          this.type_value,
+          this.status_value,
+          this.area_value
+        );
+      } else {
+        // console.log(1112)
+        this.getDataTwo(
+          this.start_time ? this.start_time : "",
+          this.end_time ? this.end_time : "",
+          this.type_value,
+          this.status_value,
+          this.area_value
+        );
+      }
+    },
+    /** 获取项目列表 */
+    getDataTwo(
+      start_time = this.start_time,
+      end_time = this.end_time,
+      type = this.type_value,
+      status = this.status_value,
+      area = this.area_value
+    ) {
+      if (type === "项目类型") {
+        this.type_value = "";
+        type = "";
+      }
+      if (status === "项目状态") {
+        this.status_value = "";
+        status = "";
+      }
+      if (area === "落地区域") {
+        this.area_value = "";
+        area = "";
+      }
+
+      let _this = this;
+      this.$http({
+        method: "get",
+        url: "v1/project/list",
+        params: {
+          start_time: start_time,
+          end_time: end_time,
+          type: type,
+          area: area,
+          status: status,
+          page: _this.currentPage,
+          num: 6
+        }
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            _this.bgData = res.data.data.data;
+            _this.totalCount = _this.bgData.allPage;
+            _this.cd = _this.bgData.info.length;
+          } else {
+            _this.$message.error("请求数据有问题！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+
+      if (this.type_value === "") {
+        this.type_value = "项目类型";
+      }
+      if (this.status_value === "") {
+        this.status_value = "项目状态";
+      }
+      if (this.area_value === "") {
+        this.area_value = "落地区域";
+      }
+    },
+    /** 获取下拉框数据 */
+    getDataOne() {
+      let _this = this;
+      this.$http({
+        method: "get",
+        url: "v1/project/get-info",
+        data: {}
+      })
+        .then(res => {
+          if (res.data.code === 200) {
+            _this.bgValue = res.data.data;
+            _this.cd = _this.bgValue.announcement.length;
+            for(let i in _this.bgValue.status){
+              if(_this.bgValue.status[i].length<9){
+                _this.bgValue.status[i]="\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0"+_this.bgValue.status[i] 
+              }else{
+                _this.bgValue.status[i]="\xa0\xa0\xa0\xa0\xa0"+_this.bgValue.status[i] 
+              }
+              // console.log(_this.bgValue.status[i])
+            }
+
+          } else {
+            _this.$message.error("请求数据有问题！");
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    },
+    btn(index) {
+      let s = this.sub;
+      s = index;
+      this.sub = s;
+    },
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getPackData();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getDataTwo();
+      this.getPackData();
+    },
+    getPackData() {}
+  },
+  created() {
+    this.currentPage = Number(localStorage.getItem("page")) || 1;
+    this.handleCurrentChange(this.currentPage);
+    this.getDataOne();
+  },
+  mounted() {},
+  beforeUpdate() {
+    localStorage.setItem("page", this.currentPage);
+  },
+  beforeDestroy() {
+    localStorage.setItem("page", 1);
+  },
+  destroyed() {
+    localStorage.removeItem("page");
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.block-ky{
+  display: flex;
+  font-size: 14px;
+  color: #666666;
+  .status1{
+    width: 120px;
+    overflow: hidden;
+text-overflow:ellipsis;
+white-space: nowrap;
+
+  }
+}
+.procreate {
+  border-radius: 66px !important;
+  cursor: pointer;
+}
+.wrapper {
+  min-width: 1280px;
+  box-sizing: border-box;
+
+  .footer {
+    margin-top: 80px;
+  }
+
+  #box {
+    margin: 0 auto;
+    width: 1200px;
+    box-sizing: border-box;
+
+    .bottom {
+      padding: 35px 30px 100px;
+      box-sizing: border-box;
+      width: 1200px;
+      // height: 1320px;
+
+      box-sizing: border-box;
+      background-color: #ffffff;
+
+      .page {
+        margin-top: 60px;
+        height: 36px;
+        display: flex;
+        justify-content: flex-end;
+        align-items: center;
+
+        /deep/ .el-pagination.is-background .el-pager li {
+          color: #333 !important;
+        }
+
+        /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
+          background-color: #e60012;
+          color: #fff !important;
+        }
+
+        /deep/ .el-icon.el-icon-arrow-left::before {
+          content: "上一页";
+          font-family: "MicrosoftYaHei";
+          font-size: 12px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #666;
+        }
+
+        /deep/ .el-pagination .btn-prev {
+          width: 80px;
+        }
+
+        /deep/ .el-pagination .btn-next {
+          width: 80px;
+        }
+
+        /deep/ .el-icon.el-icon-arrow-right::before {
+          content: "下一页";
+          font-family: "MicrosoftYaHei";
+          font-size: 12px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 1px;
+          color: #666;
+        }
+      }
+
+      .con {
+        width: 1140px;
+        // height: 773px;
+
+        .cc::after {
+          content: "";
+          width: 367px;
+          display: block;
+          height: 0px;
+        }
+
+        .cc {
+          display: flex;
+          flex-wrap: wrap;
+          justify-content: space-between;
+          align-items: flex-start;
+
+          .list {
+            margin-bottom: 60px;
+            width: 367px;
+            height: 184px;
+            background-color: #ffffff;
+            box-shadow: 0px 19px 21px 3px rgba(145, 142, 142, 0.1);
+            border-radius: 10px;
+            padding: 19px 29px 0px 16px;
+            box-sizing: border-box;
+
+            dl {
+              width: 100%;
+              height: 97px;
+              margin-top: 25px;
+              position: relative;
+              display: flex;
+              flex-direction: column;
+              justify-content: space-between;
+
+              dd {
+                height: 20px;
+                display: flex;
+                align-items: center;
+
+                .iconfont {
+                  font-size: 17px;
+                  color: #ccc;
+                  margin-right: 16px;
+                }
+                span {
+                  font-family: "MicrosoftYaHei";
+                  font-size: 14px;
+                  font-weight: normal;
+                  font-stretch: normal;
+                  letter-spacing: 0px;
+                  color: #666666;
+                }
+
+                .block-k {
+                  width: 288px;
+                  display: inline-block;
+                  /* overflow: hidden;*/
+                  text-overflow: ellipsis;
+                  white-space: nowrap;
+
+                  b {
+                    font-weight: 900;
+                  }
+                }
+              }
+
+              dt {
+                img {
+                  position: absolute;
+                  right: -8.5%;
+                  bottom: -26%;
+                  width: 120px;
+                  height: 90px;
+                }
+              }
+            }
+
+            .div {
+              width: 100%;
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
+              time {
+                font-family: "MicrosoftYaHei";
+                font-size: 14px;
+                font-weight: normal;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #999999;
+              }
+              .bb {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                h5 {
+                  margin-left: 6px;
+                  height: 18px;
+                  color: #f6ad35;
+                  text-align: center;
+                  line-height: 18px;
+                  border: 1px solid #f6ad35;
+                  border-radius: 4px;
+                  font-size: 12px;
+                }
+                h3 {
+                  font-family: "MicrosoftYaHei";
+                  font-size: 16px;
+                  font-weight: normal;
+                  font-stretch: normal;
+                  letter-spacing: 0px;
+                  color: #333333;
+                }
+              }
+            }
+          }
+        }
+
+        .top-t {
+          width: 1140px;
+          height: 38px;
+          padding-left: 12px;
+          box-sizing: border-box;
+          display: flex;
+          justify-content: flex-start;
+          align-items: flex-start;
+          border-bottom: 1px solid #ccc;
+          margin-bottom: 60px;
+
+          h3 {
+            text-align: center;
+            margin-right: 78px;
+            width: 90px;
+            font-family: "MicrosoftYaHei";
+            font-size: 20px;
+            font-weight: normal;
+            font-stretch: normal;
+            letter-spacing: 0px;
+            color: #333;
+          }
+
+          .style {
+            color: #e60012;
+            position: relative;
+            &::after {
+              content: "";
+              width: 91px;
+              height: 2px;
+              background-image: linear-gradient(#e60012, #e60012),
+                linear-gradient(#ff7f7f, #ff7f7f);
+              background-blend-mode: normal, normal;
+              position: absolute;
+              left: 0%;
+              bottom: -94%;
+            }
+          }
+        }
+      }
+
+      .select {
+        width: 100%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-top: 50px;
+        margin-bottom: 50px;
+
+        .block {
+          /deep/.el-range-editor.el-input__inner {
+            width: 325px;
+            background: url("../../../static/img/xa.png") 90% center no-repeat;
+            background-color: #f9f8f8;
+          }
+
+          /deep/.el-date-editor .el-range-input {
+            background-color: #f9f8f8;
+            font-family: "MicrosoftYaHei";
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 33px;
+            letter-spacing: 0px;
+            color: #666666;
+          }
+
+          /deep/.el-input__inner {
+            border: 1px solid #c7c7c7;
+          }
+
+          /deep/.el-date-editor .el-range-separator {
+            font-family: "MicrosoftYaHei";
+            font-size: 18px;
+            font-weight: normal;
+            font-stretch: normal;
+            line-height: 33px;
+            letter-spacing: 0px;
+            color: #666666;
+          }
+
+          /deep/ .el-input__icon {
+            width: 0px;
+          }
+        }
+
+        .one {
+          // padding-left: 30px;
+          box-sizing: border-box;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 325px;
+          padding: 0px 30px;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666;
+        }
+
+        .two {
+          // padding-left: 30px;
+          // padding-right: 48px;
+          box-sizing: border-box;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 134px;
+          padding: 7px 33px;
+          // height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666;
+          // text-align: center;
+        }
+
+        .three {
+          // padding-left: 30px;
+          /* 清除默认的箭头样式 */
+          appearance: none;
+          -moz-appearance: none;
+          -webkit-appearance: none;
+          /* 右侧添加小箭头的背景图 */
+          background: url("../../../static/img/xa.png") 90% center no-repeat;
+          background-size: 14px 8px;
+          // width: 134px;
+          padding: 0 35px 0 30px;
+          box-sizing: border-box;
+          height: 38px;
+          background-color: #f9f8f8;
+          border-radius: 4px;
+          border: solid 1px #c7c7c7;
+          outline: none;
+          font-size: 18px;
+          color: #666;
+          text-align: center;
+        }
+        span {
+          display: inline-block;
+          text-align: center;
+          line-height: 32px;
+          width: 96px;
+          height: 32px;
+          background-image: linear-gradient(
+              69deg,
+              #cc263f 0%,
+              #f42b47 100%,
+              #ed162d 100%,
+              #e60012 100%
+            ),
+            linear-gradient(#e60012, #e60012);
+          background-blend-mode: normal, normal;
+          border-radius: 4px;
+          font-family: "MicrosoftYaHei";
+          font-size: 16px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #ffffff;
+        }
+      }
+
+      .table {
+        width: 1137px;
+        height: 181px;
+        border: solid 1px #dadada;
+        background-color: #f6f6f6;
+        box-sizing: border-box;
+
+        .top-b {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+
+          div {
+            width: 283px;
+            height: 139px;
+            background-color: #fff;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            section {
+              width: 72px;
+              height: 67px;
+              display: flex;
+              flex-direction: column;
+              justify-content: space-between;
+              align-items: center;
+
+              span:first-child {
+                font-family: "MicrosoftYaHei";
+                font-size: 18px;
+                font-weight: normal;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #666666;
+              }
+
+              span:last-child {
+                font-family: "MicrosoftYaHei";
+                font-size: 24px;
+                font-weight: bold;
+                font-stretch: normal;
+                letter-spacing: 0px;
+                color: #e60012;
+              }
+            }
+          }
+        }
+
+        .top-p {
+          font-family: "MicrosoftYaHei";
+          font-size: 18px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #333333;
+          width: 1136px;
+          height: 40px;
+          background-color: #f6f6f6;
+          text-align: center;
+          line-height: 40px;
+          border-bottom: 1px solid #dadada;
+          border-right: 1px solid #dadada;
+          box-sizing: border-box;
+        }
+      }
+    }
+
+    .top {
+      width: 1100px;
+      height: 40px;
+      margin: 30px 0 30px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .div-v {
+        width: 1060px;
+        height: 100%;
+        overflow: hidden;
+        display: flex;
+        // flex-direction: column;
+        justify-content: space-around;
+        align-items: flex-start;
+        line-height: 38px;
+      }
+
+      /*
+
+
+
+      .animation {
+        display: flex;
+        justify-content: space-between;
+        animation: myMove 15s linear infinite;
+        animation-fill-mode: forwards;
+        width: 95%;
+        height: 100%;
+        margin-bottom: 25px;
+        margin-left: 25px;
+      }
+      */
+
+      img {
+        width: 33px;
+        height: 27px;
+      }
+      div {
+        width: 672px;
+        height: 21px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        span {
+          font-family: "MicrosoftYaHei";
+          font-size: 20px;
+          font-weight: normal;
+          font-stretch: normal;
+          letter-spacing: 0px;
+          color: #666666;
+        }
+
+        time {
+          font-family: "MicrosoftYaHei";
+          font-size: 20px;
+          font-weight: normal;
+          letter-spacing: 0px;
+          color: #999999;
+        }
+      }
+    }
+  }
+}
+
+/*文字无缝滚动*/
+@keyframes myMove {
+  0% {
+    transform: translateY(0);
+  }
+  100% {
+    transform: translateY(-150px);
+  }
+}
+</style>

src/views/socialcredit.vue

@@ -0,0 +1,250 @@
+<template>
+  <div>
+    <header-nav :index_num="index_num"></header-nav>
+    <div class="content">
+      <div class="top">
+        <div class="homeicon">
+          <img src="../../static/img/homeicon.png" alt class="homeicon" />
+        </div>
+        <div class="el-icon-right"></div>
+        <div class="titleshot">社会组织信息</div>
+      </div>
+      <img @click="navto()" src="../../static/img/apple.png" alt class="apply" />
+      <div class="infobox">
+        <div class="infotablebg">
+          <div class="infotable">
+            <div class="tabletitle">社会组织信息</div>
+            <table>
+              <!-- <tr>
+<th class="tabletitle">社会组织信息</th>
+              </tr>-->
+
+              <tr>
+                <td class="key">社会组织名称</td>
+                <td class="val">{{result.name?result.name:"无"}}</td>
+                <td class="key">账号状态</td>
+                <td class="val" v-if="result.status==0">已注销</td>
+                <td class="val" v-if="result.status==1">异常</td>
+                <td class="val" v-if="result.status==2">正常</td>
+                <td class="val" v-if="result.status==3">待审核</td>
+              </tr>
+              <tr>
+                <td class="key">统一社会信用代码</td>
+                <td class="val">{{result.unicode?result.unicode:"无"}}</td>
+                <td class="key">注册地址</td>
+                <td class="val">{{result.reg_area?result.reg_area:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">社会组织类型</td>
+                <td class="val">{{result.society_type?result.society_type:"无"}}</td>
+                <td class="key">法定代表人</td>
+                <td class="val">{{result.legal_person?result.legal_person:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">业务主管单位</td>
+                <td class="val">{{result.supervisor?result.supervisor:"无"}}</td>
+                <td class="key">开办资金</td>
+                <td class="val">{{result.money?result.money:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">登记日期</td>
+                <td class="val">{{result.reg_time?result.reg_time:"无"}}</td>
+                <td class="key">有效期限</td>
+                <td class="val">{{result.start_time}}--{{result.end_time}}</td>
+              </tr>
+              <tr>
+                <td class="key">2016年年检情况</td>
+                <td class="val">{{result.sec_age?result.sec_age:"无"}}</td>
+                <td class="key">评估情况</td>
+                <td class="val">{{result.assess?result.assess:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">
+                  <p class="keywrap">承接政府购买服务情况</p>
+                </td>
+                <td class="val">
+                  <p class="valwrap">{{result.accept_buy?result.accept_buy:"无"}}</p>
+                </td>
+                <td class="key">
+                  <p class="keywrap">接受表彰情况</p>
+                </td>
+                <td class="val">
+                  <p class="valwrap">{{result.accept_honor?result.accept_honor:"无"}}</p>
+                </td>
+              </tr>
+
+              <tr>
+                <td class="key">行政处罚情况</td>
+                <td class="val">{{result.admini_punish?result.admini_punish:"无"}}</td>
+                <td class="key">活动异常情况</td>
+                <td class="val">{{result.activity_unusual?result.activity_unusual:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">
+                  <p>活动异常情况时限</p>
+                </td>
+                <td class="val">
+                  <p>{{result.activity_unusual_start}}--{{result.activity_unusual_end}}</p>
+                </td>
+                <td class="key">
+                  <p>严重失信情况</p>
+                </td>
+                <td class="val">
+                  <p>{{result.break_faith?result.break_faith:"无"}}</p>
+                </td>
+              </tr>
+            </table>
+            <table>
+              <tr>
+                <td class="key">严重失信情况时限</td>
+                <td class="valself">{{result.break_faith_start}}--{{result.break_faith_end}}</td>
+              </tr>
+              <tr>
+                <td class="key">业务范围</td>
+                <td class="valself">{{result.business?result.business:"无"}}</td>
+              </tr>
+              <tr>
+                <td class="key">
+                  <p class="keywrap">变更信息</p>
+                </td>
+                <td class="valself">
+                  <p>{{result.change_info?result.change_info:"无"}}</p>
+                </td>
+              </tr>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+    <footer-nav class="footer"></footer-nav>
+  </div>
+</template>
+
+<script>
+import HeaderNav from "../components/HeaderNav";
+import FooterNav from "../components/FooterNav";
+export default {
+  name: "dangzuzhixq",
+  components: {
+    HeaderNav,
+    FooterNav
+  },
+  data() {
+    return {
+      index_num: 1,
+      result: []
+    };
+  },
+  mounted() {
+    console.log(this.$route.query.id);
+    this.$http({
+      method: "get",
+      url: "v1/soc/credit",
+      params: { id: this.$route.query.id }
+    }).then(res => {
+      console.log(res);
+      this.result = res.data.data[0];
+    });
+  },
+  methods:{
+    navto(){
+      this.$router.push({path:"/personalZte"})
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.infobox {
+  width: 100vw;
+  display: flex;
+  justify-content: center;
+}
+.el-icon-s-home {
+  color: #9a9899;
+  font-size: 20px;
+}
+.content {
+  background-color: #f5f5f5;
+  .top {
+    width: 178px;
+    position: relative;
+    top: 50px;
+    left: 70px;
+    display: flex;
+    justify-content: space-around;
+    .titleshot {
+      font-size: 20px;
+      // font-weight: bold;
+    }
+    .homeicon {
+      width: 22px;
+      height: 22px;
+    }
+  }
+  .apply {
+    width: 233px;
+    float: right;
+    margin-right: 71px;
+  }
+  .infotablebg {
+    width: 1200px;
+    background-color: white;
+    // margin: 0 auto;
+    // margin-top: 67px;
+    display: flex;
+    justify-content: center;
+    padding-bottom: 180px;
+    .infotable {
+      margin-top: 36px;
+      .tabletitle {
+        background-color: #f24e77;
+        width: 1070px;
+        height: 60px;
+        color: white;
+        text-align: center;
+        line-height: 60px;
+        font-size: 24px;
+      }
+      .key {
+        width: 266px;
+        height: 40px;
+        line-height: 40px;
+        background-color: #f7f5f6;
+        text-align: left;
+        text-indent: 40px;
+      }
+      .keywrap {
+        width: 114px;
+        margin: 0 auto;
+        line-height: 35px;
+        text-indent: -1px;
+        text-align: left;
+        margin-right: 112px;
+      }
+      .valwrap {
+        // line-height: 50px;
+        position: relative;
+        top: 15px;
+      }
+      .valself {
+        width: 802px;
+        height: 40px;
+        line-height: 40px;
+        text-align: left;
+        text-indent: 30px;
+      }
+      .val {
+        width: 266px;
+        height: 40px;
+        line-height: 40px;
+      }
+    }
+  }
+}
+</style>
+<style>
+body table td {
+  border: 2px solid #dfe0eb !important;
+}
+</style>