nsgk_mobile/src/views/lawEnforcement/user/index.vue

<template>
  <div class="app-container">
    <div class="topBackground">
      <van-nav-bar title="我的" fixed placeholder/>
      <van-row class="userInformation">
        <van-col :span="24" v-show="loginType">
          <p class="userName">{{user.nickName}}<span style="font-size: 0.4rem;float: right;">{{roleGroup}}</span></p>
<!--          <i style="margin-right: 0.5rem;"></i>-->
          <p class="userDept">{{user.dept.deptName}}</p>
          <p class="userDept">{{postGroup}}</p>
        </van-col>
        <van-col :span="24" v-show="loginButton">
          <van-button icon="friends" color="red" style="border-radius: 30PX;padding: 0 30PX;height: 30PX;" to="/lawEnforcement/login">
            请登录
          </van-button>
          <p style="margin-top: 10PX;color: #5289ed">登录后可查看更多信息</p>
        </van-col>
      </van-row>
    </div>
    <van-cell-group class="listBox db" v-show="loginType">
      <van-cell value="全部" is-link :to="{name:loginType ? 'waitingProcessing':''}">
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_db.png" size="20"></van-icon>
          <span class="custom-title">待办事项<i class="bgBlue"></i></span>
        </template>
      </van-cell>

      <van-cell
        v-for="(item,index) in taskList"
        :key="index"
        :value="item.formData.createTime == null ? '' : item.formData.createTime.substr(5,5)"
        :to="{
          name:item.formData.activityBusinessType == '21' ? 'schemeDetail':'caseDetail',
          query:{
            id:item.formData.activityBusinessType == '21' ? item.formData.id:item.formData.caseId,
            caseProgress:item.formData.activityBusinessType == '21' ? '': item.formData.activityBusinessType == '22' ? 2:item.formData.activityBusinessType == '24' ? 4:item.formData.activityBusinessType == '25' ? 5:'',
            type:'waiting'
          }
        }"
      >
        <template #title>
          <span class="tap">{{selectDictLabel(activityBusinessTypeOptions,item.formData.activityBusinessType).substr(2,2)}}</span>
          <span>{{item.projectName}}</span>
        </template>
      </van-cell>

    </van-cell-group>
    <van-cell-group class="listBox" v-if="tabShow">
      <van-cell is-link :to="{name:loginType ? 'programme':''}" >
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_fagl.png" size="20"></van-icon>
          <span class="custom-title">方案管理</span>
        </template>
      </van-cell>
      <van-cell is-link :to="{name:loginType ? 'complaint':''}" >
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_tshf.png" size="20"></van-icon>
          <span class="custom-title">投诉回复</span>
        </template>
      </van-cell>
    </van-cell-group>
    <van-cell-group class="listBox">
      <van-cell is-link :to="{name:loginType ? 'changePassword':''}" >
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_mmxg.png" size="20"></van-icon>
          <span class="custom-title">密码修改</span>
        </template>
      </van-cell>
      <van-cell is-link :to="{name:loginType ? 'feedback':''}" >
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_bzfk.png" size="20"></van-icon>
          <span class="custom-title">帮助反馈</span>
        </template>
      </van-cell>
      <van-cell is-link :to="{name:loginType ? 'agreement':''}" >
        <template #title>
          <van-icon name="../../../static/images/lawEnforcement/icon/icon_cpxy.png" size="20"></van-icon>
          <span class="custom-title">产品协议</span>
        </template>
      </van-cell>
    </van-cell-group>
    <van-button type="default" class="loginOut" @click="loginOut" v-if="loginType">退出登录</van-button>
    <law></law>
  </div>
</template>
<script>
import request from "@/utils/request";
import { getUserProfile } from "@/api/lawEnforcement/index";
import { logout ,getInfo } from "@/api/login/index";
import law from "@/components/common/law_footer";
import Cookies from "js-cookie";
export default {
  name: "user",
  components: {
    law
  },
  data() {
    return {
      user: {
        dept:{}
      },
      loginType:false,
      loginButton:false,
      tabShow: false,
      // 查询参数
      queryParamsTask: {
        pageNum: 1,
        pageSize: 5,
        taskId: null,
        taskName: null,
        systemType: 26,
      },
      roleGroup: {},
      postGroup: {},

      activeTab: "userinfo",
      taskList:[],
      activityBusinessTypeOptions:[],
    };
  },
  created() {
    this.getDicts("activity_business_type").then((response) => {
      this.activityBusinessTypeOptions = response.data;
    });
    console.log(Cookies.get("User-Token"))
    if(!Cookies.get("User-Token")){
      this.loginType = false ;
      this.loginButton = true ;
      return
    }
    this.getUser();
  },
  activated: function () {
    this.getDicts("activity_business_type").then((response) => {
      this.activityBusinessTypeOptions = response.data;
    });
    if(!Cookies.get("User-Token")){
      this.loginType = false ;
      this.loginButton = true ;
      return
    }
    this.getUser();
  },
  methods: {
    loginOut(){
      logout().then(response => {
        console.log(response);
        Cookies.remove("User-Token");
        this.$router.push({
          path: '/lawEnforcement'
        })
      });
    },
    getUser() {
      getUserProfile().then(response => {
          this.loginType = true ;
          this.user = response.data;
          this.roleGroup = response.roleGroup;
          this.postGroup = response.postGroup;
          if (response.data.roles.length < 1){
            this.tabShow = false;
          }else{
            response.data.roles.forEach(res=>{
              if (res.roleKey == 'personal_user' || res.roleKey == 'company_user'){
                this.tabShow = false;
              }else{
                this.tabShow = true;
              }
            })
          }
          this.getTaskList();
      });
    },
    getTaskList() {
      this.loading = true;
      return request({
        url: "/activiti/process/taskList",
        method: "get",
        params: this.queryParamsTask,
      })
      .then((response) => {
        console.log(response)
        this.taskList = response.rows;
        this.total = response.total;
        console.log(this.total)
        this.loading = false;
      })
      .then(() => {

      });
    },
  },
};
</script>

<style scoped lang="scss">
@font-face {
  font-family: SourceHanSansCNBold;
  src: url("../../../assets/fonts/SourceHanSansCN-Bold.otf");
}
.app-container {
  padding: 0 ;
}
/deep/ .van-hairline--bottom::after{
  border: none;
}
/deep/ .van-nav-bar{
  background-color: transparent;
}
/deep/ .van-nav-bar__title{
  color: #FFFFFF;
}
.topBackground{
  background-image: url("../../../../static/images/lawEnforcement/user_bg.png") ;
  background-size: 100%;
  background-repeat: no-repeat;
}
  .headImg{
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 10PX;
    overflow: hidden;
  }
  .userName{
    font-size: 0.8rem;
    color: #FFFFFF;
    line-height: 0.85rem;
  }
  .userDept{
    font-size: 0.4rem;
    text-align: right;
    color: #FFFFFF;
    line-height: 0.85rem;
  }
  .userInformation{
    padding: 0.3rem 6%;
  }
.listBox{
  width: 96%;
  margin: 0 auto;
  border-radius: 8Px;
  overflow: hidden;
  box-shadow: 0PX 5PX 5PX #cccccc;
  margin-top: 10PX;
  padding: 3% 0;
  .van-icon{
    vertical-align: middle;
  }
  .van-cell{
    padding: 3% 5%;
  }
  .custom-title{
    font-size: 16PX;
    color: #333333;
    vertical-align: middle;
    line-height: 1;
    position: relative;
    margin-left: 5PX;
  }
  .tap{
    color: #1D6FE9;
  }
  .bgBlue{
    display: block;
    position: absolute;
    width: 17PX;
    height: 17PX;
    border-radius: 50%;
    background-color: rgba(29,111,233,0.26);
    top: -2PX;
    right: -8PX;
  }
}
  .loginOut{
    width: 96%;
    margin: 10PX 2%;
    border-radius: 8Px;
    box-shadow: 0PX 5PX 5PX #cccccc;
    border: none;
  }
.db{
  .van-cell__title{
    color: #666666;
    flex: 0.7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    word-break: break-all;
    overflow: hidden;
  }
  .van-cell__value{
    flex: 0.3;
  }
}

</style>