页面修改

src/components/assetsman/HotelList.vue

@@ -14,19 +14,35 @@
         新たに</span>
     </div>
     <div class="padContent">
-     <ul v-show="morequery" class="queryul">
+      <ul v-show="morequery" class="queryul">
         <li>
           <el-input class="w200" size="small" v-model="msg.SHotelName" placeholder="ホテル名"></el-input>
         </li>
         <li>
-          <el-select size="small" v-model="msg.Status" placeholder="ホテル状態"  >
-            
+          <el-select size="small" v-model="msg.SCountryId" placeholder="国家" @change="getProvinceList(msg.SCountryId,1)">
+            <el-option label="すべて" :value='0'></el-option>
+            <el-option v-for="item in countryList" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
           </el-select>
         </li>
         <li>
-          <el-date-picker v-model="dateList" type="daterange" range-separator="至" value-format="yyyy-MM-dd"
-            start-placeholder="开始日期" end-placeholder="结束日期">
-          </el-date-picker>
+          <el-select size="small" v-model="msg.SProvinceId" placeholder="省"
+            @change="getProvinceList(msg.SProvinceId,2)">
+            <el-option label="すべて" :value='0'></el-option>
+            <el-option v-for="item in provinceList" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
+          </el-select>
+        </li>
+        <li>
+          <el-select size="small" v-model="msg.SCityId" placeholder="市">
+            <el-option label="すべて" :value='0'></el-option>
+            <el-option v-for="item in cityList" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
+          </el-select>
+        </li>
+        <li>
+          <el-select size="small" v-model="msg.Status" placeholder="ホテル状態">
+            <el-option label="すべて" :value='-1'></el-option>
+            <el-option label="正常" :value='0'></el-option>
+            <el-option label="削除" :value='1'></el-option>
+          </el-select>
         </li>
       </ul>
       <vxe-table stripe style="margin-top:15px" :loading="loading" :data="dataList">
@@ -42,17 +58,17 @@
         <vxe-table-column field="SHotelInfo" title="ホテル案内"></vxe-table-column>
         <vxe-table-column field="UpdateByName" title="修正者"></vxe-table-column>
         <vxe-table-column field="Name" title="修正時間">
-            <template v-slot="{row}">
-                <span>{{getDate(row.UpdateTime)}}</span>
-            </template>
+          <template v-slot="{row}">
+            <span>{{getDate(row.UpdateTime)}}</span>
+          </template>
         </vxe-table-column>
         <vxe-table-column field="StatusStr" title="ホテル状態"></vxe-table-column>
         <vxe-table-column field="address" title="操作">
-            <template  v-slot="{ row }">
-                <el-tooltip class="item" effect="dark" content="修正" placement="top" >
-                    <img @click="Edit(row)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="" />
-                </el-tooltip>
-            </template>
+          <template v-slot="{ row }">
+            <el-tooltip class="item" effect="dark" content="修正" placement="top">
+              <img @click="Edit(row)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="" />
+            </el-tooltip>
+          </template>
         </vxe-table-column>
       </vxe-table>
       <el-pagination @current-change="currentChange" background :page-size="msg.pageSize" layout="prev, pager, next"
@@ -71,17 +87,24 @@
         currentPage: 1,
         dataList: [],
         loading: false,
-        morequery:false,
+        morequery: false,
         total: 0,
         msg: {
           pageIndex: 1,
           pageSize: 15,
-          SHotelName:"",//酒店名称
-          Status:-1,//酒店状态
+          SHotelName: "", //酒店名称
+          Status: -1, //酒店状态
+          SCountryId: 0, //国家编号
+          SProvinceId: 0, //省份编号
+          SCityId: 0, //城市编号
         },
+        countryList: [], //国家列表
+        provinceList: [], //省份列表
+        cityList: [], //城市列表
       };
     },
     mounted() {
+      this.getCountryList();
       this.getList();
     },
     methods: {
@@ -91,20 +114,58 @@
       },
       getList() {
         this.apipost("scm_get_GetSCMHotelPageListService", this.msg,
-        res => {
+          res => {
             if (res.data.resultCode == 1) {
-                this.dataList = res.data.data.pageData;
-                this.total = res.data.data.count;
-                console.log("this.dataList", this.dataList)
+              this.dataList = res.data.data.pageData;
+              this.total = res.data.data.count;
+              console.log("this.dataList", this.dataList)
             } else {
-                this.Error(res.data.message);
+              this.Error(res.data.message);
             }
-        });
+          });
+      },
+      getProvinceList(ID, type) {
+        //根据省份获取城市
+        let msg = {
+          Id: ID
+        };
+        if (type == 1) {
+          this.msg.SProvinceId = 0;
+          this.msg.SCityId = 0;
+        } else if (type == 2) {
+          this.msg.SCityId = 0;
+        }
+        if (this.msg.SCountryId !== 0) {
+          this.apipost(
+            "dict_post_Destination_GetChildList",
+            msg,
+            res => {
+              if (type == 1) {
+                this.provinceList = res.data.data;
+              } else if (type == 2) {
+                this.cityList = res.data.data;
+              }
+            },
+            err => {}
+          );
+        }
       },
-      addHotel(){
-        this.$router.push({path: 'HotelInfo'})
+      //获取国家
+      getCountryList() {
+        this.apipost(
+          "dict_post_Destination_GetCountry", {},
+          res => {
+            this.countryList = res.data.data;
+          },
+          err => {}
+        );
+      },
+      addHotel() {
+        this.$router.push({
+          path: 'HotelInfo'
+        })
       },
-      getDate(date){
+      getDate(date) {
         return moment(date).format("YYYY-MM-DD HH:mm:ss");
       },
       //修改