d7583c0a0210aa356c83d75e5a74876856b7cebc.svn-base 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <!-- -->
  2. <template>
  3. <div>
  4. <el-dialog
  5. title="添加签到基准"
  6. :before-close="closeDialog"
  7. :visible.sync="dialogFormVisible"
  8. width='30%'>
  9. <el-container>
  10. <el-main>
  11. <el-form ref="form" :model="sizeForm" label-width="130px" size="mini" >
  12. <el-form-item label="类型">
  13. <el-radio v-model="sizeForm.type" label="1">签到</el-radio>
  14. <el-radio v-model="sizeForm.type" label="2" :disabled="exitAbleContrl">签退</el-radio>
  15. </el-form-item>
  16. <el-form-item label="基准开始时间">
  17. <el-date-picker
  18. value-format="yyyy-MM-dd HH:mm"
  19. format="yyyy-MM-dd HH:mm"
  20. type="datetime"
  21. placeholder="选择日期"
  22. v-model="sizeForm.stTm"
  23. style="width: 100%;"></el-date-picker>
  24. <!-- <el-time-picker
  25. value-format="HH:mm"
  26. format="HH:mm"
  27. v-model="sizeForm.stTm"
  28. placeholder="选择时间"
  29. style="width: 100%;">
  30. </el-time-picker> -->
  31. </el-form-item>
  32. <el-form-item label="基准结束时间">
  33. <el-date-picker
  34. value-format="yyyy-MM-dd HH:mm"
  35. format="yyyy-MM-dd HH:mm"
  36. type="datetime"
  37. placeholder="选择日期"
  38. v-model="sizeForm.enTm"
  39. style="width: 100%;"></el-date-picker>
  40. <!-- <el-time-picker
  41. value-format="HH:mm"
  42. format="HH:mm"
  43. v-model="sizeForm.enTm"
  44. placeholder="选择时间"
  45. style="width: 100%;">
  46. </el-time-picker> -->
  47. </el-form-item>
  48. </el-form>
  49. </el-main>
  50. <el-footer style="height: 100%;text-align: right;">
  51. <el-button type="primary" @click="onSubmit">立即创建</el-button>
  52. <el-button @click="cancel">取消</el-button>
  53. </el-footer>
  54. </el-container>
  55. </el-dialog>
  56. </div>
  57. </template>
  58. <script>
  59. //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
  60. //例如:import 《组件名称》 from '《组件路径》';
  61. import { addMeetingSginData } from "../../api/meetingAPI.js";
  62. export default {
  63. //import引入的组件需要注入到对象中才能使用
  64. components: {},
  65. props: ['editFormDataSgin','meetingInfoRow'],
  66. data() {
  67. //这里存放数据
  68. return {
  69. dialogFormVisible:true,
  70. sizeForm: {
  71. type:"",
  72. stTm:"",
  73. enTm:"",
  74. }
  75. };
  76. },
  77. //监听属性 类似于data概念
  78. computed: {
  79. exitAbleContrl(){
  80. if(this.meetingInfoRow.isOut == '1'){
  81. return false;
  82. }else{
  83. this.sizeForm.type = '1';
  84. return true;
  85. }
  86. }
  87. },
  88. //监控data中的数据变化
  89. watch: {},
  90. //方法集合
  91. methods: {
  92. closeDialog() {
  93. let _self = this;
  94. this.$confirm("确认退出吗?", "提示", {
  95. confirmButtonText: "确定",
  96. cancelButtonText: "取消",
  97. type: "warning"
  98. }).then(() => {
  99. _self.$emit("cancelHandler");
  100. })
  101. .catch(() => {});
  102. },
  103. //提交
  104. onSubmit(){
  105. var _self = this;
  106. let obj = {
  107. "meetId" : _self.meetingInfoRow.id,
  108. // "stTm" : _self.meetingInfoRow.stTm.split(" ")[0] + " " + _self.sizeForm.stTm,
  109. // "enTm" : _self.meetingInfoRow.enTm.split(" ")[0] + " " + _self.sizeForm.enTm,
  110. };
  111. Object.assign(obj, _self.sizeForm);
  112. addMeetingSginData(obj).then(response => {
  113. if(response.success == true){
  114. this.$emit('addSuccessStatus',response)
  115. }
  116. });
  117. },
  118. cancel(){
  119. this.$emit("cancelHandler");
  120. }
  121. },
  122. //生命周期 - 创建完成(可以访问当前this实例)
  123. created() {
  124. },
  125. //生命周期 - 挂载完成(可以访问DOM元素)
  126. mounted() {
  127. this.sizeForm = this.editFormDataSgin;
  128. if(this.exitAbleContrl == true){
  129. this.sizeForm.type = '1'
  130. }
  131. },
  132. beforeCreate() {}, //生命周期 - 创建之前
  133. beforeMount() {}, //生命周期 - 挂载之前
  134. beforeUpdate() {}, //生命周期 - 更新之前
  135. updated() {}, //生命周期 - 更新之后
  136. beforeDestroy() {}, //生命周期 - 销毁之前
  137. destroyed() {}, //生命周期 - 销毁完成
  138. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  139. }
  140. </script>
  141. <style scoped>
  142. </style>