nav-bar.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view class="nav">
  3. <view class="navbar">
  4. <view class="status">{{props.userInfo.workStatus === '0'?"接单中":"暂停接单"}}</view>
  5. <view class="userinfo">
  6. <button type="primary" class="lef" @click="handleChange">{{props.userInfo.workStatus === '0'?"暂停接单":"开始接单"}}</button>
  7. <image class="mid" aspectFill src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/cat-1.png" />
  8. <view class="rig">
  9. <text class="name">{{props.userInfo.name?props.userInfo.name:"张三三"}}</text>
  10. <button size="mini" type="primary" @click="handleLogout" class="logout">退出</button>
  11. </view>
  12. </view>
  13. </view>
  14. </view>
  15. </template>
  16. <script>
  17. export default {
  18. name: 'NavBar'
  19. }
  20. </script>
  21. <script setup>
  22. import { onMounted,ref } from 'vue'
  23. import {updateWorkStatus, updateOnlineStatus } from "@/static/api.js"
  24. const props = defineProps({
  25. userInfo: {
  26. default: function() {
  27. return {}
  28. },
  29. type: Object
  30. }
  31. })
  32. const emit = defineEmits(['updateUser'])
  33. console.log("props.userInfo.workStatus", props.userInfo.workStatus)
  34. onMounted(() => {
  35. // userInfo.value = props.userInfo
  36. // console.log("props.userInfo.name", props.userInfo.name)
  37. })
  38. const handleChange =async()=>{
  39. console.log("hangdleChange props.userInfo.workStatus", props.userInfo.workStatus)
  40. const token = uni.getStorageSync('token')
  41. const userId = uni.getStorageSync('userId')
  42. if(props.userInfo.workStatus){
  43. const params = {
  44. token: token,
  45. data: {
  46. pharmacistUserId: userId,
  47. workStatus: props.userInfo.workStatus ==='1'?'0':'1'
  48. }
  49. }
  50. console.log('params.data.workStatus', params)
  51. const {data:res} = await updateWorkStatus(params)
  52. if (res.code === 200) {
  53. emit('updateUser', params.data.workStatus)
  54. }
  55. emit('updateUser', props.userInfo.workStatus)
  56. }
  57. }
  58. const handleLogout = async()=>{
  59. console.log("handleLogout", 555)
  60. const tokens = uni.getStorageSync('token')
  61. const userId = uni.getStorageSync('userId')
  62. const params = {
  63. token: tokens,
  64. data: {
  65. pharmacistUserId: userId,
  66. onlineStatus: 1
  67. }
  68. }
  69. const {data:res} = await updateOnlineStatus(params)
  70. uni.redirectTo({
  71. url:"/pages/login/login"
  72. })
  73. }
  74. </script>
  75. <style lang="scss">
  76. .nav{
  77. display:flex;
  78. justify-content:flex-end;
  79. align-items:flex-end;
  80. width: 1200px;
  81. background-color: #cfcfcf;
  82. padding-bottom: 20rpx;
  83. // position: fixed;
  84. .navbar{
  85. width: 440rpx;
  86. display: flex;
  87. align-items: center;
  88. justify-content: space-between;
  89. .status{
  90. font-size: 20rpx;
  91. }
  92. .userinfo{
  93. display: flex;
  94. justify-content: space-between;
  95. align-items: center;
  96. .lef{
  97. height: 60rpx;
  98. width: 60rpx;
  99. padding: 14rpx;
  100. margin-right: 30rpx;
  101. font-size: 15rpx;
  102. line-height: 15rpx;
  103. }
  104. .mid{
  105. height: 50rpx;
  106. width: 50rpx;
  107. margin-right: 30rpx;
  108. }
  109. .rig{
  110. margin-right: 10rpx;
  111. display: flex;
  112. flex-direction: column;
  113. align-items: center;
  114. .name{
  115. margin-bottom: 10rpx;
  116. width: 50rpx;
  117. text-align: center;
  118. }
  119. .logout{
  120. width: 50rpx;
  121. }
  122. }
  123. }
  124. }
  125. }
  126. </style>