approvalDialog.vue 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!-- 请示批复 -->
  2. <template>
  3. <van-popup v-model:show="visible">
  4. <van-form @submit="on_submit">
  5. <div class="van-doc-block__title">请示批复</div>
  6. <van-cell-group inset>
  7. <van-field
  8. required
  9. v-model="form.approval_content"
  10. placeholder="请填写批复内容"
  11. :rules="[{ required: true, message: '请填写批复内容' }]"
  12. rows="3"
  13. autosize
  14. type="textarea"
  15. maxlength="150"
  16. show-word-limit
  17. />
  18. </van-cell-group>
  19. <div style="margin: 3.0vmin;display: flex;
  20. flex-direction: row;
  21. justify-content: flex-end;">
  22. <div style="display: flex; flex-direction: row; justify-content: space-between;">
  23. <van-button @click="closeDialog(false)" style="margin-right:10px;">取 消</van-button>
  24. <van-button type="primary" native-type="submit">确 定</van-button>
  25. </div>
  26. </div>
  27. </van-form>
  28. </van-popup>
  29. </template>
  30. <script lang="ts" setup>
  31. import { addApproval } from '@/api/emergencyCommandMap/JointDuty';
  32. import { showSuccessToast } from 'vant';
  33. const proxy = getCurrentInstance()?.proxy;
  34. interface Form {
  35. feeback_id: string;
  36. approval_content: string;
  37. }
  38. interface Props {
  39. modelValue: boolean;
  40. data: Form;
  41. }
  42. const form = ref<Form>({
  43. feeback_id: "",
  44. approval_content: ""
  45. });
  46. const props = withDefaults(defineProps<Props>(), {
  47. modelValue: false
  48. });
  49. const emits = defineEmits(['update:modelValue']);
  50. watch(
  51. () => props.modelValue,
  52. () => {
  53. if (props.modelValue) {
  54. form.value = props.data;
  55. }
  56. visible.value = props.modelValue;
  57. }
  58. );
  59. const visible = ref(false);
  60. const on_submit = () => {
  61. console.log('on_submit');
  62. addApproval(form.value).then((res) => {
  63. showSuccessToast(res.msg);
  64. closeDialog(true)
  65. }).catch((err) => {
  66. });
  67. };
  68. const closeDialog = (t) => {
  69. emits('update:modelValue', t);
  70. };
  71. </script>
  72. <style lang="scss" scoped>
  73. .van-doc-block__title {
  74. color: var(--van-doc-text-color-4);
  75. margin: 0px;
  76. padding: 3vmin;
  77. font-size: 4.6vmin;
  78. font-weight: 600;
  79. line-height: 6.0vmin;
  80. }
  81. </style>