用工小程序前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

252 lines
8.7 KiB

7 months ago
3 months ago
7 months ago
3 months ago
7 months ago
3 months ago
7 months ago
  1. <template>
  2. <view class="u-page">
  3. <view class="se-px-20 se-pt-40 se-flex-v-c">
  4. <template v-if="stepsIndex==0">
  5. <view class="se-flex se-flex-h-c">
  6. <image class="se-a-50" src="@/static/image/46524.png" mode=""></image>
  7. <text class="se-c-orange se-fs-30 se-ml-10">订单待接单</text>
  8. </view>
  9. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  10. </template>
  11. <template v-if="stepsIndex==1">
  12. <view class="se-flex se-flex-h-c">
  13. <image class="se-a-50" src="@/static/image/46524.png" mode=""></image>
  14. <text class="se-c-orange se-fs-30 se-ml-10">订单进行中</text>
  15. </view>
  16. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  17. </template>
  18. <template v-if="stepsIndex==2">
  19. <view class="se-flex se-flex-h-c">
  20. <image class="se-a-50" src="@/static/image/46525.png" mode=""></image>
  21. <text class="se-c-orange se-fs-30 se-ml-10">试工完成</text>
  22. </view>
  23. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  24. </template>
  25. <template v-if="stepsIndex==3">
  26. <view class="se-flex se-flex-h-c">
  27. <image class="se-a-50" src="@/static/image/46525.png" mode=""></image>
  28. <text class="se-c-orange se-fs-30 se-ml-10">企业待确认</text>
  29. </view>
  30. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  31. </template>
  32. <template v-if="stepsIndex==4">
  33. <view class="se-flex se-flex-h-c">
  34. <image class="se-a-50" src="@/static/image/46525.png" mode=""></image>
  35. <text class="se-c-orange se-fs-30 se-ml-10">企业待支付</text>
  36. </view>
  37. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  38. </template>
  39. <template v-if="stepsIndex==5">
  40. <view class="se-flex se-flex-h-c">
  41. <image class="se-a-50" src="@/static/image/46525.png" mode=""></image>
  42. <text class="se-c-orange se-fs-30 se-ml-10">订单已完成</text>
  43. </view>
  44. <text class="se-c-orange se-mt-20 se-fs-24">124530有效</text>
  45. </template>
  46. </view>
  47. <view class="se-px-20 se-py-40">
  48. <u-steps activeColor="#FF7A31" :current="stepsIndex" dot>
  49. <u-steps-item class="se-fs-22" v-for="(items,indexs) in stepsList" :key="indexs" :title="items.title">
  50. <!-- <text class="se-fs-22" slot="title">{{items.title}}</text> -->
  51. </u-steps-item>
  52. </u-steps>
  53. </view>
  54. <view class="se-px-20">
  55. <view class="se-px-220 se-pb-30 se-fs-20 se-flex se-flex-h-c">
  56. <template v-if="stepsIndex==0">
  57. <view @click="onCancel()"
  58. class="se-mx-10 se-w-200 se-b se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-66 se-bgc-f5">
  59. <text>取消</text>
  60. </view>
  61. </template>
  62. <template v-if="stepsIndex==1">
  63. <view @click="onSubmit()"
  64. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  65. <text>确认</text>
  66. </view>
  67. <view @click="onCancel()"
  68. class="se-mx-10 se-w-200 se-b se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-66 se-bgc-f5">
  69. <text>取消</text>
  70. </view>
  71. </template>
  72. <template v-if="stepsIndex==2">
  73. <view @click="onService()"
  74. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  75. <text>联系客服</text>
  76. </view>
  77. </template>
  78. <template v-if="stepsIndex==3">
  79. <view @click="onSubmit()"
  80. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  81. <text>确认</text>
  82. </view>
  83. </template>
  84. <template v-if="stepsIndex==4">
  85. <view @click="onPay()"
  86. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  87. <text>去支付</text>
  88. </view>
  89. </template>
  90. <template v-if="stepsIndex==5">
  91. <view @click="onDel()"
  92. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  93. <text>删除</text>
  94. </view>
  95. </template>
  96. </view>
  97. </view>
  98. <view class="se-px-40 se-py-20">
  99. <view class="se-flex se-flex-ai-c se-pb-10">
  100. <view class="line-orange"></view>
  101. <view class="se-ml-10 se-fs-32 se-c-black se-fw-6">
  102. 商品详情
  103. </view>
  104. </view>
  105. <view class="se-flex se-flex-v-sa se-flex-ai-fs se-py-20">
  106. <view class="se-flex">
  107. <view class="se-w-160 se-h-160">
  108. <image class="se-w-160 se-h-160 se-br-10" src="https://cdn.uviewui.com/uview/album/1.jpg" mode=""></image>
  109. </view>
  110. <view class="se-ml-20 se-flex se-flex-v-sa se-flex-ai-fs">
  111. <view class="se-fw-6 se-c-black se-fs-30 se-display-ib">泰山工装石膏板搬运</view>
  112. <view class="se-fs-24 se-c-text-third se-display-ib">所属行业:水泥搬运</view>
  113. <view class="se-fs-24 se-c-text-third se-display-ib">所属工种:中午搬运</view>
  114. </view>
  115. </view>
  116. <view class="se-flex se-flex-h-sb se-w-p-100 se-pt-20">
  117. <view class="se-fs-24 se-display-ib">薪资</view>
  118. <view class="se-c-orange se-fs-32 se-fw-6 se-display-ib">6000</view>
  119. </view>
  120. </view>
  121. <u-line dashed></u-line>
  122. <view class="se-py-10 se-pb-30">
  123. <view class="se-mt-30">
  124. <text class="se-fs-28 se-c-black se-fw5">姓名:李满和</text>
  125. <text class="se-fs-24 se-c-text-third se-ml-40">联系方式:13189698114</text>
  126. <view class="se-bgc-orange se-c-white se-fs-20 se-display-ib se-px-10 se-py-5 se-br-10 se-ml-10">
  127. 复制
  128. </view>
  129. </view>
  130. <view class="se-mt-10">
  131. <text class="se-fs-24 se-c-33">工作地址:湖南省长沙市雨花区高升路与时代阳光大道西交叉口东北方向140米御天国际商汇中心5栋6023</text>
  132. <view class="se-bgc-orange se-c-white se-fs-20 se-display-ib se-px-10 se-py-5 se-br-10 se-ml-10">
  133. 复制
  134. </view>
  135. </view>
  136. </view>
  137. <u-line dashed></u-line>
  138. <view class="se-mt-20 se-pt-20 se-pb-30">
  139. <view class="se-fw-6 se-fs-32 se-c-black">
  140. 订单信息
  141. </view>
  142. <view class="se-flex se-pt-30 se-flex-h-sb">
  143. <view class="se-fs-24 se-display-ib">支付方式</view>
  144. <view class="se-fs-24 se-display-ib">试用以后支付</view>
  145. </view>
  146. <view class="se-flex se-pt-30 se-flex-h-sb">
  147. <view class="se-fs-24 se-display-ib">工作时间</view>
  148. <view class="se-fs-24 se-display-ib">3h</view>
  149. </view>
  150. </view>
  151. <u-line dashed></u-line>
  152. <view class="se-mt-20 se-pt-20 se-pb-30">
  153. <view class="se-fw-6 se-fs-32 se-c-black">
  154. 工作内容
  155. </view>
  156. <view class="se-fs-24 se-pt-20 se-pb-20 se-lh-40">
  157. <u-parse :content="detail"></u-parse>
  158. </view>
  159. </view>
  160. <view class="se-px-220 se-pb-30 se-fs-20 se-flex se-flex-h-c">
  161. <view @click="onService()"
  162. class="se-mx-10 se-w-200 se-br-40 se-flex-h-c se-h-50 se-lh-50 se-ta-c se-fs-24 se-c-white se-bgc-orange">
  163. <text>联系客服</text>
  164. </view>
  165. </view>
  166. </view>
  167. </view>
  168. </template>
  169. <script>
  170. import {
  171. orderDetail
  172. } from "@/common/api.js"
  173. export default{
  174. data(){
  175. return{
  176. stepsIndex:4,
  177. stepsList:[
  178. {
  179. title:"接单",
  180. date:"10:21"
  181. },
  182. {
  183. title:"进行",
  184. date:"10:22"
  185. },
  186. {
  187. title:"试工完成",
  188. date:"10:23"
  189. },
  190. {
  191. title:"企业确认",
  192. date:"10:24"
  193. },
  194. {
  195. title:"企业支付",
  196. date:"10:25"
  197. },
  198. {
  199. title:"企业完成",
  200. date:"10:26"
  201. }
  202. ],
  203. detail:`<p>
  204. 1全日制大专以上学历艺术设计类相关专业;<br/>
  205. 2两年以上平面品牌视觉设计等相关工作经验能独立完成项目的设计工作 3C数码/个护健 类产品服务经验优先有乙方工作经验佳;<br/>
  206. 3具备一定的设计提案能力能完整的呈现设计思路与创意能清晰的表达设计逻辑与思考;<br/>
  207. 4热爱设计平面基本功扎实拥有优良的审美与创意想法对版式色彩把控能力强;对工作富有责任心具备团队沟通与协作能力;<br/>
  208. 5精通 PSAICDR 等平面设计软件能独立完成日常平面设计工作内容熟练使用 PPT/Keynote能完成提案内容的材料美化工作<br/>
  209. </p>`
  210. }
  211. },
  212. onLoad(options) {
  213. this.orderId=options.orderId
  214. this.onOrderDetail()
  215. },
  216. methods:{
  217. onOrderDetail(){
  218. let that = this
  219. let params = {
  220. orderId:that.orderId
  221. }
  222. orderDetail(params).then(response=>{
  223. }).catch(error=>{
  224. })
  225. },
  226. onCancel(){
  227. uni.navigateBack({
  228. delta:1
  229. })
  230. },
  231. onService(){
  232. console.info(`联系客服`)
  233. },
  234. onsubmit(){
  235. console.info(`确认`)
  236. },
  237. onPay(){
  238. uni.navigateTo({
  239. url:"/pages_subpack/pay/index"
  240. })
  241. },
  242. onDel(){
  243. console.info(`删除`)
  244. }
  245. }
  246. }
  247. </script>
  248. <style lang="scss" scoped>
  249. </style>