plInvoiceModal.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. <template>
  2. <a-modal
  3. v-model="opened"
  4. :title="title"
  5. centered
  6. :maskClosable="false"
  7. :footer="null"
  8. @cancel="cancel"
  9. width="600px">
  10. <a-spin :spinning="spinning" tip="Loading...">
  11. <a-form-model
  12. id="chooseCustom-form"
  13. ref="ruleForm"
  14. :model="form"
  15. :label-col="formItemLayout.labelCol"
  16. :wrapper-col="formItemLayout.wrapperCol">
  17. <a-form-model-item label="开票日期:" prop="invoiceDate">
  18. <a-date-picker
  19. id="noticeEdit-releaseDate"
  20. format="YYYY-MM-DD"
  21. placeholder="请选择开票日期"
  22. v-model="form.invoiceDate"/>
  23. <div style="color:#999">如果没有开票,则不填写即可</div>
  24. </a-form-model-item>
  25. <a-form-model-item label="备注:">
  26. <a-textarea id="noticeEdit-remarks" rows="4" v-model="form.remarks" :maxlenght="100" placeholder="请输入备注(最多100字符)"></a-textarea>
  27. </a-form-model-item>
  28. <a-form-model-item :wrapper-col="{ span: 12, offset: 6 }" style="text-align: center;margin-top: 50px;">
  29. <a-button @click="cancel" style="margin-right: 15px" id="chooseCustom-btn-back">取消</a-button>
  30. <a-button type="primary" :loading="confirmLoading" @click="handleSubmit" id="chooseCustom-btn-submit">确定
  31. </a-button>
  32. </a-form-model-item>
  33. </a-form-model>
  34. </a-spin>
  35. </a-modal>
  36. </template>
  37. <script>
  38. import moment from 'moment'
  39. import {
  40. updateDetailInvoiceDate
  41. } from '@/api/financeBook.js'
  42. export default {
  43. name: 'InvoiceModal',
  44. props: {
  45. show: [Boolean],
  46. },
  47. data () {
  48. return {
  49. opened: this.show,
  50. spinning: false,
  51. title: '批量设置开票',
  52. confirmLoading: false,
  53. formItemLayout: {
  54. labelCol: {
  55. span: 6
  56. },
  57. wrapperCol: {
  58. span: 14
  59. }
  60. },
  61. form: {
  62. invoiceDate: undefined,
  63. remarks: ''
  64. }
  65. }
  66. },
  67. methods: {
  68. disabledDate (current) {
  69. return current && current < moment().startOf('day')
  70. },
  71. disabledDateTime (date) {
  72. if (!date) {
  73. date = moment()
  74. }
  75. return {
  76. disabledHours: () => this.getDisabledHours(date.format('YYYY-MM-DD HH:mm:ss')),
  77. disabledMinutes: () => this.getDisabledMinutes(date.format('YYYY-MM-DD HH:mm:ss')),
  78. disabledSeconds: () => this.getDisabledSeconds(date.format('YYYY-MM-DD HH:mm:ss'))
  79. }
  80. },
  81. // 禁用时间范围 时
  82. getDisabledHours (nowTime) {
  83. const todayDate = moment().format('YYYY-MM-DD HH:mm:ss')
  84. const time = nowTime.split(' ')
  85. const times = todayDate.split(' ')
  86. const timeArrs = times[1].split(':')
  87. const hours = []
  88. if (todayDate.split(' ')[0] == time[0]) {
  89. for (var i = 0; i < parseInt(timeArrs[0]); i++) {
  90. hours.push(i)
  91. }
  92. }
  93. return hours
  94. },
  95. // 禁用时间范围 分
  96. getDisabledMinutes (nowTime) {
  97. const todayDate = moment().format('YYYY-MM-DD HH:mm:ss')
  98. const time = nowTime.split(' ')
  99. const times = todayDate.split(' ')
  100. const timeArr = time[1].split(':')
  101. const timeArrs = times[1].split(':')
  102. const minutes = []
  103. if (todayDate.split(' ')[0] == time[0] && timeArrs[0] == timeArr[0]) {
  104. for (var i = 0; i < parseInt(timeArrs[1]); i++) {
  105. minutes.push(i)
  106. }
  107. }
  108. return minutes
  109. },
  110. // 禁用时间范围 秒
  111. getDisabledSeconds (nowTime) {
  112. const todayDate = moment().format('YYYY-MM-DD HH:mm:ss')
  113. const time = nowTime.split(' ')
  114. const times = todayDate.split(' ')
  115. const timeArr = time[1].split(':')
  116. const timeArrs = times[1].split(':')
  117. const second = []
  118. if (todayDate.split(' ')[0] == time[0] && timeArrs[0] == timeArr[0] && timeArrs[1] == timeArr[1]) {
  119. for (var i = 0; i <= parseInt(timeArrs[2]); i++) {
  120. second.push(i)
  121. }
  122. }
  123. return second
  124. },
  125. // 保存
  126. handleSubmit (e) {
  127. const _this = this
  128. const invoiceDate = moment(this.form.invoiceDate).format('YYYY-MM-DD')
  129. const ajax_form = {
  130. invoiceDate: this.form.invoiceDate ? invoiceDate : '',
  131. remarks: this.form.remarks
  132. }
  133. this.$emit('ok', ajax_form)
  134. this.$emit('cancel')
  135. },
  136. cancel () {
  137. this.opened = false
  138. this.$emit('cancel')
  139. this.form.invoiceDate = undefined
  140. this.form.remarks = ''
  141. this.$refs.ruleForm.resetFields()
  142. }
  143. },
  144. watch: {
  145. show (newValue, oldValue) {
  146. this.opened = newValue
  147. if (!newValue) {
  148. this.cancel()
  149. }
  150. }
  151. }
  152. }
  153. </script>
  154. <style lang="less" scoped>
  155. .ant-form-item{
  156. margin-bottom:0 !important;
  157. }
  158. </style>