特易招,招聘小程序
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.

217 lines
4.8 KiB

4 months ago
3 months ago
3 months ago
3 months ago
7 months ago
7 months ago
7 months ago
5 months ago
7 months ago
5 months ago
7 months ago
5 months ago
4 months ago
4 months ago
3 months ago
3 months ago
7 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
  1. <template>
  2. <!-- 电子合同 -->
  3. <view>
  4. <navbar title="电子合同"
  5. leftClick
  6. @leftClick="$utils.navigateBack"/>
  7. <view class="">
  8. <uv-tabs :list="tabs"
  9. lineColor="#3796F8"
  10. lineHeight="8rpx"
  11. lineWidth="50rpx"
  12. :scrollable="false"
  13. @click="clickTabs"></uv-tabs>
  14. </view>
  15. <view class="content">
  16. <view class="projectContent" v-for="(item, index) in list" :key="index">
  17. <view class="item">
  18. <image src="/static/image/contract/contract.png" mode="aspectFill"/>
  19. <view class="itemList">
  20. <view class="projectName">
  21. {{ item.title }}
  22. <text class="status" :class="{
  23. 'status-pending': role ? item.bossStatus === 0 : item.employeeStatus === 0,
  24. 'status-signed': role ? item.bossStatus === 1 : item.employeeStatus === 1,
  25. 'status-completed': role ? item.bossStatus === 2 : item.employeeStatus === 2
  26. }">
  27. {{ role ?
  28. (item.bossStatus === 0 ? '待签署' : item.bossStatus === 1 ? '已签署' : '已完成') :
  29. (item.employeeStatus === 0 ? '待签署' : item.employeeStatus === 1 ? '已签署' : '已完成')
  30. }}
  31. </text>
  32. </view>
  33. <view class="buyer">甲方{{ item.companyName }}</view>
  34. <view class="seller">乙方{{ item.employeeName }}</view>
  35. </view>
  36. <view class="actions">
  37. <view class="view-btn" @click="showPDF(item)">
  38. <uv-icon name="eye" color="#2979ff" size="30rpx"></uv-icon>
  39. <text>查看</text>
  40. </view>
  41. <view class="sign-btn"
  42. v-if="(role && item.bossStatus === 0) || (!role && item.employeeStatus === 0)"
  43. @click.stop="$utils.navigateTo('/pages_order/contract/electronicSignature?id=' + item.id)">
  44. <uv-icon name="edit-pen" color="#2979ff" size="30rpx"></uv-icon>
  45. <text>签署</text>
  46. </view>
  47. </view>
  48. </view>
  49. </view>
  50. </view>
  51. </view>
  52. </template>
  53. <script>
  54. import mixinList from '@/mixins/list.js'
  55. import { mapState } from 'vuex'
  56. export default {
  57. mixins : [mixinList],
  58. data() {
  59. return {
  60. tabs: [
  61. {
  62. name: '全部合同'
  63. },
  64. {
  65. name: '待我签署'
  66. },
  67. {
  68. name: '他人签署'
  69. },
  70. {
  71. name: '签约完成'
  72. },
  73. ],
  74. type : 0,
  75. mixinsListApi : 'queryContractList',
  76. }
  77. },
  78. computed : {
  79. },
  80. onLoad() {
  81. this.queryParams.role = this.role ? 1 : 0
  82. },
  83. methods: {
  84. clickTabs({index}) {
  85. this.type = index
  86. this.getData()
  87. },
  88. showPDF(item){
  89. // this.$utils.
  90. // navigateTo('/pages_order/contract/contractDetail?id='
  91. // + item.id)
  92. // 只能查看内容的时候
  93. if(this.role && item.bossStatus != 0 ||
  94. item.employeeStatus != 0 && !this.role
  95. ){
  96. uni.downloadFile({
  97. url : item.contract,
  98. success : res => {
  99. uni.openDocument({
  100. filePath: res.tempFilePath,
  101. })
  102. }
  103. })
  104. return
  105. }
  106. uni.showModal({
  107. title: '您希望的操作是?!',
  108. cancelText: '签署合同',
  109. confirmText: '查看内容',
  110. success : e => {
  111. if(e.confirm){
  112. uni.downloadFile({
  113. url : item.contract,
  114. success : res => {
  115. uni.openDocument({
  116. filePath: res.tempFilePath,
  117. })
  118. }
  119. })
  120. }else{
  121. this.$utils.
  122. navigateTo('/pages_order/contract/electronicSignature?id='
  123. + item.id)
  124. }
  125. }
  126. })
  127. },
  128. }
  129. }
  130. </script>
  131. <style scoped lang="scss">
  132. .content {
  133. width: 100%;
  134. height: 100%;
  135. .projectContent {
  136. background-color: #fff;
  137. display: flex;
  138. margin: 30rpx;
  139. border-radius: 20rpx;
  140. .item{
  141. display: flex;
  142. width: 100%;
  143. padding: 20rpx;
  144. image {
  145. width: 140rpx;
  146. height: 120rpx;
  147. margin-right: 20rpx;
  148. }
  149. .itemList {
  150. flex: 1;
  151. .projectName {
  152. font-size: 32rpx;
  153. font-weight: bold;
  154. margin-bottom: 16rpx;
  155. display: flex;
  156. align-items: center;
  157. .status {
  158. font-size: 24rpx;
  159. padding: 4rpx 16rpx;
  160. border-radius: 20rpx;
  161. margin-left: 16rpx;
  162. &.status-pending {
  163. background-color: #E6F7FF;
  164. color: #1890FF;
  165. }
  166. &.status-signed {
  167. background-color: #F6FFED;
  168. color: #52C41A;
  169. }
  170. &.status-completed {
  171. background-color: #F5F5F5;
  172. color: #666666;
  173. }
  174. }
  175. }
  176. .buyer, .seller {
  177. font-size: 24rpx;
  178. color: #666;
  179. margin-top: 8rpx;
  180. }
  181. }
  182. .actions {
  183. display: flex;
  184. flex-direction: column;
  185. justify-content: center;
  186. gap: 16rpx;
  187. .view-btn, .sign-btn {
  188. display: flex;
  189. align-items: center;
  190. padding: 12rpx 24rpx;
  191. border-radius: 30rpx;
  192. background-color: #F0F7FF;
  193. text {
  194. color: #2979ff;
  195. font-size: 24rpx;
  196. margin-left: 8rpx;
  197. }
  198. }
  199. .sign-btn {
  200. background-color: #2979ff;
  201. text, uv-icon {
  202. color: #fff;
  203. }
  204. }
  205. }
  206. }
  207. }
  208. }
  209. </style>