edit.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. <template>
  2. <view class="mobile-item-container">
  3. <Navbar :title="userId ? '修改用户' : '新增用户'" bgColor="#fff" :h5Show="false"></Navbar>
  4. <u--form ref="form" :model="userInfo" :rules="rules" labelPosition="left" labelWidth="80">
  5. <u-form-item label="用户昵称" prop="nickName" borderBottom>
  6. <u-input v-model="userInfo.nickName" placeholder="请输入用户昵称" :maxlength="30" border="none"></u-input>
  7. </u-form-item>
  8. <u-form-item label="归属部门" prop="deptId" borderBottom @click="actionShow = true;">
  9. <u--input v-model="noticeTypeName" disabled disabledColor="#ffffff" placeholder="请选择类型" border="none"></u--input>
  10. <u-icon slot="right" name="arrow-right"></u-icon>
  11. </u-form-item>
  12. <u-form-item label="状态" prop="status" borderBottom>
  13. <u-radio-group v-model="userInfo.status">
  14. <u-radio shape="circle" label="正常" name="0" checked></u-radio>
  15. <u-radio shape="circle" label="关闭" name="1"></u-radio>
  16. </u-radio-group>
  17. </u-form-item>
  18. <u-form-item label="正文" prop="noticeContent">
  19. <u--textarea v-model="userInfo.noticeContent" placeholder="请输入标题" :count="true" :maxlength="600" confirmType="done"></u--textarea>
  20. </u-form-item>
  21. </u--form>
  22. <u-action-sheet title="部门选择" :show="actionShow" @close="actionShow = false">
  23. <qian-tree ref="tkitree" confirmColor="#4e8af7" />
  24. </u-action-sheet>
  25. <u-row :gutter="16" style="margin-top: 36px;">
  26. <u-col :span="6">
  27. <u-button v-if="userId" type="error" text="删除" @click="del"></u-button>
  28. <u-button v-else icon="arrow-left" text="返回" plain @click="goBack()"></u-button>
  29. </u-col>
  30. <u-col :span="6">
  31. <u-button type="primary" text="提交" @click="submit"></u-button>
  32. </u-col>
  33. </u-row>
  34. </view>
  35. </template>
  36. <script>
  37. import * as UserManageApi from '@/api/work/userManage'
  38. import Navbar from '@/components/navbar/Navbar'
  39. import qianTree from "@/components/qian-tree/qian-tree.vue"
  40. export default {
  41. components: {
  42. Navbar,
  43. qianTree
  44. },
  45. data () {
  46. return {
  47. userId: undefined,
  48. userInfo: {
  49. noticeTitle: '',
  50. status: '0',
  51. noticeContent: ''
  52. },
  53. actionShow: false,
  54. actions: [{
  55. name: '通知',
  56. value: '1'
  57. }, {
  58. name: '公告',
  59. value: '2'
  60. }],
  61. actionTitle: '',
  62. noticeTypeName: null,
  63. rules: {
  64. noticeTitle: [ { required: true, message: '请输入公告标题', trigger: ['blur', 'change'] } ],
  65. noticeType: [ { required: true, message: '请选择公告类型', trigger: ['blur', 'change'] } ],
  66. status: [ { required: true, message: '请选择公告状态', trigger: ['blur', 'change'] } ],
  67. noticeContent: [ { required: true, message: '请输入公告正文', trigger: ['blur', 'change'] } ],
  68. }
  69. }
  70. },
  71. onLoad (params) {
  72. this.userId = params.id
  73. this.loadData()
  74. },
  75. methods: {
  76. loadData () {
  77. if (this.userId) {
  78. const app = this
  79. UserManageApi.userById(this.userId).then(res => {
  80. app.userInfo = res.data
  81. })
  82. }
  83. },
  84. del () {
  85. NoticeApi.noticeDelete(this.userId).then(res => {
  86. uni.showToast({ title: '保存成功!' })
  87. })
  88. },
  89. submit () {
  90. this.$refs.noticeForm.validate().then(res => {
  91. if (this.userId) {
  92. NoticeApi.noticeModify(this.notice).then(res => {
  93. uni.showToast({ title: '提交成功!' })
  94. })
  95. } else {
  96. NoticeApi.noticeAdd(this.notice).then(res => {
  97. uni.showToast({ title: '提交成功!' })
  98. })
  99. }
  100. });
  101. },
  102. actionSelect (item) {
  103. this.noticeTypeName = item.name;
  104. this.userInfo.noticeType = item.value;
  105. this.$refs.noticeForm.validateField('noticeType');
  106. },
  107. goBack () {
  108. uni.navigateBack({ delta: 1});
  109. }
  110. }
  111. }
  112. </script>