zyz.html 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399
  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <script src="./vue.js"></script>
  8. <title>志愿者</title>
  9. </head>
  10. <body>
  11. <div id="app" v-cloak>
  12. <div style="margin-top: 15px;text-align: center;font-size: 30px;">{{redname}}红十字会志愿工作者登记表</div>
  13. <div style="margin:15px auto;">
  14. <table class="table table-striped table-bordered" align="center" valign="center">
  15. <tr>
  16. <td class="column title" colspan="9">个人资料</td>
  17. </tr>
  18. <tr>
  19. <td class="column">姓名</td>
  20. <td class="value">{{decodeURIComponent(hh.name)}}</td>
  21. <td class="column">性别</td>
  22. <td class="value" colspan="1">{{decodeURIComponent(hh.sex_text)}}</td>
  23. <td class="column">出生年月</td>
  24. <td class="value" colspan="3">{{decodeURIComponent(hh.birth)}}</td>
  25. <td class="value" rowspan="4"><img class="portrait" :src="decodeURIComponent(hh.image)" /></td>
  26. </tr>
  27. <tr>
  28. <td class="column">移动电话</td>
  29. <td class="value">{{decodeURIComponent(hh.phone)}}</td>
  30. <td class="column">住宅电话</td>
  31. <td class="value"></td>
  32. <td class="column">办公电话</td>
  33. <td class="value" colspan="3"></td>
  34. </tr>
  35. <tr>
  36. <td class="column">电子邮箱</td>
  37. <td class="value" colspan="3">{{decodeURIComponent(hh.email) != 'undefined'?decodeURIComponent(hh.email): '' }}</td>
  38. <td class="column">QQ号码</td>
  39. <td class="value" colspan="3"></td>
  40. </tr>
  41. <tr>
  42. <td class="column">联系地址</td>
  43. <td class="value" colspan="3">{{decodeURIComponent(hh.address)}}</td>
  44. <td class="column">邮编</td>
  45. <td class="value" colspan="3"></td>
  46. </tr>
  47. <tr>
  48. <td class="column">工作单位</td>
  49. <!--typeof(isadmin)=="undefined"-->
  50. <td class="value" colspan="3">{{decodeURIComponent(hh.work)!= 'undefined'?decodeURIComponent(hh.work): '' }}</td>
  51. <td class="column">职业/职务</td>
  52. <td class="value" colspan="4">{{decodeURIComponent(hh.specialty)!= 'undefined'?decodeURIComponent(hh.specialty): '' }}</td>
  53. </tr>
  54. <tr>
  55. <td class="column">教育程度</td>
  56. <td class="value" colspan="3">{{chooseEdu[decodeURIComponent(hh.education)*1]}}</td>
  57. <td class="column">有无服务经验</td>
  58. <td class="value" colspan="4">{{decodeURIComponent(hh.is_experience_text)}}</td>
  59. <!--<td class="column">专业</td>-->
  60. <!--<td class="value" colspan="4">{$arr.zy}</td>-->
  61. </tr>
  62. <tr>
  63. <td class="column" colspan="9">
  64. <span class="title">可提供服务时间</span>(请于适当方格内加上√号,可选多项){{decodeURIComponent(hh.work_week_text)}}
  65. </td>
  66. </tr>
  67. <tr>
  68. <td class="tpl">时间</td>
  69. <td class="tpl">周一</td>
  70. <td class="tpl">周二</td>
  71. <td class="tpl">周三</td>
  72. <td class="tpl">周四</td>
  73. <td class="tpl">周五</td>
  74. <td class="tpl">周六</td>
  75. <td class="tpl">周日</td>
  76. <td class="tpl">假日</td>
  77. </tr>
  78. <tr>
  79. <td class="tpl">早上</td>
  80. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期一') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  81. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期二') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  82. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期三') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  83. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期四') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  84. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期五') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  85. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期六') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  86. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期日') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  87. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('假日') != -1 && timeare.indexOf('早上') != -1 ? '√': ''}}</td>
  88. </tr>
  89. <tr>
  90. <td class="tpl">下午</td>
  91. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期一') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  92. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期二') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  93. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期三') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  94. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期四') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  95. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期五') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  96. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期六') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  97. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期日') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  98. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('假日') != -1 && timeare.indexOf('下午') != -1 ? '√': ''}}</td>
  99. </tr>
  100. <tr>
  101. <td class="tpl">晚上</td>
  102. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期一') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  103. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期二') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  104. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期三') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  105. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期四') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  106. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期五') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  107. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期六') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  108. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('星期日') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  109. <td class="value" v-if="">{{decodeURIComponent(hh.work_week_text).indexOf('假日') != -1 && timeare.indexOf('晚上') != -1 ? '√': ''}}</td>
  110. </tr>
  111. <tr>
  112. <td class="column" colspan="9">
  113. <span class="title">有兴趣参与的工作</span>(请于适当方格内加上√号,可选多项)
  114. </td>
  115. </tr>
  116. <tr class="value1-tip">
  117. <td colspan="9">
  118. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('赈灾工作') != -1"/>赈灾工作</div>
  119. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('救护培训') != -1"/>救护培训</div>
  120. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('活动策划') != -1"/>活动策划</div>
  121. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('护送服务') != -1"/>护送服务</div>
  122. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('编辑及出版') != -1"/>编辑及出版</div>
  123. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('医疗护理服务') != -1"/>医疗护理服务</div>
  124. </td>
  125. </tr>
  126. <tr class="value1-tip">
  127. <td colspan="9">
  128. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('探访服务') != -1"/>探访服务</div>
  129. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('外语翻译') != -1"/>外语翻译</div>
  130. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('调查服务') != -1"/>调查服务</div>
  131. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('联络服务') != -1"/>联络服务</div>
  132. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('宣传及推广') != -1"/>宣传及推广</div>
  133. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste).indexOf('文书档案工作') != -1"/>文书档案工作</div>
  134. </td>
  135. </tr>
  136. <tr class="value1-tip">
  137. <td colspan="9">
  138. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.taste_title) != 'undefined'"/>其他(请注明):{{decodeURIComponent(hh.taste_title) != 'undefined'? decodeURIComponent(hh.taste_title): ''}}</div>
  139. </td>
  140. </tr>
  141. <tr>
  142. <td class="column" colspan="9">
  143. <span class="title">专长</span>(请于适当方格内加上√号,可选多项)
  144. </td>
  145. </tr>
  146. <tr class="value1-tip">
  147. <td colspan="9">
  148. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('医疗护理') != -1"/>医疗护理</div>
  149. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('紧急救护') != -1"/>紧急救护</div>
  150. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('出版/设计') != -1"/>出版/设计</div>
  151. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('影音制作') != -1"/>影音制作</div>
  152. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('文艺演出') != -1"/>文艺演出</div>
  153. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('网络软件') != -1"/>网络软件</div>
  154. </td>
  155. </tr>
  156. <tr class="value1-tip">
  157. <td colspan="9">
  158. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('摄影摄像') != -1"/>摄影摄像</div>
  159. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('电脑中文打字') != -1"/>电脑中文打字</div>
  160. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('汽车驾驶') != -1"/>汽车驾驶</div>
  161. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('外语翻译') != -1"/>外语翻译</div>
  162. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('文书档案工作') != -1"/>文书档案工作</div>
  163. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('法律咨询') != -1"/>法律咨询</div>
  164. </td>
  165. </tr>
  166. <tr class="value1-tip">
  167. <td colspan="9">
  168. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali).indexOf('文案策划') != -1"/>文案策划</div>
  169. <div class="value1"><input type="checkbox" class="cameraCheckBoxTop" :checked="decodeURIComponent(hh.speciali_title) != 'undefined'"/>其他(请注明):{{decodeURIComponent(hh.speciali_title) != 'undefined'?decodeURIComponent(hh.speciali_title): ''}}</div>
  170. </td>
  171. </tr>
  172. <tr>
  173. <td class="column title" colspan="9">个人声明</td>
  174. </tr>
  175. <tr>
  176. <td class="value" colspan="9">
  177. <div class="value4" style="padding-top: 22px;">本人同意将个人资料送交红十字志愿者工作委员会,申请注册登记,成为</br>一名光荣的红十字志愿工作者,并乐于接受志愿工作安排,提供服务。</div>
  178. <div class="value5">申请人(签名):</div>
  179. <div class="value6"><p class="tp">年<p class="tp">月</p><p class="tp"> 日</p></div>
  180. </td>
  181. </tr>
  182. <tr>
  183. <td class="column title" colspan="2">管理机构意见</td>
  184. <td class="value" colspan="7">
  185. <div class="value7">(签章)</div>
  186. <div class="value8"><p class="tp">年<p class="tp">月</p><p class="tp"> 日</p></div>
  187. </td>
  188. </tr>
  189. </table>
  190. </div>
  191. </div>
  192. </div>
  193. </body>
  194. <script type="text/javascript" charset="utf-8">
  195. console.log(window.location.search)
  196. var app = new Vue({
  197. el: '#app',
  198. data() {
  199. return {
  200. hh: '',
  201. chooseEdu: ['小学以下', '小学', '初中', '高中/中专', '大专/高职','本科','研究生', '硕士', '博士', '博士后'],
  202. // timeare: '早上',
  203. }
  204. },
  205. created() {
  206. // this.loadData();
  207. // alert(window.location.search)
  208. this.hh = this.GetRequest()
  209. },
  210. computed: {
  211. redname() {
  212. let str = ''
  213. if(this.hh) {
  214. console.log(this.hh,'this.hh')
  215. switch (this.hh.cid) {
  216. case '7':
  217. str = '公安县'
  218. break;
  219. case '2':
  220. str = '咸宁市'
  221. break;
  222. case '12':
  223. str = '咸宁市'
  224. break
  225. case '9':
  226. str = '东宝区'
  227. break;
  228. case '11':
  229. str = '长宁区'
  230. break;
  231. case '13':
  232. str = '赤壁市'
  233. break;
  234. default:
  235. }
  236. }
  237. return str
  238. },
  239. timeare() {
  240. let bin = decodeURIComponent(this.hh.start_hour)
  241. let ed = decodeURIComponent(this.hh.end_hour)
  242. console.log(bin,ed)
  243. let str = ''
  244. if(bin < '12:00') {
  245. str += '上午'
  246. }else if(bin < '17:00') {
  247. str += '下午'
  248. }else {
  249. str += '晚上'
  250. }
  251. if(ed < '12:00') {
  252. str += '上午'
  253. }else if(ed < '17:00') {
  254. str += '下午'
  255. }else {
  256. str += '晚上'
  257. }
  258. console.log(str,'shijian ')
  259. return str
  260. }
  261. },
  262. mounted() {
  263. },
  264. methods: {
  265. GetRequest() {
  266. var url = location.search; //获取url中"?"符后的字串
  267. var theRequest = new Object();
  268. if (url.indexOf("?") != -1) {
  269. var str = url.substr(1);
  270. strs = str.split("&");
  271. for(var i = 0; i < strs.length; i ++) {
  272. theRequest[strs[i].split("=")[0]]=(strs[i].split("=")[1]);
  273. }
  274. }
  275. return theRequest;
  276. }
  277. }
  278. })
  279. </script>
  280. <style scoped="scoped">
  281. .table {
  282. border-collapse: collapse;
  283. border-spacing: 0;
  284. background-color: transparent;
  285. display: table;
  286. max-width: 100%;
  287. margin: 0 auto;
  288. }
  289. .table td {
  290. text-align: center;
  291. vertical-align: middle;
  292. font-size: 14px;
  293. font-family: 'Arial Normal', 'Arial';
  294. color: #333333;
  295. padding: 4px 12px;
  296. }
  297. .table-bordered {
  298. border: 1px solid #ddd;
  299. }
  300. * {
  301. margin: 0px;
  302. padding: 0px;
  303. }
  304. .column {
  305. width: 100px;
  306. height: 15px;
  307. border: 1px solid #333;
  308. background: #f1f1f1;
  309. }
  310. .tpl{
  311. width: 50px !important;
  312. height: 15px;
  313. border: 1px solid #333;
  314. background: #f1f1f1;
  315. }
  316. .title{
  317. font-size: 18px !important;
  318. font-weight: bold;
  319. }
  320. .value {
  321. width: 20px;
  322. height: 15px;
  323. border: 1px solid #333;
  324. }
  325. .value1-tip{
  326. border: 1px solid #333;
  327. }
  328. .value1{
  329. min-width:110px;
  330. display: inline-block;
  331. }
  332. .value9{
  333. width:550px;
  334. display: inline-block;
  335. text-align: left;
  336. }
  337. .value2{
  338. width:550px;
  339. display: inline-block;
  340. text-align: left;
  341. }
  342. .value3{
  343. width:610px;
  344. display: inline-block;
  345. text-align: left;
  346. }
  347. .value4{
  348. padding: 8px 0px;
  349. }
  350. .value5{
  351. padding-right: 180px;
  352. text-align: right;
  353. }
  354. .value6{
  355. text-align: right;
  356. padding: 8px 45px;
  357. }
  358. .value7{
  359. text-align: right;
  360. padding-right: 180px;
  361. padding-top: 10px;
  362. }
  363. .value8{
  364. text-align: right;
  365. padding: 8px 45px;
  366. }
  367. .tp{
  368. width: 60px;
  369. display: inline-block;
  370. }
  371. .cameraCheckBoxTop{
  372. margin-right: 8px;
  373. width: 15px;
  374. height: 15px;
  375. }
  376. .portrait {
  377. width: 100px;
  378. height: 100px;
  379. }
  380. .button-dayin{
  381. background-color: #FF0000;
  382. color: #FFFFFF;
  383. width: 200px;
  384. padding: 20px 0px;
  385. margin: 50px auto;
  386. text-align: center;
  387. font-size: 30px;
  388. }
  389. </style>
  390. </html>