|
@@ -0,0 +1,282 @@
|
|
|
+<!doctype html>
|
|
|
+<html>
|
|
|
+
|
|
|
+ <head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <title>我的简历</title>
|
|
|
+ <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
|
|
+ <link href="../../css/mui.min.css" rel="stylesheet" />
|
|
|
+ <link href="../../css/animate.min.css" rel="stylesheet" />
|
|
|
+ <link href="../../css/cropper.min.css" rel="stylesheet" />
|
|
|
+ <style>
|
|
|
+ .mui-bar-nav~.mui-content{padding-top: 60px;}
|
|
|
+ .model{margin-top: 11px; background-color: white;padding: 10px;overflow: hidden;}
|
|
|
+ .model .content{padding: 12px;}
|
|
|
+ .icon{padding-right: 5px;font-size:20px;color: #00a0ea;}
|
|
|
+ .sm7{padding-left: 15px;line-height: 25px;}
|
|
|
+ .d{color: darkgray;font-size: 14px;}
|
|
|
+ .c{color: darkgray;font-size: 16px;line-height: 35px;}
|
|
|
+ .b{color: black;}
|
|
|
+ .e{color: #6e6f71;}
|
|
|
+ .mp{width: 100%;border-radius: 3px;}
|
|
|
+ .edit{float: right;color: #6e6f71;}
|
|
|
+ #clipp{position:fixed;width:100%;height:100%;top:0;background-color:black;display:none;z-index:9999999}
|
|
|
+ #clipp img{max-width:100%;height:auto;vertical-align:middle;}
|
|
|
+ #clipp .op{position:fixed;width:100%;bottom:0;}
|
|
|
+ #clipp .mui-icon{color:white;font-size:50px;font-weight:bold}
|
|
|
+ [v-cloak] {display: none;}
|
|
|
+ </style>
|
|
|
+ </head>
|
|
|
+ <body>
|
|
|
+ <div id="app" v-cloak>
|
|
|
+ <header class="mui-bar mui-bar-nav">
|
|
|
+ <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
|
|
|
+ <h1 class="mui-title">我的简历</h1>
|
|
|
+ </header>
|
|
|
+ <div class="mui-content animated fadeInUp">
|
|
|
+ <div class="model" style="margin-top: 0px;">
|
|
|
+ <div class="bod">
|
|
|
+ <span class="text">
|
|
|
+ <i class="icon"></i>基本信息
|
|
|
+ </span>
|
|
|
+ <span class="edit"><i class="icon e"></i>编辑</span>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+ <div class="row">
|
|
|
+ <div class="sm3">
|
|
|
+ <img src="../../images/mp.jpg" class="mp">
|
|
|
+ </div>
|
|
|
+ <div class="sm7">
|
|
|
+ <div>姓名</div>
|
|
|
+ <div style="font-size: 13px;">女 ,xxxx,xx年工作年龄</div>
|
|
|
+ <div class="d">目前所在城市:<span class="b">xx市</span></div>
|
|
|
+ <div class="d">联系电话:<span class="b">xxxx</span></div>
|
|
|
+ <div class="d">电子邮箱:<span class="b">xxxxxxx</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="clear"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="model">
|
|
|
+ <div class="bod">
|
|
|
+ <span class="text">
|
|
|
+ <i class="icon"></i>求职意向
|
|
|
+ </span>
|
|
|
+ <span class="edit"><i class="icon e"></i>编辑</span>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+ <div class="row">
|
|
|
+ <div class="c">职位:<span class="b">xxx职业</span></div>
|
|
|
+ <div class="c">工作地点:<span class="b">xx市</span></div>
|
|
|
+ <div class="c">期待月薪:<span class="b">xx元/面议</span></div>
|
|
|
+ <div class="c">目前状态:<span class="b">离职/在职</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="model">
|
|
|
+ <div class="bod">
|
|
|
+ <span class="text">
|
|
|
+ <i class="icon"></i>教育经历
|
|
|
+ </span>
|
|
|
+ <span class="edit"><i class="icon e"></i>编辑</span>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+ <div class="row">
|
|
|
+ <div class="c">学校 • 机构:<span class="b">xxx职业</span></div>
|
|
|
+ <div class="c">时间:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="model">
|
|
|
+ <div class="bod">
|
|
|
+ <span class="text">
|
|
|
+ <i class="icon"></i>工作经历
|
|
|
+ </span>
|
|
|
+ <span class="edit"><i class="icon e"></i>编辑</span>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+ <div class="row" style="border-bottom: 1px solid #efefef;">
|
|
|
+ <div class="c">公司或单位:<span class="b">xxx职业</span></div>
|
|
|
+ <div class="c">职位:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ <div class="c">负责:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ <div class="c">时间:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <div class="c">公司或单位:<span class="b">xxx职业</span></div>
|
|
|
+ <div class="c">职位:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ <div class="c">负责:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ <div class="c">时间:<span class="b">xxxx-xxxx</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--拍照-->
|
|
|
+ <div id="picture" class="mui-popover mui-popover-action mui-popover-bottom">
|
|
|
+ <ul class="mui-table-view">
|
|
|
+ <li class="mui-table-view-cell" @click="takePhoto()">
|
|
|
+ <a>拍照</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="pickImg()">
|
|
|
+ <a>选取现有</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <ul class="mui-table-view">
|
|
|
+ <li class="mui-table-view-cell" style="color: red;">
|
|
|
+ <a href="#picture"><b>取消</b></a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <!--性别-->
|
|
|
+ <div id="sex" class="mui-popover mui-popover-action mui-popover-bottom">
|
|
|
+ <ul class="mui-table-view">
|
|
|
+ <li class="mui-table-view-cell" @click="size('S')">
|
|
|
+ <a>S</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="size('M')">
|
|
|
+ <a>M</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="size('L')">
|
|
|
+ <a>L</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="size('XL')">
|
|
|
+ <a>XL</a>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell" @click="size('均码')">
|
|
|
+ <a>均码</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <ul class="mui-table-view">
|
|
|
+ <li class="mui-table-view-cell" style="color: red;">
|
|
|
+ <a href="#sex"><b>取消</b></a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <!--新增的图片剪裁-->
|
|
|
+ <div id="clipp">
|
|
|
+ <img id="image" alt="Picture" src="../../images/APP-banner2.jpg">
|
|
|
+ <div class="op">
|
|
|
+ <span class="mui-icon mui-icon mui-icon-closeempty mui-pull-left" @click="cancel()"></span>
|
|
|
+ <span class="mui-icon mui-icon-checkmarkempty mui-pull-right" @click="save()"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <script src="../../js/mui.min.js"></script>
|
|
|
+ <script src="../../js/app.js"></script>
|
|
|
+ <script src="../../js/vue.min.js"></script>
|
|
|
+ <script src="../../js/cropper.min.js"></script>
|
|
|
+ <script type="text/javascript">
|
|
|
+ var cropper = null;
|
|
|
+ var vm = new Vue({
|
|
|
+ el: "#app",
|
|
|
+ data: {
|
|
|
+ item: {}
|
|
|
+ },
|
|
|
+ mounted: function() {
|
|
|
+ mui.plusReady(function() {
|
|
|
+ vm.getData();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getData: function() {
|
|
|
+ request(urls().userInfo, {
|
|
|
+ id: getUser().id
|
|
|
+ }, function(res) {
|
|
|
+ if(res.result == true) {
|
|
|
+ vm.item = res.data;
|
|
|
+ localStorage.setItem("user", JSON.stringify(res.data));
|
|
|
+ vm.item.header = urls().path + vm.item.header;
|
|
|
+ plus.webview.getWebviewById('tab/mine.html').reload(true);
|
|
|
+ } else {
|
|
|
+ mui.alert(res.msg);
|
|
|
+ }
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //拍照
|
|
|
+ takePhoto: function() {
|
|
|
+ mui('#picture').popover('toggle');
|
|
|
+ var cmr = plus.camera.getCamera();
|
|
|
+ var res = cmr.supportedImageResolutions[0];
|
|
|
+ var fmt = cmr.supportedImageFormats[0];
|
|
|
+ plus.nativeUI.showWaiting("准备剪裁...");
|
|
|
+ cmr.captureImage(function(path) {
|
|
|
+ plus.io.resolveLocalFileSystemURL(path, function(entry) {
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
+ if(cropper != null) {
|
|
|
+ cropper.destroy();
|
|
|
+ }
|
|
|
+ cropper = getClipper(1, entry.toLocalURL());
|
|
|
+ });
|
|
|
+ }, function(error) {
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
+ }, {
|
|
|
+ resolution: res,
|
|
|
+ format: fmt
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //选择现有
|
|
|
+ pickImg: function() {
|
|
|
+ mui('#picture').popover('toggle');
|
|
|
+ // 从相册中选择图片然后裁剪
|
|
|
+ plus.gallery.pick(function(path) {
|
|
|
+ if(cropper != null) {
|
|
|
+ cropper.destroy();
|
|
|
+ }
|
|
|
+ cropper = getClipper(1, path);
|
|
|
+ }, {
|
|
|
+ filter: "image"
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //裁剪结束并上传
|
|
|
+ save: function() {
|
|
|
+ plus.nativeUI.showWaiting("正在上传...");
|
|
|
+ //获得裁剪对象
|
|
|
+ var croppedCanvas = cropper.getCroppedCanvas({
|
|
|
+ width: 100,
|
|
|
+ height: 100
|
|
|
+ })
|
|
|
+ var dataUrl = croppedCanvas.toDataURL();
|
|
|
+ request(urls().user_upload, {
|
|
|
+ id: getUser().id,
|
|
|
+ dataImage: dataUrl
|
|
|
+ }, function(res) {
|
|
|
+ vm.item.header = urls().path + res.url;
|
|
|
+ mui.toast("上传成功");
|
|
|
+ vm.getData();
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
+ })
|
|
|
+ document.getElementById("clipp").style.display = 'none';
|
|
|
+ },
|
|
|
+ //取消裁剪
|
|
|
+ cancel: function() {
|
|
|
+ document.getElementById("clipp").style.display = 'none';
|
|
|
+ },
|
|
|
+ //编辑尺码
|
|
|
+ size: function(op) {
|
|
|
+ mui('#sex').popover('toggle');
|
|
|
+ request(urls().edit_info, {
|
|
|
+ field: 'size',
|
|
|
+ id: getUser().id,
|
|
|
+ value: op
|
|
|
+ }, function(res) {
|
|
|
+ if(res.result == true) {
|
|
|
+ mui.toast("修改成功");
|
|
|
+ vm.item.size = op;
|
|
|
+ }
|
|
|
+ plus.nativeUI.closeWaiting();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //编辑其它
|
|
|
+ op: function(msg, val, op) {
|
|
|
+ open('edit_info', 'edit_info.html', {
|
|
|
+ msg: msg,
|
|
|
+ value: val,
|
|
|
+ op: op
|
|
|
+ }, 'slide-in-bottom');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ </script>
|
|
|
+ </body>
|
|
|
+
|
|
|
+</html>
|