<template>
  <div id="myPartybranch" class="app">
    <van-sticky :offset-top="0">
      <van-nav-bar title="我的党支部" left-arrow @click-left="goBack" />
    </van-sticky>
    <van-tabs v-model="active">
      <van-tab title="支部介绍" class="text">
        <p>技术党总支工作目标： &zwj;</p>
        <p>
          不断提升技术研发能力、服务生产经营，围绕企业战略，充分发挥战斗堡垒及先锋模范作用，建立先进的创新型党组织。
        </p>
        <p>支部建设目标：</p>
        <p>
          1、打造一支队伍。以党的建设总要求为指引，加强支委会引领作用，丰富党支部日常组织生活，打造一支特别能吃苦、特别能战斗的党员队伍。
        </p>
        <p>
          2、建设一个品牌。围绕公司转型发展目标，发挥党员引领作用，带头落实研发部业务工作计划，做好做精传统产品研发及质量改进、积极推进新能源业务开拓和智能化发动机研究，树立一个创新型的支部品牌。
        </p>
        <p>
          3、架设一座桥梁。通过支部开展形势任务宣传教育和支部日常活动，发挥好党支部在上级党组织与党员、党员与群众之间的桥梁与纽带作用，每年开展党支部凝聚力活动，提升党支部活力及影响力。有序开展党员发展工作，吸收优秀青年员工加入党组织。
        </p>
      </van-tab>
      <van-tab title="班子成员">
        <van-row>
          <van-col class="head" span="12">姓名</van-col>
          <van-col class="head" span="12">党内职务名称</van-col>
        </van-row>
        <van-row v-for="item in memberParty" :key="item.id">
          <van-col span="12" v-text="item.name"></van-col>
          <van-col span="12" v-text="item.position"></van-col>
        </van-row>
      </van-tab>
      <van-tab title="支部成员">
        <van-row v-for="item in listParty" :key="item.id">
          <van-col
            span="12"
            v-for="it in item"
            :key="it.id"
            v-text="it.name"
          ></van-col>
        </van-row>
      </van-tab>
      <!-- <van-tab title="积分排行">
        <van-row>
          <van-col class="head" span="8">名次</van-col>
          <van-col class="head" span="8">名称</van-col>
          <van-col class="head" span="8">积分</van-col>
        </van-row>
        <van-row>
          <van-col span="8">1</van-col>
          <van-col span="8">黄华</van-col>
          <van-col span="8">100</van-col>
        </van-row>
      </van-tab> -->
    </van-tabs>
  </div>
</template>

<script>
import {
  NavBar as vanNavBar,
  Sticky as vanSticky,
  Tab as vanTab,
  Tabs as vanTabs,
  Col as vanCol,
  Row as vanRow
} from "vant";
import "vant/lib/sticky/style";
import "vant/lib/nav-bar/style";
import "vant/lib/tab/style";
import "vant/lib/tabs/style";
import "vant/lib/row/style";
import "vant/lib/col/style";

import { memberParty, userParty } from "@/api/party/party.js";
export default {
  name: "app",
  data: function() {
    return {
      active: "",
      memberParty: [],
      listParty: []
    };
  },
  methods: {
    goBack() {
      history.go(-1);
    },
    forMath(list) {
      let li = [];
      list.map((v, i) => {
        i % 2 === 0 && (li[li.length] = [v]);
        i % 2 !== 0 && li[li.length - 1].push(v);
      });
      return li;
    }
  },
  mounted() {
    memberParty().then(res => {
      this.memberParty = res || [];
    });
    userParty().then(res => {
      this.listParty = this.forMath(res);
    });
  },
  beforeDestroy: function() {},
  components: { vanSticky, vanNavBar, vanTabs, vanTab, vanCol, vanRow }
};
</script>
<style lang="scss">
#myPartybranch {
  color: #969fa9;
  .head {
    background-color: #eee;
  }
  .van-col {
    text-align: center;
    height: 2.5em;
    line-height: 2.5em;
  }
  .text {
    padding: 1em;
    p {
      text-indent: 2em;
      min-height: 1.5em;
      line-height: 1.5em;
    }
  }
  .van-tab__pane {
    padding-top: 1em;
  }
}
</style>
