Item.vue 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. <template>
  2. <div class="oa-flow-item flx">
  3. <div class="oa-flow-item__left flx-shrink text-body-r">
  4. <!-- <template v-if="index == 0">
  5. {{ t("table.oa_doc.opd") }}
  6. </template>
  7. <template v-else>
  8. {{ item.flowstepname }}
  9. </template> -->
  10. <span class="icon">
  11. <!-- <i v-if="index == 0" class="iconfont iconSend"></i> -->
  12. <i v-if="Number(item.oarowid)" class="iconfont iconLocation"></i>
  13. <i v-else-if="Number(item.passed)" class="iconfont iconcheck-circle-fill"></i>
  14. <span v-else class="undone"></span>
  15. </span>
  16. </div>
  17. <main class="oa-flow-item__right flx-1">
  18. <header class="flx">
  19. <span class="flx-1">
  20. {{ item.cmpemp }}
  21. </span>
  22. <span class="text-body-r" :title="item.cmpdate">
  23. <el-icon><Calendar /></el-icon>
  24. {{ isFilterTime(item.cmpdate) }}
  25. </span>
  26. </header>
  27. <section class="flx-justify-between mt-4" style="align-items: flex-start">
  28. <!-- <div style="margin: auto; margin-top: 0">
  29. <AvatarIcon size="small" :username="item.empname"></AvatarIcon>
  30. </div> -->
  31. <!-- <div class="oa-flow-item__right-content flx-1 flx"> -->
  32. <!-- <div class="oa-flow-item__right-content-title flx-col flx-center">
  33. <div class="text-f-c text-disable">不含税部门价</div>
  34. <span class="text-h5-b text-primary-text">
  35. {{ isFilterPrice(item.nottax_dept_cost) }}
  36. </span>
  37. </div>
  38. <div class="oa-flow-item__right-content-title flx-col flx-center">
  39. <div class="text-f-c text-disable">含税部门价</div>
  40. <span class="text-h5-b text-primary-text">
  41. {{ isFilterPrice(item.dept_cost) }}
  42. </span>
  43. </div>
  44. <div class="oa-flow-item__right-content-title flx-col flx-center">
  45. <div class="text-f-c text-disable">外币价</div>
  46. <span class="text-h5-b text-primary-text">
  47. {{ isFilterPrice(item.foreign_cost) }}
  48. </span>
  49. </div> -->
  50. <div class="oa-flow-item__right-content-title flx-col flx-center">
  51. <div class="text-f-c text-disable">散单金额</div>
  52. <span class="text-h5-b text-primary-text">
  53. {{ isFilterPrice(item?.dannum_cost1) }}
  54. </span>
  55. <div class="text-f-c text-disable" v-if="isSuper">不含税出厂价</div>
  56. <span class="text-h5-b text-primary-text" v-if="isSuper">
  57. {{ isFilterPrice(item?.dijia_cost1) }}
  58. </span>
  59. </div>
  60. <div class="oa-flow-item__right-content-title flx-col flx-center">
  61. <div class="text-f-c text-disable">小单金额</div>
  62. <span class="text-h5-b text-primary-text">
  63. {{ isFilterPrice(item?.dannum_cost4) }}
  64. </span>
  65. <div class="text-f-c text-disable" v-if="isSuper">不含税出厂价</div>
  66. <span class="text-h5-b text-primary-text" v-if="isSuper">
  67. {{ isFilterPrice(item?.dijia_cost4) }}
  68. </span>
  69. </div>
  70. <div class="oa-flow-item__right-content-title flx-col flx-center">
  71. <div class="text-f-c text-disable">标准金额</div>
  72. <span class="text-h5-b text-primary-text">
  73. {{ isFilterPrice(item?.dannum_cost2) }}
  74. </span>
  75. <div class="text-f-c text-disable" v-if="isSuper">不含税出厂价</div>
  76. <span class="text-h5-b text-primary-text" v-if="isSuper">
  77. {{ isFilterPrice(item?.dijia_cost2) }}
  78. </span>
  79. </div>
  80. <div class="oa-flow-item__right-content-title flx-col flx-center">
  81. <div class="text-f-c text-disable">大单金额</div>
  82. <span class="text-h5-b text-primary-text">
  83. {{ isFilterPrice(item?.dannum_cost3) }}
  84. </span>
  85. <div class="text-f-c text-disable" v-if="isSuper">不含税出厂价</div>
  86. <span class="text-h5-b text-primary-text" v-if="isSuper">
  87. {{ isFilterPrice(item?.dijia_cost3) }}
  88. </span>
  89. </div>
  90. <div class="oa-flow-item__right-content-title flx-col flx-center" v-if="isSuper">
  91. <div class="text-f-c text-disable">FOB费</div>
  92. <span class="text-h5-b text-primary-text">
  93. {{ isFilterPrice(item?.dannum_cost1) }}
  94. </span>
  95. </div>
  96. <div class="oa-flow-item__right-content-title flx-col flx-center">
  97. <div class="text-f-c text-disable">柜型</div>
  98. <span class="text-h5-b text-primary-text">
  99. {{ isFilterPrice(item?.cabinet_type) }}
  100. </span>
  101. </div>
  102. <div class="oa-flow-item__right-content-title flx-col flx-center">
  103. <div class="text-f-c text-disable">税率</div>
  104. <span class="text-h5-b text-primary-text">
  105. {{ isFilterPrice(item?.taxrate) }}
  106. </span>
  107. </div>
  108. <div class="oa-flow-item__right-content-title flx-col flx-center">
  109. <div class="text-f-c text-disable">佣金点数</div>
  110. <span class="text-h5-b text-primary-text">
  111. {{ isFilterPrice(item?.commission) }}
  112. </span>
  113. </div>
  114. <!-- </div> -->
  115. </section>
  116. </main>
  117. </div>
  118. </template>
  119. <script setup lang="tsx" name="LjToastOaFlowItem">
  120. import { ref, watch } from "vue";
  121. import { formatTime, formatAmount3 } from "@/utils/index";
  122. import { Calendar } from "@element-plus/icons-vue";
  123. import { isFilterPrice } from "@/utils/index";
  124. import { useGlobalStore } from "@/stores/modules/global";
  125. interface wigetProps {
  126. item: any;
  127. /**
  128. * @description 索引
  129. */
  130. index: number;
  131. /**
  132. * @argument 当前待审批
  133. */
  134. current?: any;
  135. nowtime?: string;
  136. }
  137. const globalStore = useGlobalStore();
  138. const isSuper = globalStore.isSuper;
  139. const props = withDefaults(defineProps<wigetProps>(), {
  140. // item: {},
  141. current: undefined
  142. });
  143. const isFilterTime = time => {
  144. return formatTime(time, "", true);
  145. };
  146. // const isFilterPrice = data => {
  147. // return formatAmount3({ val: data });
  148. // };
  149. </script>
  150. <style lang="scss" scoped>
  151. .oa-flow-item {
  152. // margin-top: $space-b1;
  153. padding-top: $space-b1;
  154. padding-bottom: $space-b1;
  155. padding-right: $space-b1;
  156. &:hover {
  157. cursor: pointer;
  158. background-color: $color-primary-000;
  159. border-radius: $br-sm;
  160. }
  161. &__left {
  162. position: relative;
  163. width: 0;
  164. text-align: right;
  165. padding-right: $space-b1;
  166. // line-height: 1;
  167. .icon {
  168. position: absolute;
  169. right: 0;
  170. top: 0;
  171. transform: translateX(50%);
  172. // .iconfont {
  173. // background-color: $color-gray-1;
  174. // }
  175. .undone {
  176. margin-top: $space-a1;
  177. display: block;
  178. border-radius: 50%;
  179. width: $space-b2;
  180. height: $space-b2;
  181. background-color: $color-gray-6;
  182. }
  183. }
  184. }
  185. &__right {
  186. padding-left: $space-b1;
  187. &-content {
  188. margin-left: $space-a1;
  189. // border-radius: $br-sm;
  190. // background-color: $color-gray-3;
  191. // padding: $space-a1;
  192. }
  193. .limittime {
  194. color: $color-dust-red-6;
  195. }
  196. }
  197. &.is-done {
  198. // color: $color-text-primary-text;
  199. color: $color-gray-8;
  200. .oa-flow-item__left {
  201. .icon {
  202. // color: $color-polar-green-6;
  203. // color: $color-polar-green-6;
  204. color: $color-gray-8;
  205. }
  206. }
  207. }
  208. &.no-done {
  209. color: $color-gray-6;
  210. .oa-flow-item__left {
  211. .icon {
  212. color: $color-gray-6;
  213. }
  214. }
  215. }
  216. &.is-current {
  217. background-color: $color-primary-000;
  218. border-radius: $br-md;
  219. .oa-flow-item__left {
  220. font-weight: bold;
  221. .icon {
  222. color: $color-primary-500;
  223. .iconfont {
  224. font-size: $space-b3;
  225. }
  226. }
  227. }
  228. }
  229. }
  230. </style>