feat: dc侧滑（未完成版，换电脑临时提交）

nezha-fronted/src/components/common/rightBox/dcBox.vue

@@ -29,6 +29,25 @@
             <el-input v-if="rightBox.isEdit" placeholder="" v-model="dc.location" size="small"></el-input>
             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{dc.location}}</div>
           </el-form-item>
+          <el-form-item :label='$t("asset.createAssetTab.tel")' prop="tel">
+            <el-input v-if="rightBox.isEdit" placeholder="" v-model="dc.tel" size="small"></el-input>
+            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{dc.tel}}</div>
+          </el-form-item>
+          <el-form-item :label='$t("asset.createAssetTab.principal")' prop="principal">
+            <el-select value-key="id" popper-class="config-dropdown"
+                       v-model="dc.principal" placeholder="" v-if="rightBox.isEdit" size="small">
+              <el-option @click.native="" v-for="item in userData" :key="item.userId" :label="item.username"
+                         :value="item.userId" :id="'dc-principal-op-'+item.userId">
+                <span>{{item.username}}</span>
+              </el-option>
+
+            </el-select>
+            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{dc.tel}}</div>
+          </el-form-item>
+          <el-form-item :label='$t("config.dc.area")' prop="area">
+
+
+          </el-form-item>
         </el-form>
       </el-scrollbar>
 
@@ -51,7 +70,8 @@
   export default {
     name: "dcBox",
     props: {
-      dc: Object
+      dc: Object,
+      userData: Array
     },
     data() {
       return {
@@ -66,7 +86,97 @@
             {validator: noSpecialChar,trigger: "change"}
           ],
         },
-        projectList: [],
+        areaData: [],
+        data: {
+          code: 200,
+          msg: "success",
+          data: {
+            list: [{
+              id: 1,
+              pid: 0,
+              name: "astana",
+              longitude: 100.3,
+              latitude: 24.3,
+              i18n:{en:'astana',cn:'阿斯塔纳'},
+              children: [{
+                id: 2,
+                pid: 1,
+                name: "qu",
+                longitude: 100.3,
+                latitude: 24.3,
+                i18n:{en:'qu',cn:'阿斯塔纳一个区'},
+                children: [{
+                  id: 3,
+                  pid: 2,
+                  name: "qu2",
+                  longitude: 100.3,
+                  latitude: 24.3,
+                  i18n:{en:'qu2',cn:'阿斯塔纳二个区'}}
+                ]
+              }, {
+                id: 4,
+                pid: 0,
+                name: "alamutu",
+                longitude: 100.3,
+                latitude: 24.3,
+                i18n:{en:'alamutu',cn:'阿拉木图'},
+                children: [{
+                  id: 5,
+                  pid: 4,
+                  name: "qu3",
+                  longitude: 100.3,
+                  latitude: 24.3,
+                  i18n: {en: 'qu3', cn: '阿拉木图一个区'}
+                }]
+              }]
+            }]
+          }
+        },
+        data2: [{
+          id: 1,
+          label: '一级 1',
+          children: [{
+            id: 4,
+            label: '二级 1-1',
+            children: [{
+              id: 9,
+              label: '三级 1-1-1'
+            }, {
+              id: 10,
+              label: '三级 1-1-2'
+            }]
+          }]
+        }, {
+          id: 2,
+          label: '一级 2',
+          children: [{
+            id: 5,
+            label: '二级 2-1'
+          }, {
+            id: 6,
+            label: '二级 2-2'
+          }]
+        }, {
+          id: 3,
+          label: '一级 3',
+          children: [{
+            id: 7,
+            label: '二级 3-1'
+          }, {
+            id: 8,
+            label: '二级 3-2',
+            children: [{
+              id: 11,
+              label: '三级 3-2-1'
+            }, {
+              id: 12,
+              label: '三级 3-2-2'
+            }, {
+              id: 13,
+              label: '三级 3-2-3'
+            }]
+          }]
+        }],
       }
     },
     methods: {
@@ -135,8 +245,24 @@
           });
         });
       },
+      getAreaData() {
+        this.areaData = this.toTreeData(this.data);
+
+        /*this.$get('area', {}).then(response => {
+          if (response.code === 200) {
+            let rawData = response.data.list;
+            //将原始数据处理为el-tree格式
+
+          }
+        });*/
+      },
+      toTreeData(rawData) {
+
+        return rawData;
+      }
     },
-    created() {
+    mounted() {
+      this.getAreaData();
     },
     computed: {
     },