contract.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  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 rel="stylesheet" href="../../css/animate.min.css" />
  9. <style>
  10. .mui-bar-nav~.mui-content{padding-top: 54px;}
  11. .bg{padding: 20px;text-align: center;}
  12. input{height: 50px!important;}
  13. .m_box {padding: 10px 10px 25px 10px;box-shadow: 0 1px 6px #dbdbdb;}
  14. .btn{width: 230px;margin-top: -21px;}
  15. .img_list{font-size: 13px;color: darkgray;}
  16. .row .sm3{padding: 5px;width: 33.33%;}
  17. .img{width: 60px;border-radius: 3px;border: 1px solid darkgray;margin-bottom: 5px;}
  18. .img.active{border: 2px solid green;}
  19. .ht{text-align: left;padding-left: 20px;margin-top: -20px;padding-bottom: 10px;font-size: 14px;}
  20. .sa.active{color: green;}
  21. </style>
  22. </head>
  23. <body>
  24. <div id="app">
  25. <header class="mui-bar mui-bar-nav">
  26. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  27. <h1 class="mui-title">发送合同</h1>
  28. </header>
  29. <div class="mui-content animated fadeInUp" style="margin-top: 10px;">
  30. <div class="bg">
  31. <div class="m_box">
  32. <div class="input-group">
  33. 合同接收人: {{items.mz}}
  34. </div>
  35. <div class="row">
  36. <label>合同金额 <span></span></label>
  37. <input type="tel" v-model="item.contract_amount" placeholder="输入合同金额">
  38. </div>
  39. <div class="row">
  40. <label>合同内容 <span></span></label>
  41. <textarea rows="3" v-model="item.contract_content" placeholder="输入合同内容"> </textarea>
  42. </div>
  43. <div class="row">
  44. <label>备注 <span></span></label>
  45. <textarea rows="3" v-model="item.remark" placeholder="输入备注"> </textarea>
  46. </div>
  47. <div class="img_list">
  48. <div class="ht">请选择合同</div>
  49. <div class="row">
  50. <div class="sm3" v-for="(item,index) in contract_list" @click="select(item,index)">
  51. <img :src="item.pic" class="img" :class="{active:curr==index}" @click.stop="view(item.pic)"/>
  52. <div class="sa" :class="{active:curr==index}">{{item.name}}</div>
  53. </div>
  54. <div class="clear"></div>
  55. </div>
  56. </div>
  57. </div>
  58. <button class="btn" @click="ok()">确认发送</button>
  59. </div>
  60. </div>
  61. </div>
  62. <script src="../../js/mui.min.js"></script>
  63. <script src="../../js/app.js"></script>
  64. <script src="../../js/vue.min.js"></script>
  65. <script>
  66. var vm = new Vue({
  67. el: "#app",
  68. data: {
  69. contract_list:[{name:'范本1',pic:'../../images/ht1.jpg'},{name:'范本2',pic:'../../images/ht1.jpg'},{name:'范本3',pic:'../../images/ht1.jpg'}],
  70. curr:0,
  71. item: {
  72. //client: getUser().id,
  73. templete_id:''
  74. },
  75. items: {},
  76. },
  77. mounted: function() {
  78. mui.plusReady(function() {
  79. console.log("res===" + JSON.stringify(plus.webview.currentWebview().param));
  80. if (plus.webview.currentWebview().param != null) {
  81. vm.items = plus.webview.currentWebview().param;
  82. vm.item.trustee = plus.webview.currentWebview().param.userId;
  83. vm.item.parttime_id = plus.webview.currentWebview().param.parttime_id;
  84. vm.item.client_status = 1; //发送表示委托人同意
  85. //获取合同列表
  86. request(urls().contract_list,{}, function(res) {
  87. vm.contract_list = res;
  88. plus.nativeUI.closeWaiting();
  89. })
  90. }
  91. })
  92. },
  93. methods: {
  94. //编辑
  95. ok: function() {
  96. if (vm.item.templete_id == '') {
  97. mui.alert('请选择合同模板');
  98. return;
  99. }
  100. request(urls().send_contract, this.item, function(res) {
  101. if (res.result == true) {
  102. mui.toast("操作成功");
  103. plus.webview.getWebviewById("detail").reload(true);
  104. } else {
  105. mui.toast(res.msg);
  106. }
  107. plus.nativeUI.closeWaiting();
  108. })
  109. },
  110. select:function(item,index){
  111. this.curr=index;
  112. },
  113. view:function(img){
  114. plus.nativeUI.previewImage([img],{current:0,loop: true,indicator: 'number'});
  115. }
  116. }
  117. })
  118. </script>
  119. </body>
  120. </html>