城市管理新增经纬度

src/components/platformModule/cityManagement.vue

 <style>
-.cityManagement .w150 .el-input {
+  .cityManagement .w150 .el-input {
     width: 150px;
-}
-.cityManagement .btmAddStore {
+  }
+
+  .cityManagement .btmAddStore {
     border-top: 1px solid #d1d1d1;
     width: 100%;
     display: none;
@@ -11,33 +12,41 @@
     position: fixed;
     background: #f9f9f9;
     bottom: 0;
-}
-.cityManagement .isShow {
+  }
+
+  .cityManagement .isShow {
     display: block !important;
-}
-.cityManagement .changeMsg {
+  }
+
+  .cityManagement .changeMsg {
     width: 80%;
-}
-.cityManagement .changeMsg li {
+  }
+
+  .cityManagement .changeMsg li {
     float: left;
-}
-.cityManagement .btmTitle {
+  }
+
+  .cityManagement .btmTitle {
     padding: 0 10px;
     margin: 20px 0 20px 40px;
     border-left: 3px solid #e95252;
     font-size: 14px;
     color: #000000;
-}
-.cityManagement .cityBtnList {
+  }
+
+  .cityManagement .cityBtnList {
     margin: 5px 0 20px 40px;
-}
-.cityManagement .query-box li {
+  }
+
+  .cityManagement .query-box li {
     margin: 20px 30px 20px 0;
-}
-.cityManagement ._addUpload_box>div:hover{
+  }
+
+  .cityManagement ._addUpload_box>div:hover {
     background-color: #f5f5f5;
   }
-    .cityManagement .el-upload-dragger{
+
+  .cityManagement .el-upload-dragger {
     font-size: 28px;
     color: #8c939d;
     width: 126px;
@@ -45,35 +54,40 @@
     line-height: 41px;
     text-align: center;
   }
-    .cityManagement ._show_img_box{
+
+  .cityManagement ._show_img_box {
     position: fixed;
-      background: rgba(0,0,0,.6); 
+    background: rgba(0, 0, 0, .6);
     left: 0;
-      top:0;  
+    top: 0;
     width: 100%;
     height: 100%;
     z-index: 9999;
     text-align: center;
   }
-    .cityManagement ._addUpload_box{
+
+  .cityManagement ._addUpload_box {
     display: block;
   }
-    .cityManagement ._addUpload_box img{
+
+  .cityManagement ._addUpload_box img {
     width: 100%;
-        height:100%;
+    height: 100%;
   }
-    .cityManagement ._addUpload_box>div{
+
+  .cityManagement ._addUpload_box>div {
     float: left;
-        width:138px;
-        height:92px;
-        border:1px dashed rgba(210,210,210,1);
-        border-radius:2px;
+    width: 138px;
+    height: 92px;
+    border: 1px dashed rgba(210, 210, 210, 1);
+    border-radius: 2px;
     cursor: pointer;
     margin-bottom: 10px;
     padding: 5px;
     margin-right: 10px;
     position: relative;
   }
+
   .cityManagement ._addUpload_box .icon-guanbi1 {
     font-size: 12px;
     color: white;
@@ -89,6 +103,7 @@
     text-align: center;
     line-height: 20px;
   }
+
 </style>
 <template>
   <div class="flexOne cityManagement">
@@ -114,8 +129,8 @@
         </li>
         <li>
           <span>省</span>
-          <el-select v-model="msg.QProvince" clearable class="w150" filterable @change="getProvinceList(msg.QProvince,2)"
-            :placeholder="$t('hotel.hotel_province')">
+          <el-select v-model="msg.QProvince" clearable class="w150" filterable
+            @change="getProvinceList(msg.QProvince,2)" :placeholder="$t('hotel.hotel_province')">
             <el-option :label="$t('pub.unlimitedSel')" value='0'></el-option>
             <el-option v-for='item in provinceList' :key="item.ID" :label="item.Name" :value="item.ID">
             </el-option>
@@ -144,7 +159,8 @@
         </li>
         <li>
           <button class="normalBtn" type="button" @click="addCityInfo">{{$t('pub.addBtn')}}</button>
-          <button class="hollowFixedBtn" type="button" @click="resetPageIndex(),initData()">{{$t('pub.searchBtn')}}</button>
+          <button class="hollowFixedBtn" type="button"
+            @click="resetPageIndex(),initData()">{{$t('pub.searchBtn')}}</button>
         </li>
       </ul>
     </div>
@@ -157,6 +173,8 @@
           <th>所属国家</th>
           <th>所属省份</th>
           <th>所属市</th>
+          <th>经度</th>
+          <th>纬度</th>
           <th>操作</th>
         </tr>
         <tr v-for="item in tabelDate" :key="item.subCode">
@@ -166,20 +184,23 @@
           <td>{{item.CountryName}}</td>
           <td>{{item.ProvinceName}}</td>
           <td>{{item.CityName}}</td>
+          <td>{{item.Lng}}</td>
+          <td>{{item.Lat}}</td>
           <td>
             <el-tooltip class="item" effect="dark" content="修改" placement="top-start">
               <el-button type="primary" @click="isShow=true,titleInfo='修改城市',updateCity(item.ID)" icon="el-icon-edit"
                 circle></el-button>
             </el-tooltip>
             <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
-              <el-button type="danger" icon="el-icon-delete" @click="delArea(item.ID,item.CodeLevel)" circle></el-button>
+              <el-button type="danger" icon="el-icon-delete" @click="delArea(item.ID,item.CodeLevel)" circle>
+              </el-button>
             </el-tooltip>
           </td>
         </tr>
       </table>
     </div>
-    <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage" layout="total,prev, pager, next, jumper"
-      :page-size="this.msg.pageSize" :total="total">
+    <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
+      layout="total,prev, pager, next, jumper" :page-size="this.msg.pageSize" :total="total">
     </el-pagination>
     <div class="btmAddStore" :class="{'isShow':isShow}">
       <div class="btmTitle">{{titleInfo}}</div>
@@ -191,7 +212,7 @@
             </el-form-item>
           </li>
           <li>
-            <el-form-item label="英文名称" prop="EnName">
+            <el-form-item label="英文名称">
               <el-input v-model="addMsg.EnName" class="w150" maxlength="20"></el-input>
             </el-form-item>
           </li>
@@ -216,8 +237,8 @@
           </li>
           <li v-if="disCountry">
             <el-form-item label="所属国家" prop="CountryID">
-              <el-select v-model="addMsg.CountryID" clearable class="w150" filterable @change="getProvinceList(addMsg.CountryID,1)"
-                placeholder="请选择">
+              <el-select v-model="addMsg.CountryID" clearable class="w150" filterable
+                @change="getProvinceList(addMsg.CountryID,1)" placeholder="请选择">
                 <el-option :label="$t('pub.unlimitedSel')" value='0'></el-option>
                 <el-option v-for='item in countryListOther' :key="item.ID" :label="item.Name" :value="item.ID">
                 </el-option>
@@ -226,8 +247,8 @@
           </li>
           <li v-if="disProvince">
             <el-form-item label="所属省份" prop="ProvinceID">
-              <el-select v-model="addMsg.ProvinceID" clearable class="w150" filterable @change="getProvinceList(addMsg.ProvinceID,2)"
-                placeholder="请选择">
+              <el-select v-model="addMsg.ProvinceID" clearable class="w150" filterable
+                @change="getProvinceList(addMsg.ProvinceID,2)" placeholder="请选择">
                 <el-option :label="$t('pub.unlimitedSel')" value='0'></el-option>
                 <el-option v-for='item in provinceList' :key="item.ID" :label="item.Name" :value="item.ID">
                 </el-option>
@@ -244,24 +265,32 @@
             </el-form-item>
           </li>
           <li>
-            <el-form-item label="三码" ><!--prop="ThreeCode"-->
+            <el-form-item label="三码">
+              <!--prop="ThreeCode"-->
               <el-input v-model="addMsg.ThreeCode" class="w150" maxlength="3"></el-input>
             </el-form-item>
           </li>
+          <li>
+            <el-form-item label="经度">
+              <el-input v-model="addMsg.Lng" class="w150"></el-input>
+            </el-form-item>
+          </li>
+          <li>
+            <el-form-item label="纬度">
+              <el-input v-model="addMsg.Lat" class="w150"></el-input>
+            </el-form-item>
+          </li>
           <li>
             <el-form-item label="图片">
-                <div class="_addUpload_box clearfix" >
+              <div class="_addUpload_box clearfix">
                 <div v-if="addMsg.Images && addMsg.Images!=''">
                   <div style="width:100%;height:100%;overflow: hidden;">
-                        <img :src="addMsg.Images"/>
+                    <img :src="addMsg.Images" />
                   </div>
                   <span class="iconfont icon-guanbi1" @click="deleteUploadFile()"></span>
                 </div>
                 <div v-else class="_pic_upload">
-                      <el-upload
-                      drag
-                      :http-request="uploadFileBtn"
-                      :multiple="false"  :show-file-list="false"  action="">
+                  <el-upload drag :http-request="uploadFileBtn" :multiple="false" :show-file-list="false" action="">
                     <i class="el-icon-plus avatar-uploader-icon"></i>
                     <div class="el-upload__text">{{$t("active.ld_djscwj")}}</div>
                   </el-upload>
@@ -281,7 +310,7 @@
   </div>
 </template>
 <script>
-export default {
+  export default {
     data() {
       return {
         total: 0,
@@ -322,18 +351,17 @@ export default {
           Area: "",
           CountryID: "",
           ProvinceID: "",
-        CityID: ""
+          CityID: "",
+          Lng: "", //经度
+          Lat: "", //纬度
         },
         rules: {
-        Name: [
-          {
+          Name: [{
             required: true,
             message: "请输入中文名称",
             trigger: "change"
-          }
-        ],
-        EnName: [
-          {
+          }],
+          EnName: [{
               required: true,
               message: "请输入英文名称",
               trigger: "change"
@@ -343,72 +371,60 @@ export default {
               message: "请输入英文"
             }
           ],
-        CodeLevel: [
-          {
+          CodeLevel: [{
             required: true,
             message: "请选择行政级别",
             trigger: "change"
-          }
-        ],
-        Area: [
-          {
+          }],
+          Area: [{
             required: true,
             message: "请选择洲",
             trigger: "change"
-          }
-        ],
-        CountryID: [
-          {
+          }],
+          CountryID: [{
             required: true,
             message: "请选择国家",
             trigger: "change"
-          }
-        ],
-        ProvinceID: [
-          {
+          }],
+          ProvinceID: [{
             required: true,
             message: "请选择省",
             trigger: "change"
-          }
-        ],
-        CityID: [
-          {
+          }],
+          CityID: [{
             required: true,
             message: "请选择市",
             trigger: "change"
-          }
-        ],
-        ThreeCode: [
-          {
+          }],
+          ThreeCode: [{
             required: true,
             message: "请输入三码",
             trigger: "change"
-          }
-        ]
+          }]
         }
       };
     },
     methods: {
-    deleteUploadFile(){  // 删除上传文件
-        this.addMsg.Images='';
+      deleteUploadFile() { // 删除上传文件
+        this.addMsg.Images = '';
       },
       //上传图片
       uploadFileBtn(file) { //上传
-        if(file.file.size > 1024 * 1024 * 10) {
+        if (file.file.size > 1024 * 1024 * 10) {
           this.$message.warning(this.$t('tips.wjdxbncgsz'))
           return
         }
         //  1 文档  2 数据 3 图片
-        let typeArr=[
-            {stringArr:'GIF|JPG|JPEG|PNG|BMP',type:3},
-        ]
-        let ft=file.file.name.substring(file.file.name.lastIndexOf('.')+1,file.file.name.length).toUpperCase();
+        let typeArr = [{
+          stringArr: 'GIF|JPG|JPEG|PNG|BMP',
+          type: 3
+        }, ]
+        let ft = file.file.name.substring(file.file.name.lastIndexOf('.') + 1, file.file.name.length).toUpperCase();
         let fileTypeNumber = 2;
         let typeOk = false;
-        typeArr.forEach(x=>{
-            if(x.stringArr.indexOf(ft)!='-1')
-            {
-              fileTypeNumber=x.type
+        typeArr.forEach(x => {
+          if (x.stringArr.indexOf(ft) != '-1') {
+            fileTypeNumber = x.type
             typeOk = true;
           }
         })
@@ -418,7 +434,7 @@ export default {
         let path = "/Upload/plat/"
         this.$message.info(this.$t('tips.shangchuanzhong'))
         this.UploadSelfFileT(path, newArr, x => {
-            let fileSize = file.file.size<1024? file.file.size:(file.file.size / 1024).toFixed(0);
+          let fileSize = file.file.size < 1024 ? file.file.size : (file.file.size / 1024).toFixed(0);
           this.addMsg.Images = this.domainManager().ViittoFileUrl + x.data.FilePath
           this.$message.success(this.$t('tips.scchenggong'));
           // this.$forceUpdate();
@@ -450,7 +466,7 @@ export default {
       },
       delArea(ID, CodeLevel) {
         var that = this;
-      this.Confirm("是否删除?", function() {
+        this.Confirm("是否删除?", function () {
           let msg = {
             ID: ID,
             CodeLevel: CodeLevel
@@ -556,6 +572,8 @@ export default {
               this.addMsg.ProvinceID = res.data.data.ProvinceID;
               this.addMsg.CityID = res.data.data.CityID;
               this.addMsg.Images = res.data.data.Images;
+              this.addMsg.Lng=res.data.data.Lng;
+              this.addMsg.Lat=res.data.data.Lat;
               if (this.addMsg.Area == 0) {
                 this.addMsg.Area = this.addMsg.Area.toString();
               } else {
@@ -705,5 +723,6 @@ export default {
       this.initData();
       this.getContinentList();
     }
-};
+  };
+
 </script>