person_center.html 9.46 KB
<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
      <title>我的信息</title>
      <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/aui.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/mine/mine.css"/>
      <style>
          html,
          body{
            background: #F4F6F9;
          }
      </style>
  </head>
  <body ontouchstart="">
    <header class="aui-header-bar" style="padding-top:30px;background-color:#5B7FF8">
      <div class="aui-header-left" tapmode onclick="closeWin();">
          <i class="aui-iconfont aui-icon-left" style="color:#FFFFFF;font-size:16px;">返回</i>
      </div>
      <div class="aui-title" style="color:#FFFFFF;">我的信息</div>
      <div class="aui-header-right">
      </div>
    </header>
    <div class="person-center-list-panel">
      <div class="inside-person-center-list-panel">
        <div class="aui-row aui-row-flex" style="padding-top:15px;">
          <div class="aui-col aui-col-span-5 aui-row-flex-start" style="margin-top:0.7rem">
            <span class="title-obj" style="margin-top:0.3rem;">头像</span>
          </div>
          <div class="aui-col aui-col-span-19 aui-row-flex-end">
            <img src="../../image/user-avatar-big.png" id="avatar" style="width:44px;height:44px;border-radius:50%;"/>
          </div>
          <!-- <div class="aui-col aui-col-span-2 aui-row-flex-end" style="margin-top:0.5rem"> -->
            <!-- <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i> -->
          <!-- </div> -->
        </div>
        <div class="panel-line" style="margin-top:10px;"></div>
        <div class="aui-row aui-row-flex margin-top-21">
          <div class="aui-col aui-col-span-5 aui-row-flex-start">
            <span class="title-obj">用户名</span>
          </div>
          <div class="aui-col aui-col-span-19 aui-row-flex-end">
            <span class="person-center-span" id="user_name"></span>
          </div>
        </div>
        <div class="panel-line margin-top-21"></div>
        <div class="aui-row aui-row-flex margin-top-21" tapmode onclick="changePhone();">
          <div class="aui-col aui-col-span-5 aui-row-flex-start">
            <span class="title-obj">账号</span>
          </div>
          <div class="aui-col aui-col-span-17 aui-row-flex-end">
            <span class="person-center-span" id="user_phone"></span>
          </div>
          <div class="aui-col aui-col-span-2 aui-row-flex-end">
            <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
          </div>
        </div>
        <!-- <div class="panel-line margin-top-21"></div> -->
        <!-- <div class="aui-row aui-row-flex margin-top-21" tapmode onclick="cleanCache();">
          <div class="aui-col aui-col-span-5 aui-row-flex-start">
            <span class="title-obj">缓存</span>
          </div>
          <div class="aui-col aui-col-span-17 aui-row-flex-end">
            <span class="person-center-span" id="cache_size">0MB</span>
          </div>
          <div class="aui-col aui-col-span-2 aui-row-flex-end">
            <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
          </div>
        </div> -->
        <div style="height:21px;"></div>
      </div>
    </div>
    <!-- <div class="person-center-btn" tapmode onclick="submit();">提交</div> -->
    <footer></footer>
  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/aui-actionsheet.js" ></script>
  <script type="text/javascript" src="../../script/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="../../script/ctrl.js"></script>
  <script type="text/javascript">
    var token;
    var userId;
    var actionsheet = new auiActionsheet();
      apiready = function(){
        api.parseTapmode();
        var header = $api.dom('header'); // 获取 header 标签元素
        var footer = $api.dom('footer'); // 获取 footer 标签元素
        var headerH = $api.fixStatusBar(header);
        var footerH = $api.fixTabBar(footer);
        token = api.getPrefs({sync: true,key: 'userToken'});
        userId = api.getPrefs({sync: true,key: 'userID'});
        getUserInfo();

        api.addEventListener({
            name: 'changeAvatar'
        }, function(ret, err){
            if( ret ){
              if (ret.value.destPath != "") {
                var ele=$api.dom('#avatar');
                $api.attr(ele,'src',ret.value.destPath);
                avatarUrl = ret.value.destPath;
              }
            }
        });
        getCache();
      };

      function getCache() {
        api.getCacheSize(function(ret) {
          var size = ret.size/1024/1024;
          $api.html($api.byId('cache_size'), size.toFixed(1)+'MB');
        });
      }

      function cleanCache() {
        var dialogBox = api.require('dialogBox');
        dialogBox.alert({
            texts: {
                title: '',
                content: '确定清空缓存吗?',
                leftBtnTitle: '取消',
                rightBtnTitle: '确认'
            },
            styles: {
                bg: '#fff',
                w: 300,
                corner:2,
                title: {
                    marginT: 20,
                    icon: '../../image/mine/img-signOut.png',
                    iconSize: 74,
                    titleSize: 14,
                    titleColor: '#000'
                },
                content: {
                    color: '#37394E',
                    size: 14
                },
                left: {
                    marginB: 0,
                    marginL: 0,
                    w: 150,
                    h: 47,
                    corner: 10,
                    bg: '#FFFFFF',
                    color: '#818295',
                    size: 16
                },
                right: {
                    marginB: 0,
                    marginL: 0,
                    w: 150,
                    h: 47,
                    corner: 10,
                    bg: '#FFFFFF',
                    color: '#5B7FF8',
                    size: 16
                },
                horizontalLine:{
                  color:'rgba(240,245,255,1)',
                  height:1
                },
                verticalLine:{
                    color:'rgba(240,245,255,1)',
                    width:1                 //(可选项)数字类型;左右边按钮竖线的高度;默认:0
                }
            }
        },async function(ret) {
          dialogBox.close({
              dialogName: 'alert'
          });
          if (ret.eventType == 'right') {
            let res = await get_product_type_list()
            let productTypeList = res.data.List
            for (let i = 0; i < productTypeList.length; i++) {
              const type = productTypeList[i];
              $api.rmStorage(type.pic_url);
            }
            api.clearCache(function() {
                api.toast({
                    msg: '清除完成'
                });
                $api.html($api.byId('cache_size'), '0MB');
            });
          }
        })
      }

      function getUserInfo() {
        var username_ = api.getPrefs({sync: true,key: 'userName'});
        var userphone_ = api.getPrefs({sync: true,key: 'userPhone'});
        $api.html($api.byId('user_name'), username_);
        $api.html($api.byId('user_phone'), userphone_);
      }

      // function clickAvatar() {
      //   actionsheet.init({
      //       frameBounces:true,//当前页面是否弹动,(主要针对安卓端)
      //       title:"上传头像",
      //       cancelTitle:'取消',
      //       // destructiveTitle:'红色警告按钮',
      //       buttons:['拍照','图库选择']
      //   },function(ret){
      //       if(ret){
      //         getPicture(ret.buttonIndex);
      //       }
      //   })
      // }

      //选择头像方式
      // function getPicture(sourceType) {
      //   var avatarType = ''
      //   switch (sourceType) {
      //     case 1:
      //       avatarType = 'camera';
      //     break;
      //     case 2:
      //       avatarType = 'pic';
      //     break;
      //     default:
      //
      //   }
      //   //获取一张图像
      //   api.getPicture({
      //       sourceType: avatarType,
      //       encodingType: 'jpg',
      //       mediaValue: 'pic',
      //       allowEdit: false,
      //       quality: 10,
      //       saveToPhotoAlbum: true
      //   }, function(ret, err) {
      //       // 获取图像数据并进行裁剪处理
      //       if (ret) {
      //           var imgSrc = ret.data;
      //           api.openWin({
      //               name: 'clipImg',
      //               url: '../utils/fnImageClip.html',
      //               pageParam: {
      //                   imgSrc: imgSrc
      //               }
      //           });
      //       }
      //   });
      // }

      function changePhone() {
        api.openWin({
            name: 'changePhone_win',
            url: './changePhone_win.html',
            slidBackEnabled: false,
        });
      }

      function submit() {
        console.log('----');
      }
  </script>
  </html>