mall-web-ssr/components/mobile/staffManagement/StaffEdit.vue

<!--<template>-->
  <!--<div class="seek">-->
    <!--<div class="com-mobile-header mobile-center-header">-->
      <!--<a @click="goLastPage"><i class="iconfont icon-fanhui"></i></a>-->
      <!--<p>编辑角色</p>-->
      <!--<p class="en-name"><img :src="`/images/mobile/center/${user.data.enterprise.uu ? 'en' : 'self'}.png`" alt="">{{currentEnName}}</p>-->
    <!--</div>-->
    <!--<div class="mobile-fix-content mobile-centerfix-content" id="mobile-staff-center" v-if="roles">-->
      <!--<div v-for="(role, index) in roles">-->
        <!--<div class="staff-role">-->
          <!--<div class="staff-header"><span :class="'active_0' + role.color"><b></b>{{role.desc}}</span></div>-->
          <!--<div class="staff-content">-->
            <!--<label class="radio-label clearfix" @click.stop="checkRole(role, index)">-->
              <!--<input type="checkbox" :id="role.id" :checked="role.checked"/>-->
              <!--<label :for="role.id" v-bind:class="{'margin0': role.color === '4' || role.color === '2'}"></label>-->
              <!--<p class="staff-des">{{role.duty}}</p>-->
            <!--</label>-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="staff-footer" v-if="roles || roles.length > 0">-->
        <!--<div class="cancel handle" @click="cancelBind">取消</div>-->
        <!--<div class="agree handle" @click="sureEdit">确定</div>-->
      <!--</div>-->
    <!--</div>-->
    <!--<remind-box :title="remindText" :timeoutCount="timeoutCount"></remind-box>-->
  <!--</div>-->
<!--</template>-->
<!--<script>-->
  <!--import { RemindBox } from '~components/mobile/common'-->
  <!--export default {-->
    <!--data () {-->
      <!--return {-->
        <!--checked: false,-->
        <!--roles: [],-->
        <!--remindText: '',-->
        <!--timeoutCount: 0-->
      <!--}-->
    <!--},-->
    <!--components: {-->
      <!--RemindBox-->
    <!--},-->
    <!--computed: {-->
      <!--currentData () {-->
        <!--return this.baseUtils.deepCopy(this.$store.state.staff.infoList.edit.data) || []-->
      <!--}-->
    <!--},-->
    <!--mounted () {-->
      <!--// 获取角色-->
      <!--this.$nextTick(() => {-->
        <!--this.getRoles()-->
      <!--})-->
    <!--},-->
    <!--methods: {-->
      <!--// 获取角色-->
      <!--getRoles () {-->
        <!--this.$http.get('/account/role')-->
          <!--.then(response => {-->
            <!--if (response.data) {-->
              <!--this.roles = response.data-->
              <!--for (let i = 0; i < this.currentData.roles.length; i++) {-->
                <!--for (let j = 0; j < this.roles.length; j++) {-->
                  <!--//判断已绑定角色-->
                  <!--if (this.currentData.roles[i].id === this.roles[j].id) {-->
                    <!--this.roles[j].checked = true-->
                  <!--}-->
                <!--}-->
              <!--}-->
            <!--}-->
          <!--})-->
      <!--},-->
      <!--// 选择角色-->
      <!--checkRole (role, index) {-->
        <!--role.checked = !role.checked-->
        <!--for (let i = 0; i < this.currentData.roles.length; i++) {-->
          <!--if (role.checked) {-->
            <!--console.log('1')-->
            <!--this.currentData.roles.push(role)-->
          <!--} else {-->
            <!--console.log('0')-->
            <!--this.currentData.roles.splice(index,1)-->
          <!--}-->
        <!--}-->
      <!--},-->
      <!--// 取消编辑-->
      <!--cancelBind () {-->
        <!--this.$router.push('/mobile/user/staff')-->
      <!--},-->
      <!--// 确定编辑-->
      <!--sureEdit () {-->
        <!--this.$http.put(`/basic/user/updaterole`, this.currentData)-->
          <!--.then(() => {-->
            <!--this.onRemind('角色编辑成功')-->
            <!--this.$router.push('/mobile/user/staff')-->
          <!--})-->
      <!--},-->
      <!--onRemind: function (str) {-->
        <!--this.remindText = str-->
        <!--this.timeoutCount ++-->
      <!--}-->
    <!--}-->
  <!--}-->
<!--</script>-->
<!--<style lang="scss">-->
  <!--$base-color: #3f84f6;-->
  <!--#mobile-staff-center {-->
    <!--padding-bottom: .5rem;-->
    <!--margin: 0 auto;-->
    <!--.staff-role{-->
      <!--margin: .2rem auto 0;-->
      <!--padding: 0 .24rem;-->
      <!--width: 7.1rem;-->
      <!--height: 1.72rem;-->
      <!--background-color: #fff;-->
      <!--border-radius: .05rem;-->
      <!--.staff-header {-->
        <!--height: .5rem;-->
        <!--line-height: .5rem;-->
        <!--text-align: left;-->
        <!--border-bottom: 1px solid #d9d9d9;-->
        <!--span {-->
          <!--font-size: .28rem;-->
          <!--color: #333;-->
          <!--b{-->
            <!--display: inline-block;-->
            <!--margin-right: .05rem;-->
            <!--width: .05rem;-->
            <!--height: .18rem;-->
            <!--background-color: #3f84f6;-->
          <!--}-->
        <!--}-->
        <!--span.active_02 b{-->
          <!--background-color: #8aaefc;-->
        <!--}-->
        <!--span.active_03 b{-->
          <!--background-color: #09d7cd;-->
        <!--}-->
        <!--span.active_04 b{-->
          <!--background-color: #ff676a;-->
        <!--}-->
        <!--span.active_05 b{-->
          <!--background-color: #fc9b68;-->
        <!--}-->
      <!--}-->
      <!--.staff-content {-->
        <!--padding-top: .25rem;-->
        <!--.radio-label {-->
          <!--background-size: contain;-->
          <!--vertical-align: middle;-->
          <!--input{-->
            <!--float: left;-->
            <!--display: none;-->
            <!--margin: .18rem .1rem 0 0;-->
            <!--width: .36rem;-->
            <!--height: .36rem;-->
            <!--border: solid 2px #999999;-->
          <!--}-->
          <!--label {-->
            <!--float: left;-->
            <!--margin: .18rem .1rem 0 0;-->
            <!--width: .36rem;-->
            <!--height: .36rem;-->
            <!--border-radius: 50%;-->
            <!--background: url(/images/mobile/center/user/car-noChecked.png) no-repeat;-->
            <!--background-size: contain;-->
            <!--vertical-align: middle;-->
          <!--}-->
          <!--label.margin0 {-->
            <!--margin: 0.05rem .1rem 0 0;-->
          <!--}-->
          <!--input:checked + label {-->
            <!--background-image: url(/images/mobile/center/user/car-checked.png);-->
          <!--}-->
          <!--input.checked + label {-->
            <!--background-image: url(/images/mobile/center/user/car-checked.png);-->
          <!--}-->
        <!--}-->
        <!--.staff-des{-->
          <!--float: left;-->
          <!--width: 6rem;-->
          <!--line-height: .42rem;-->
          <!--font-weight: normal;-->
          <!--font-size: .28rem;-->
          <!--color: #666666;-->
        <!--}-->
      <!--}-->
    <!--}-->
    <!--.staff-footer{-->
      <!--overflow: hidden;-->
      <!--margin-top: .6rem;-->
      <!--div.handle{-->
        <!--float: left;-->
        <!--width: 3.24rem;-->
        <!--height: .77rem;-->
        <!--line-height: .77rem;-->
        <!--font-size: .32rem;-->
        <!--color: #fff;-->
        <!--text-align: center;-->
        <!--border-radius: .08rem;-->
        <!--&:first-child{-->
          <!--margin: 0 .28rem 0 .35rem;-->
          <!--background-color: #acaaab;-->
        <!--}-->
        <!--&:last-child{-->
          <!--background-color: #3f84f6;-->
        <!--}-->
      <!--}-->
    <!--}-->
  <!--}-->
<!--</style>-->