be2f9b07c3a2dce6a9763f56e4a0afd99444cef0.svn-base 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <template>
  2. <div>
  3. <a-select v-if="query" style="width: 100%" @change="handleSelectChange">
  4. <a-select-option v-for="(item, index) in queryOption" :key="index" :value="item.value">
  5. {{ item.text }}
  6. </a-select-option>
  7. </a-select>
  8. <a-switch v-else v-model="checkStatus" :disabled="disabled" @change="handleChange"/>
  9. </div>
  10. </template>
  11. <script>
  12. export default {
  13. name: 'JSwitch',
  14. props: {
  15. value:{
  16. type: String | Number,
  17. required: false
  18. },
  19. disabled:{
  20. type: Boolean,
  21. required: false,
  22. default: false
  23. },
  24. options:{
  25. type:Array,
  26. required:false,
  27. default:()=>['Y','N']
  28. },
  29. query:{
  30. type: Boolean,
  31. required: false,
  32. default: false
  33. }
  34. },
  35. data () {
  36. return {
  37. checkStatus: false
  38. }
  39. },
  40. watch: {
  41. value:{
  42. immediate: true,
  43. handler(val){
  44. if(!this.query){
  45. if(!val){
  46. this.checkStatus = false
  47. this.$emit('change', this.options[1]);
  48. }else{
  49. if(this.options[0]==val){
  50. this.checkStatus = true
  51. }else{
  52. this.checkStatus = false
  53. }
  54. }
  55. }
  56. }
  57. }
  58. },
  59. computed:{
  60. queryOption(){
  61. let arr = []
  62. arr.push({value:this.options[0],text:'是'})
  63. arr.push({value:this.options[1],text:'否'})
  64. return arr;
  65. }
  66. },
  67. methods: {
  68. handleChange(checked){
  69. let flag = checked===false?this.options[1]:this.options[0];
  70. this.$emit('change', flag);
  71. },
  72. handleSelectChange(value){
  73. this.$emit('change', value);
  74. }
  75. },
  76. model: {
  77. prop: 'value',
  78. event: 'change'
  79. }
  80. }
  81. </script>