detail.html 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>职位详情</title>
  6. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  7. <link href="../../css/mui.min.css" rel="stylesheet" />
  8. <link href="../../css/animate.min.css" rel="stylesheet" />
  9. <style>
  10. .mui-bar-nav~.mui-content{padding-top: 55px;margin-bottom: 50px;}
  11. .ht{margin-top: 11px;padding: 5px;background-color: #fffbee;color: #ed9f2b;font-size: 11px;}
  12. .warn{display: block;padding-top: 11px;text-align: center;}
  13. .name{font-weight: bold;font-size: 17px;}
  14. .icon{font-size:20px;}
  15. .right{float: right;color: #FF5722;}
  16. .yh{font-size: 11px;padding: 5px 0px 0px 0px;color: darkgray;}
  17. .yh .sp{padding-right: 15px;}
  18. .sps{background: #00B5AD;padding: 1px 6px;border-radius: 3px;color: white;text-align: center;}
  19. .s{color: darkgray;font-size: 12px;}
  20. .row{font-size: 14px;padding-top: 10px;}
  21. .sm2{color: #4c4848;}
  22. .dc{padding-right: 10px;font-size: 12px;}
  23. .i{color: #00a0ea;}
  24. .item{border-top: 1px solid #ececec;margin-top: 10px;padding-top: 15px;font-size: 14px;}
  25. .dd{padding:5px;margin:0;border: 0;}
  26. .dz{font-size: 12px;color: darkgray;}
  27. .gs{padding-top: 11px;font-size: 48px;display: block;color: #00a0ea;}
  28. .nr{font-size: 13px;color: #4a4747;}
  29. .lyy{float: right;margin-top: 15px;font-size: 15px;color: orange;}
  30. .footer{color: white;position: fixed;background-color: #00a0ea;padding-top: 15px;width: 100%;bottom: 0;height: 52px;text-align: center;}
  31. [v-cloak] {display: none;}
  32. </style>
  33. </head>
  34. <body>
  35. <div id="app" v-cloak>
  36. <header class="mui-bar mui-bar-nav">
  37. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  38. <h1 class="mui-title">职位详情</h1>
  39. </header>
  40. <div class="mui-content animated fadeInUp">
  41. <div class="ht">凡是要求缴纳费用请提高警惕,谨防受骗!</div>
  42. <div class="model">
  43. <div class="content" style="margin-top: -5px;">
  44. <span class="name">{{item.parttime_title}}</span><span class="right">{{item.salary}}</span>
  45. <div class="yh">
  46. <span class="sp">更新:{{item.publish_date}}</span>
  47. <span class="sp" style="color: #18c31f;"><i class="icon" style="font-size: 13px;">&#xe7a1;</i> 通过审核</span>
  48. <span class="sp">申请:{{item.hire_num}} 人</span>
  49. <span class="sps" style="background: #FF5722;" v-show="item.hire_num>5">多人竞争</span>
  50. <span class="sps" style="background: #00a0ea;" v-show="item.hire_num<5&&item.hire_num>0">机会大</span>
  51. <span class="sps" style="background: #009688;" v-show="item.hire_num==0">争先锋</span>
  52. </div>
  53. <div class="row">
  54. <div class="sm2">要求:</div>
  55. <div class="sm8">
  56. <span class="dc"><i class="icon i">&#xe624;</i> 招{{item.hire_num}}人</span>
  57. <span class="dc"><i class="icon i">&#xe65e;</i> {{item.settlement}}</span>
  58. <span class="dc"><i class="icon i">&#xe662;</i> {{item.remark}}</span>
  59. </div>
  60. <div class="clear"></div>
  61. </div>
  62. <div class="row">
  63. <div class="sm2">福利:</div>
  64. <div class="sm8" style="font-size: 12px;">
  65. {{item.parttime_describe}}
  66. </div>
  67. <div class="clear"></div>
  68. </div>
  69. </div>
  70. </div>
  71. <div class="model">
  72. <div class="item dd">工作地点 <i class="icon right" style="color: darkgray;font-size: 15px;">&#xe61c;</i><span class="right s">{{item.address}}</span></div>
  73. </div>
  74. <div class="model">
  75. <div class="content">
  76. <div class="row" style="padding: 0;">
  77. <div class="sm2"><i class="icon gs">&#xe724;</i></div>
  78. <div class="sm8">{{item.work_region}} <br><span class="dz">{{item.address}}</span></div>
  79. <div class="clear"></div>
  80. </div>
  81. <div class="item">公司电话 <i class="icon right" style="color: darkgray;font-size: 15px;">&#xe61c;</i><a class="right s" :href=" 'tel:'+item.phone">{{item.contact_info}}</a></div>
  82. </div>
  83. </div>
  84. <div class="model">
  85. <div class="bod">
  86. <span><i class="icon i" style="padding-right:5px;">&#xe660;</i>职位要求</span>
  87. </div>
  88. <div class="content nr" v-html="item.parttime_describe"></div>
  89. </div>
  90. </div>
  91. <div class="model" v-for="(item,index) in item.list">
  92. <div class="item dd">{{item.mz}} {{item.phone}}
  93. <div class="lyy" @click="contract(item)" v-if="item.state=='0' && item.contract=='0'">发送合同</div>
  94. <div class="lyy" style="color: #00B5AD;" v-else-if="item.state=='0' && item.contract=='1'">合同已发送</div>
  95. <div class="lyy" style="color: #98ff72;" v-if="item.state=='1' && item.finance=='0'">待请款</div>
  96. <div class="lyy" @click="qrdk(item)" style="color: #00B5AD;" v-if="item.state=='1' && item.finance=='1'">请款中请确认打款</div>
  97. <div class="lyy" style="color: #0000ff;" v-if="item.state=='2' && item.finance=='2'">已完成</div>
  98. </div>
  99. </div>
  100. <!--<div class="footer" @click="deliver()"><i class="icon">&#xe61a;</i> {{msg}}</div> -->
  101. </div>
  102. <script src="../../js/mui.min.js"></script>
  103. <script src="../../js/app.js"></script>
  104. <script src="../../js/vue.min.js"></script>
  105. <script type="text/javascript">
  106. var vm = new Vue({
  107. el: "#app",
  108. data: {
  109. item: {},
  110. resume: {},
  111. msg: '我要报名',
  112. qitem: {}
  113. },
  114. mounted: function() {
  115. mui.plusReady(function() {
  116. request(urls().parttime_detail, {id: plus.webview.currentWebview().param.id}, function(res) {
  117. vm.item = res;
  118. //vm.item.mTime = vm.item.mTime.substring(0, 11)
  119. plus.nativeUI.closeWaiting();
  120. })
  121. })
  122. },
  123. methods: {
  124. //详情
  125. contract: function(id) {
  126. open('detail', 'contract.html', id, 'slide-in-bottom');
  127. },
  128. //详情
  129. qrdk: function(item) {
  130. console.log("items==="+JSON.stringify(item));
  131. vm.qitem.parttime_id=item.parttime_id;
  132. vm.qitem.userId=item.userId;
  133. if(confirm("请确认已经向盖用户打款!!")){
  134. request(urls().qr_finance, vm.qitem, function(res) {
  135. plus.nativeUI.closeWaiting();
  136. if(res.result == true) {
  137. vm.msg = '已打款'
  138. mui.toast('已打款');
  139. } else {
  140. mui.alert(res.msg);
  141. }
  142. })
  143. }else{
  144. console.log("取消确认======")
  145. }
  146. //open('detail', 'contract.html', id, 'slide-in-bottom');
  147. },
  148. //投递简历
  149. deliver: function() {
  150. if(!hasLogin()) {
  151. mui.toast("请先登录")
  152. open('login', '/pages/user/login.html', null, 'slide-in-bottom');
  153. return;
  154. }
  155. if(getUser().mType==1){
  156. mui.alert("企业用户不允许投递简历");
  157. return;
  158. }
  159. vm.resume = getResume();
  160. vm.resume.parttime_id = vm.item.id;
  161. vm.resume.recruit_id=vm.item.publisher;
  162. deleteEmptyProperty(vm.resume);
  163. request(urls().parttime_delivery, vm.resume, function(res) {
  164. plus.nativeUI.closeWaiting();
  165. if(res.result == true) {
  166. vm.msg = '已报名'
  167. mui.toast('报名成功');
  168. } else {
  169. mui.alert(res.msg);
  170. }
  171. })
  172. }
  173. }
  174. })
  175. </script>
  176. </body>
  177. </html>