Update stockTypeForm.vue

src/views/settings/components/roomModules/stockTypeForm.vue

@@ -23,12 +23,20 @@
                 </a-form-model-item>
 
                 <a-form-model-item label="应用范围" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="lunchNum">
-                    <a-checkbox :indeterminate="indeterminate" :checked="checkAll" @change="onCheckAllChange">
-                        Check all
+                    <a-checkbox-group v-model="model.checkedList" :options="plainOptions" @change="onChange" />
+                </a-form-model-item>
+                <a-form-model-item v-show="model.checkedList.includes('2')" label="POS类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="posType">
+                    <a-checkbox :indeterminate="indeterminatePos" :checked="posCheckAll" @change="onCheckAllChangePos">
+                        全选
                     </a-checkbox>
-                    <a-checkbox-group v-model="checkedList" :options="plainOptions" @change="onChange" />
+                    <a-checkbox-group v-model="model.postTypes" :options="posOptions" @change="onChangePos" />
+                </a-form-model-item>
+                <a-form-model-item v-show="model.checkedList.includes('3')" label="娱乐类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="funType">
+                    <a-checkbox :indeterminate="indeterminateFun" :checked="funCheckAll" @change="onCheckAllChangeFun">
+                        全选
+                    </a-checkbox>
+                    <a-checkbox-group v-model="model.funTypes" :options="funOptions" @change="onChangeFun" />
                 </a-form-model-item>
-
                 <a-form-model-item label="排序" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dinnerNum">
                     <a-input-number style="width:50%;" v-model="model.dinnerNum" :min="0"  placeholder="请输入排序"/>
                 </a-form-model-item>
@@ -36,6 +44,7 @@
 
         </j-form-container>
     </a-spin>
+
 </template>
 <script>
 import { getRoomPlans, getSelectList } from "@/api/api";
@@ -47,6 +56,8 @@ export default {
     name: "BusMarketMemberForm",
     props: {
         disabled: {
+
+            
             type: Boolean,
             default: false,
             required: false,
@@ -54,16 +65,37 @@ export default {
     },
     data() {
         return {
+            indeterminatePos: true,
+            indeterminateFun:true,
+            posCheckAll: false,
+            funCheckAll:false,
+            plainOptions:[
+                { label: '客房', value: '1' },
+                { label: 'POS', value: '2' },
+                { label: '娱乐', value: '3' },
+            ],
+            posOptions:[
+               { label: '茶室', value: '1' },
+                { label: '餐厅', value: '2' },
+                { label: '超市', value: '3' },
+            ],
+            funOptions:[
+               { label: '茶室', value: '1' },
+                { label: '餐厅', value: '2' },
+                { label: '超市', value: '3' },
+            ],
             selectData:[],
             model: {
                 id: "",
                 hotelId: 0,
                 name: null,
                 marketPrice: null,
-                canLivePersonNum: "0",
+                canLivePersonNum: true,
                 breakfastNum: 0,
                 lunchNum: 0,
-                dinnerNum: 0
+                checkedList: ["1"],
+                postTypes:[],
+                funTypes:[]
             },
             labelCol: {
                 xs: { span: 24 },
@@ -106,6 +138,45 @@ export default {
         this.modelDefault = JSON.parse(JSON.stringify(this.model));
     },
     methods: {
+        onChangePos(checkedList){
+            this.indeterminatePos = !!checkedList.length && checkedList.length < this.posOptions.length;
+            this.posCheckAll = checkedList.length === this.posOptions.length;
+        },
+        onChangeFun(checkedList){
+            this.indeterminateFun = !!checkedList.length && checkedList.length < this.funOptions.length;
+            this.funCheckAll = checkedList.length === this.funOptions.length;
+        },
+        onChange(checkedList) {
+           if(checkedList.length == 0){
+              this.$message.error("应用范围必须选择一项!");
+              this.model.checkedList.push("1")
+           }
+         
+        },
+        onCheckAllChangePos(e) {   
+            this.model.postTypes = e.target.checked ? this.posOptions.map(v => v.value) : []
+            this.indeterminatePos = false
+            this.posCheckAll = e.target.checked
+            // Object.assign(this, {
+            //     model:{
+            //         postTypes: e.target.checked ? this.posOptions.map(v => v.value) : []
+            //     },
+            //     indeterminatePos: false,
+            //     ,
+            // });
+        },
+        onCheckAllChangeFun(e) {   
+            this.model.funTypes = e.target.checked ? this.funOptions.map(v => v.value) : []
+            this.indeterminateFun = false
+            this.funCheckAll = e.target.checked
+            // Object.assign(this, {
+            //     model:{
+            //         funTypes: e.target.checked ? this.funOptions.map(v => v.value) : []
+            //     },
+            //     indeterminateFun: false,
+            //     funCheckAll: e.target.checked,
+            // });
+        },
         initData() {
             getRoomPlans(this.model.hotelId, null).then((res) => {
                 if (res.success) {