From 7f97fffcc373076ed34692080501447b93e320ae Mon Sep 17 00:00:00 2001
From: zx <604444282@qq.com>
Date: Mon, 7 Mar 2022 17:00:03 +0800
Subject: [PATCH] zx

---
 src/api/city/index.js                         |  19 ++
 src/api/manage/index.js                       |  74 ++++-
 src/api/upload/index.js                       |  10 +
 src/router/manage.js                          |   9 +
 .../ChargingManage/ChargingStandard/index.vue |  38 ++-
 .../ChargingManage/FinancialBill/_payback.vue |  16 +-
 src/views/Manage/CustomerList/_detail.vue     |  64 ++--
 src/views/Manage/CustomerList/index.vue       |   8 +-
 src/views/Manage/OrderManage/_addOrder.vue    | 172 +++++++++-
 src/views/Manage/VillageManage/_detail.vue    |  15 +
 src/views/Manage/VillageManage/index.vue      | 302 ++++++++++++------
 11 files changed, 567 insertions(+), 160 deletions(-)
 create mode 100644 src/api/city/index.js
 create mode 100644 src/api/upload/index.js
 create mode 100644 src/views/Manage/VillageManage/_detail.vue

diff --git a/src/api/city/index.js b/src/api/city/index.js
new file mode 100644
index 0000000..a1fb4bc
--- /dev/null
+++ b/src/api/city/index.js
@@ -0,0 +1,19 @@
+import httpService from "@/request"
+
+// 城市-查询所有城市信息
+export function getAllCity(params) {
+	return httpService({
+		url: `/city/allCity`,
+		method: 'get',
+		params: params,
+	})
+}
+
+// 城市-根据父类ID查询城市信息
+export function getCityByParent(params) {
+	return httpService({
+		url: `/city/findByParentId`,
+		method: 'get',
+		params: params,
+	})
+}
\ No newline at end of file
diff --git a/src/api/manage/index.js b/src/api/manage/index.js
index 67d44d4..3b3a41a 100644
--- a/src/api/manage/index.js
+++ b/src/api/manage/index.js
@@ -45,6 +45,42 @@ export function getCustomerDetail(params) {
 	})
 }
 
+// 小区管理-查询所有的小区信息
+export function getCommunityList(params) {
+	return httpService({
+		url: `/user/community/list`,
+		method: 'get',
+		params: params,
+	})
+}
+
+// 小区管理-获取对应公司下的所有小区信息
+export function getComById(params) {
+	return httpService({
+		url: `/user/community/getCommunityInfoByCompanyId`,
+		method: 'get',
+		params: params,
+	})
+}
+
+// 小区管理-添加小区信息
+export function getAddCommunity(params) {
+	return httpService({
+		url: `/user/community/insertAdmin`,
+		method: 'post',
+		params: params,
+	})
+}
+
+// 小区管理-修改小区信息
+export function updateCommunity(params) {
+	return httpService({
+		url: `/user/community/updateAdmin`,
+		method: 'post',
+		params: params,
+	})
+}
+
 // 订单管理-查询所有订单
 export function getAllOrder(params) {
 	return httpService({
@@ -54,6 +90,24 @@ export function getAllOrder(params) {
 	})
 }
 
+// 订单管理-后台创建订单
+export function createOrder(params) {
+	return httpService({
+		url: `/user/order/adminCreateOrder`,
+		method: 'post',
+		data: params,
+	})
+}
+
+// 订单管理-计算金额
+export function calcAmount(params) {
+	return httpService({
+		url: `/user/order/calculateAmount`,
+		method: 'post',
+		data: params,
+	})
+}
+
 // 订单管理-订单解绑小区
 export function orderUnbound(params) {
 	return httpService({
@@ -90,12 +144,21 @@ export function findSuperNavigation(params) {
 	})
 }
 
+// 收费管理-根据收费模版主键Id查询收费模版信息
+export function getChargeById(params) {
+	return httpService({
+		url: `/user/charging/findById`,
+		method: 'get',
+		params: params,
+	})
+}
+
 // 收费管理-收费标准-启用/禁用收费模版
 export function onoffCharging(params) {
 	return httpService({
 		url: `/user/charging/updateStatus`,
 		method: 'post',
-		params: params,
+		data: params,
 	})
 }
 
@@ -108,6 +171,15 @@ export function addCharge(params) {
 	})
 }
 
+// 收费管理-收费标准-修改收费模版
+export function updateCharge(params) {
+	return httpService({
+		url: `/user/charging/update`,
+		method: 'post',
+		data: params,
+	})
+}
+
 // 收费管理-财务账单-查询所有财务账单
 export function getAllList(params) {
 	return httpService({
diff --git a/src/api/upload/index.js b/src/api/upload/index.js
new file mode 100644
index 0000000..b425417
--- /dev/null
+++ b/src/api/upload/index.js
@@ -0,0 +1,10 @@
+import httpService from "@/request"
+
+// 上传平台照片
+export function uploadImg(params) {
+	return httpService({
+		url: `/user/upload/uploadImg`,
+		method: 'post',
+		params: params,
+	})
+}
\ No newline at end of file
diff --git a/src/router/manage.js b/src/router/manage.js
index 381d3dc..d98b063 100644
--- a/src/router/manage.js
+++ b/src/router/manage.js
@@ -44,6 +44,15 @@ export default [
 		component: resolve => require(['@/views/Manage/VillageManage'], resolve),
 		meta: {title: '小区管理'},
 	},
+	{
+		path: '/Manage/VillageManage/_detail',
+		name: "village_detail",
+		title: "小区管理详情",
+		hide: true,
+		icon: 'home',
+		component: resolve => require(['@/views/Manage/VillageManage/_detail'], resolve),
+		meta: {title: '小区管理详情'},
+	},
 	{
 		path: '/Manage/OrderManage',
 		name: "OrderManage",
diff --git a/src/views/Manage/ChargingManage/ChargingStandard/index.vue b/src/views/Manage/ChargingManage/ChargingStandard/index.vue
index 1e2e6ba..389de50 100644
--- a/src/views/Manage/ChargingManage/ChargingStandard/index.vue
+++ b/src/views/Manage/ChargingManage/ChargingStandard/index.vue
@@ -39,7 +39,8 @@
                     <a @click="detail(record)">修改设置</a>
                 </span>
             </a-table>
-            <a-drawer title="新建收费模版" :visible="visible" @close="hanlderClose" width="512">
+            <!-- 新建/修改框 -->
+            <a-drawer :title="drawerModel == 1 ? '新建收费模版':'修改收费模版'" :visible="visible" @close="hanlderClose" width="512">
                 <a-form-model>
                     <a-form-model-item label="模版名称">
                         <a-input v-model="addForm.name" style="width: 240px" placeholder="请输入模版名称" />
@@ -71,7 +72,8 @@
                         </div>
                     </a-form-model-item>
                 </a-form-model>
-                <a-button @click="addConfirm" type="primary">确定</a-button>
+                <a-button v-if="drawerModel==1" @click="addConfirm" type="primary">确认新增</a-button>
+                <a-button v-else type="primary" @click="addConfirm">确认修改</a-button>
             </a-drawer>
         </div>
     </div>
@@ -79,12 +81,13 @@
 
 <script>
 import {getChargingList} from "@/api/manage"
-// import {onoffCharging} from "@/api/manage"
-import {findTimeType, findSuperNavigation, addCharge} from "@/api/manage";
+import {onoffCharging} from "@/api/manage"
+import {findTimeType, findSuperNavigation, addCharge, updateCharge } from "@/api/manage";
 export default {
     name: "chagingStandard",
     data() {
         return {
+            drawerModel: 1,
             form: {
                 pageNum: 1,
                 size: 10,
@@ -218,6 +221,7 @@ export default {
 		},
         //新建收费模版
         handlerAdd() {
+            this.drawerModel = 1;
             this.visible = true
         },
         //-改变选择的模块
@@ -249,16 +253,30 @@ export default {
                 name: this.addForm.name,
                 chargingTemplateFunctionTimeTypeDTO: chosenAdds
             }
-            addCharge(obj).then(res => {
-            })
+            if(this.drawerModel == 1) {
+                addCharge(obj).then(() => {
+                    this.visible = false
+                })
+            } else {
+                let o = Object.assign(obj, {id: this.chosenModel});
+                updateCharge(o).then(() => {
+                    this.visible = false
+                })
+            };
+            this.getData();
         },
-        //修改设置
+        //修改模版
         detail(record) {
-
+            this.chosenModel = record.id
+            this.drawerModel = 2;
+            this.visible = true
         },
-        //修改状态
+        //启用/禁用
         onChange(record) {
-            console.log(record);
+            let obj = {id: record.id}
+            onoffCharging(obj).then(() => {
+                this.getData()
+            })
         },
         //查询和重置
         onSearch() {
diff --git a/src/views/Manage/ChargingManage/FinancialBill/_payback.vue b/src/views/Manage/ChargingManage/FinancialBill/_payback.vue
index 13067aa..b59647d 100644
--- a/src/views/Manage/ChargingManage/FinancialBill/_payback.vue
+++ b/src/views/Manage/ChargingManage/FinancialBill/_payback.vue
@@ -1,9 +1,8 @@
 <template>
     <div class="main">
         <div class="cardTitle">退款订单</div>
-        <a-divider />
         <div class="content">
-            <a-descriptions title="退款信息" :column="3">
+            <a-descriptions style="padding: 12px" title="退款信息" :column="3">
                 <a-descriptions-item label="订单号">
                     {{infoList.code}}
                 </a-descriptions-item>
@@ -19,16 +18,15 @@
             </a-descriptions>
             <a-divider></a-divider>
             <div class="payback-content">
-                <span>取消功能模块：</span>
-                <a-checkbox-group :options="modelType" @change="modelChange" />
-                <a-form-model layout="inline">
+                <a-form-model :labelCol="{span: 2}" :wrapperCol="{span: 5,offset: 0}">
+                    <a-form-model-item label="取消功能模块：">
+                        <a-checkbox-group :options="modelType" @change="modelChange" />
+                    </a-form-model-item>
                     <a-form-model-item label="退款金额">
                         <a-input-number v-model="paybackForm.price"></a-input-number>
                     </a-form-model-item>
-                </a-form-model>
-                <a-form-model layout="inline">
                     <a-form-model-item label="退款方式">
-                        <a-select v-model="paybackForm.type" style="width: 200px" placeholder="请选择退款方式">
+                        <a-select v-model="paybackForm.type" placeholder="请选择退款方式">
                             <a-select-option :value="1">
                                 线上
                             </a-select-option>
@@ -40,8 +38,6 @@
                             </a-select-option>
                         </a-select>
                     </a-form-model-item>
-                </a-form-model>
-                <a-form-model layout="inline">
                     <a-form-model-item label="退款原因">
                         <a-textarea placeholder="请输入退款原因" v-model="paybackForm.reason"></a-textarea>
                     </a-form-model-item>
diff --git a/src/views/Manage/CustomerList/_detail.vue b/src/views/Manage/CustomerList/_detail.vue
index 30e49b9..0def5c6 100644
--- a/src/views/Manage/CustomerList/_detail.vue
+++ b/src/views/Manage/CustomerList/_detail.vue
@@ -6,56 +6,54 @@
       <div class="content">
         <a-descriptions title="基本信息" :column="3">
           <a-descriptions-item label="企业名称">
-            上海比利时物业有限公司
+            {{infoList.companyName}}
           </a-descriptions-item>
           <a-descriptions-item label="公司地址">
-            湖南省湘潭市岳塘区红旗街道 8 单元 111 室
+            {{infoList.companyAddressDetails}}
           </a-descriptions-item>
           <a-descriptions-item label="社会信用代码"
-            >39123m13841bdi123341
+            >{{infoList.socialCreditCode}}
           </a-descriptions-item>
-          <a-descriptions-item label="法人名称"> 陈晨 </a-descriptions-item>
+          <a-descriptions-item label="法人名称"> {{infoList.legalPersonName}} </a-descriptions-item>
           <a-descriptions-item label="法人身份证号"
-            >621222199804287702</a-descriptions-item
+            >{{infoList.legalPersonIdCard}}</a-descriptions-item
           >
           <a-descriptions-item label="执照有效期限">
-            2021/04/09 至 2021/04/09</a-descriptions-item
-          >
+            {{infoList.licenseTimeStart}} 至 
+            {{infoList.licenseTimeEnd == null ? '长期' : infoList.licenseTimeEnd}}
+          </a-descriptions-item>
         </a-descriptions>
         <a-descriptions title="法人身份证照" :column="1">
           <a-descriptions-item label="头像面" @click="download(this.img)"
-            ><img :src="img" alt=""
-          /></a-descriptions-item>
+            >
+            <img :src="item.url" alt="" v-for="(item, index) in infoList.idCardFrontImgList" :key="index">
+            </a-descriptions-item>
           <a-descriptions-item label="国徽面"
-            ><img :src="img" alt=""
-          /></a-descriptions-item>
+            ><img :src="item.url" alt="" v-for="(item, index) in infoList.idCardBackImgList" :key="index">
+            </a-descriptions-item>
           <a-descriptions-item label="营业执照"
-            ><img :src="img" alt=""
-          /></a-descriptions-item>
+            ><img :src="item.url" alt="" v-for="(item, index) in infoList.businessLicenseImgList" :key="index">
+            </a-descriptions-item>
           <a-descriptions-item label="其他附件"
-            ><img :src="img" alt="" /><img :src="img" alt="" /><img
-              :src="img"
-              alt="" /><img :src="img" alt="" /><img :src="img" alt="" /><img
-              :src="img"
-              alt=""
-          /></a-descriptions-item>
+            ><img :src="item.url" alt="" v-for="(item, index) in infoList.othersImgList" :key="index">
+            </a-descriptions-item>
         </a-descriptions>
         <a-descriptions title="联系人信息" :column="3">
-          <a-descriptions-item label="联系人"> 周立 </a-descriptions-item>
+          <a-descriptions-item label="联系人"> {{infoList.contactsName}} </a-descriptions-item>
           <a-descriptions-item label="联系人号码">
-            18716191912
+            {{infoList.contactsTel}}
           </a-descriptions-item>
-          <a-descriptions-item label="邮箱">hpzs@sina.com </a-descriptions-item>
+          <a-descriptions-item label="邮箱">{{infoList.contactsEmail}} </a-descriptions-item>
           <a-descriptions-item label="联系人地址">
-            陕西省铜川市宜君县哭泉乡 10 单元 98 室
+            {{infoList.contactsAddressDetails}}
           </a-descriptions-item>
         </a-descriptions>
       </div>
     </div>
     <div class="footer">
       <a-space style="margin-left: 70%">
-        <a-button type="primary" @click="auditShow=true">修改信息</a-button>
-        <a-button @click="cancel">取消</a-button>
+        <!-- <a-button type="primary" @click="auditShow=true">修改信息</a-button> -->
+        <a-button @click="cancel">返回</a-button>
       </a-space>
     </div>
     <a-modal
@@ -90,19 +88,31 @@
 </template>
 
 <script>
+import {getCustomerDetail} from "@/api/manage"
 export default {
 	data() {
 		return {
 			form:{
-				type:'1',
-				remark:''
+				id: undefined
 			},
 			auditShow: false,
+      infoList: {},
 			detailData: {},
 			img: "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimgcdn.scol.com.cn%2FNEWS_1F3371B8BC0CD062D6AF69E363F8E32A.JPG&refer=http%3A%2F%2Fimgcdn.scol.com.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643355029&t=835fe0ff21af86e6996eb308794df217",
 		};
 	},
+  mounted() {
+    this.form.id = this.$route.query.id
+    this.getData();
+  },
 	methods: {
+    getData() {
+      getCustomerDetail(this.form).then(res => {
+        let data = res.data;
+        this.infoList = data;
+        console.log(this.infoList)
+      })
+    },
 		download() {},
 		cancel() {
 			this.$router.go(-1);
diff --git a/src/views/Manage/CustomerList/index.vue b/src/views/Manage/CustomerList/index.vue
index 9b1b8b2..b007684 100644
--- a/src/views/Manage/CustomerList/index.vue
+++ b/src/views/Manage/CustomerList/index.vue
@@ -135,8 +135,12 @@ export default {
 			})
 		},
 		detail(index){
-			console.log(index)
-			this.$router.push({name:'customer_detail'})
+			this.$router.push({
+				name:'customer_detail',
+				query: {
+					id: index.id
+				}
+			})
 		},
 		onSelectChange(selectedRowKeys) {
 			console.log("selectedRowKeys changed: ", selectedRowKeys);
diff --git a/src/views/Manage/OrderManage/_addOrder.vue b/src/views/Manage/OrderManage/_addOrder.vue
index e23545e..f461d06 100644
--- a/src/views/Manage/OrderManage/_addOrder.vue
+++ b/src/views/Manage/OrderManage/_addOrder.vue
@@ -1,31 +1,187 @@
 <template>
   <div class="main">
+    <div class="main-content">
       <div class="cardTitle">添加订单信息</div>
-      <a-divider />
       <div class="content">
-            <a-form-model>
+            <a-form-model :labelCol="{span: 2}" :wrapperCol="{span: 8}">
                 <a-form-model-item label="订单号">
-                    <a-input style="width: 240px"></a-input>
+                    <a-input v-model="form.code" ></a-input>
+                </a-form-model-item>
+                <a-form-model-item label="支付类型">
+                    <a-select v-model="form.payType">
+                        <a-select-option :value="1">线下</a-select-option>
+                        <a-select-option :value="2">支付宝</a-select-option>
+                        <a-select-option :value="3">微信</a-select-option>
+                    </a-select>
+                </a-form-model-item>
+                <a-form-model-item label="选择收费模版">
+                    <a-select v-model="form.chargingTemplateId" @change="modelChange">
+                        <a-select-option :value="item.id" v-for="(item, index) in modelData" :key="index">
+							{{item.name}}
+						</a-select-option>
+                    </a-select>
                 </a-form-model-item>
                 <a-form-model-item label="选择功能模块">
 
                 </a-form-model-item>
                 <a-form-model-item label="选择有效时长">
-                    <a-select style="width: 240px">
-                        
+                    <a-select v-model="form.timeTypeId" @change="timeChange">
+                        <a-select-option :value="item.id" v-for="(item, index) in timeData" :key="index">
+							{{item.years == 0 ? '' : item.years+'年'}}
+                            {{item.months == 0 ? '' : item.months+'个月'}}
+                            {{item.days == 0 ? '' : item.days+'天'}}
+						</a-select-option>
+                    </a-select>
+                </a-form-model-item>
+                <a-form-model-item label="购买金额">
+                    <span style="color: red">¥ {{form.payPrice}}</span>
+                </a-form-model-item>
+                <a-form-model-item label="选择公司">
+                    <a-select v-model="form.companyId" @change="boundCom">
+                        <a-select-option :value="item.id" v-for="(item, index) in companyData" :key="index">
+							{{item.companyName}}
+						</a-select-option>
+                    </a-select>
+                </a-form-model-item>
+                <a-form-model-item label="绑定小区">
+                    <a-select v-model="form.communityId">
+                        <a-select-option :value="item.id" v-for="(item, index) in comData" :key="index">
+							{{item.companyName}}
+						</a-select-option>
                     </a-select>
                 </a-form-model-item>
             </a-form-model>
       </div>
+        <div class="cardTitle">高级配置</div>
+        <div class="content">
+            <a-form-model :labelCol="{span: 2}" :wrapperCol="{span: 8}">
+                <a-form-model-item label="域名">
+                    <a-input style="width: 394px"></a-input>
+                </a-form-model-item>
+                <a-form-model-item label="服务器ip">
+                    <a-input style="width: 394px"></a-input>
+                </a-form-model-item>
+                <a-form-model-item label="是否定制">
+                    <a-select style="width: 394px" @change="textareaDisable" v-model="form.isCustomized">
+                        <a-select-option :value="0">
+                            不定制
+                        </a-select-option>
+                        <a-select-option :value="1">
+                            定制
+                        </a-select-option>
+                    </a-select>
+                </a-form-model-item>
+                <a-form-model-item label="定制需求">
+                    <a-textarea v-model="form.customizedDemand" style="width: 394px" :disabled="form.isCustomized == 0" placeholder="请填写定制需求">
+                    </a-textarea>
+                </a-form-model-item>
+            </a-form-model> 
+        </div>  
+      </div>
+        <a-space style="margin-left: 138px">
+            <a-button type="primary" @click="addConfirm">创建订单</a-button>
+            <a-button @click="cancel">取消</a-button>
+        </a-space>
   </div>
 </template>
 
 <script>
+import {getAllRequest,getComById, createOrder, calcAmount} from "@/api/manage";
+import {findTimeType, getChargingList, getChargeById} from "@/api/manage";
 export default {
-
+    name: "addOrder",
+    data() {
+        return {
+            form: {
+                code: '',
+                payType: 1,
+                chargingTemplateId: undefined,
+                modelFunctionId: [1],
+                timeTypeId: undefined,
+                payPrice: 0,
+                companyId: undefined,
+                communityId: undefined,
+                domainName: '',
+                serviceIp: '',
+                isCustomized: 0, //定制
+                customizedDemand: '' //定制需求
+            },
+            //公司列表
+            companyData: [],
+            comData: [], //小区列表
+            //时长列表
+            timeData: [],
+            //收费模版
+            modelData: [],
+        }
+    },
+    mounted() {
+        this.getApi();
+    },
+    methods: {
+        getApi() {
+            let obj = {pageNum: 1,size: 1000};
+			getAllRequest(obj).then(res => {
+				let data = res.data.rows
+				this.companyData = data;
+			})
+            findTimeType().then(res => {
+                let data = res.data;
+                this.timeData = data
+            })
+            getChargingList(Object.assign(obj, {name: ''})).then(res => {
+                let data = res.data.rows;
+                this.modelData = data
+            })
+        },
+        getPrice() {
+            if(this.form.chargingTemplateId && this.form.modelFunctionId && this.form.timeTypeId) {
+                let obj = {
+                    chargingTemplateId: this.form.chargingTemplateId,
+                    modelFunctionId: this.form.modelFunctionId,
+                    timeTypeId: this.form.timeTypeId
+                };
+                calcAmount(obj).then(res => {
+                    let data = res.data;
+                    this.form.payPrice = data * 1
+                });
+            }
+        },
+        modelChange(val) {
+            getChargeById({id: val}).then(res => {
+                console.log(res)
+            });
+            this.getPrice();
+        },
+        timeChange(val) {
+            this.getPrice();
+        },
+        textareaDisable(val) {
+            if(val == 0) {
+                this.form.customizedDemand = ''
+            }
+        },
+        //绑定小区
+        boundCom(val) {
+            getComById(val).then(res => {
+                let data = res.data;
+                this.comData = data
+            })
+        }, 
+        addConfirm() {
+            createOrder(this.form).then(res => {
+                console.log(res)
+            })
+        },
+        cancel() {
+			this.$router.go(-1);
+        }
+    }
 }
 </script>
 
-<style>
-
+<style lang="less">
+.main-content {
+    margin-left: 125px;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/Manage/VillageManage/_detail.vue b/src/views/Manage/VillageManage/_detail.vue
new file mode 100644
index 0000000..eb16f64
--- /dev/null
+++ b/src/views/Manage/VillageManage/_detail.vue
@@ -0,0 +1,15 @@
+<template>
+    <div>
+        test
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/src/views/Manage/VillageManage/index.vue b/src/views/Manage/VillageManage/index.vue
index 6808aa8..5e83b7e 100644
--- a/src/views/Manage/VillageManage/index.vue
+++ b/src/views/Manage/VillageManage/index.vue
@@ -1,87 +1,142 @@
 <template>
-  <div>
-    <commonTable
-      :columns="columns"
-      :tableData="tableData"
-      :ActionsList="ActionsList"
-      @handleTableChange="handleTableChange"
-      @Actions="Actions"
-      @selectionChoosed="selectionChoosed"
-    >
-      <template v-slot:actionBox="data">
-        <a @click="del(data)">删除</a>
-        <span style="margin: 5px">|</span>
-        <a>详情</a>
-      </template>
-    </commonTable>
+  <div class="main">
+      <div class="cardTitle">小区管理</div>
+	  <div class="search-box">
+		<a-space size="large">
+			<a-input v-model="form.communityName" placeholder="请输入小区名" />
+			<a-button type="primary" @click="handlerSearch">查 询</a-button>
+			<a-button @click="handlerReset">重 置</a-button>
+		</a-space>
+	  </div>
+	  <a-button @click="hanlderAdd" style="margin-left: 22px" type="primary">
+          添加小区
+      </a-button>
+	  <!-- 表格 -->
+		<div id="commonTable">
+		<a-table
+			:scroll="{ x: 1300 }"
+			:columns="columns"
+			:data-source="tableData"
+			:pagination="pagination"
+			@change="handleTableChange"
+			:row-key="
+			(record, index) => {
+				return index;
+			}
+			"
+		>
+			<span slot="pics" slot-scope="text,record">
+				<img :src="item.url" alt="" v-for="(item, index) in record.communityImgList" :key="index">
+			</span>
+			<span slot="action" slot-scope="text,record">
+			<a @click="detail(record)">修改</a>
+			</span>
+		</a-table>
+		</div>
+		<a-drawer :title="modelType == 1 ? '填写小区信息':'修改小区信息'" :visible="visible" @close="hanlderClose" width="512">
+            <a-form-model>
+                <a-form-model-item label="小区全称">
+                    <a-input v-model="addForm.name" style="width: 260px" placeholder="请输入小区全称" />
+                </a-form-model-item>
+				<a-form-model-item label="公司名称">
+                    <a-select v-model="addForm.companyId" style="width: 260px" placeholder="请选择公司">
+						<a-select-option :value="item.id" v-for="(item, index) in companyData" :key="index">
+							{{item.companyName}}
+						</a-select-option>
+					</a-select>
+                </a-form-model-item>
+				<a-form-model-item label="小区地址">
+                    <a-select @change="cityChange1" style="width: 120px" placeholder="请选择省">
+						<a-select-option :value="item.id" v-for="(item, index) in cityData" :key="index">
+							{{item.name}}
+						</a-select-option>
+					</a-select>
+					<a-select v-model="address1" @change="cityChange2" style="width: 120px;margin-left: 20px" placeholder="请选择市">
+						<a-select-option :value="item.id" v-for="(item, index) in cityData2" :key="index">
+							{{item.name}}
+						</a-select-option>
+					</a-select>
+					<a-select v-model="addForm.address" style="width: 120px;margin-left: 20px" placeholder="请选择区">
+						<a-select-option :value="item.id" v-for="(item, index) in cityData3" :key="index">
+							{{item.name}}
+						</a-select-option>
+					</a-select>
+                </a-form-model-item>
+				<a-form-model-item>
+					<a-input v-model="addForm.addressDetails" style="width: 260px" placeholder="请输入详细地址"></a-input>
+				</a-form-model-item>
+				<a-form-model-item label="小区正门图片">
+					<a-upload 
+						@change="addFile" 
+						action="" 
+						:defaultFileList="addForm.communityUrls" 
+						class="avatar-uploader" 
+						list-type="picture-card"
+					>
+						<div>
+							<a-icon :type="'plus'" />
+							<div class="ant-upload-text">Upload</div>
+						</div>
+					</a-upload>
+				</a-form-model-item>
+			</a-form-model>
+            <a-button @click="addConfirm" type="primary">确定</a-button>
+			<a-button style="margin-left: 20px" @click="hanlderClose">取消</a-button>
+        </a-drawer>
   </div>
 </template>
 
 <script>
+import {getCommunityList, getAddCommunity, getAllRequest, updateCommunity} from "@/api/manage"
+import {getAllCity, getCityByParent} from "@/api/city"
+import {uploadImg} from "@/api/upload"
 export default {
 	data() {
 		return {
-			tableChoosed: [],
+			uploadImg: uploadImg,
+			form: {
+				pageNum: 1,
+				size: 10,
+				communityName: ''
+			},
+			addForm: {
+				companyId: undefined,
+				name: '',
+				address: undefined,
+				addressDetails: '',
+				communityUrls: []
+			},
 			// 分页
 			pagination: {
 				current: 1,
 				total: 0,
 				pageSize: 10,
+				showTotal: (total) => `共 ${total} 条`,
+				showSizeChanger: true,
+				showQuickJumper: true,
 			},
 			//   列
 			columns: [
 				{
-					title: "Name",
+					title: "小区名称",
 					dataIndex: "name",
 					width: "200",
 				},
 				{
-					title: "Gender",
-					dataIndex: "gender",
-					width: "200",
-					customRender: function (gender) {
-						if (gender === 1) {
-							return "是";
-						} else {
-							return "否";
-						}
-					},
-				},
-				{
-					title: "Gender1",
-					dataIndex: "gender1",
-					width: "200",
-				},
-				{
-					title: "Gender2",
-					dataIndex: "gender2",
-					width: "200",
-				},
-				{
-					title: "Gender3",
-					dataIndex: "gender3",
-					width: "200",
-				},
-				{
-					title: "Gender4",
-					dataIndex: "gender4",
+					title: "公司名称",
+					dataIndex: "companyName",
 					width: "200",
 				},
 				{
-					title: "Gender5",
-					dataIndex: "gender5",
+					title: "小区地址",
+					dataIndex: "addressName",
 					width: "200",
 				},
 				{
-					title: "Gender6",
-					dataIndex: "gender6",
-					width: "200",
-				},
-				{
-					title: "status",
-					dataIndex: "status",
-
+					title: "公司图片",
+					dataIndex: "communityImgList",
 					width: "200",
+					scopedSlots: { customRender: "pics" },
 				},
 				{
 					title: "操作",
@@ -93,63 +148,106 @@ export default {
 				},
 			],
 			//   数据
-			tableData: [
-				{ name: 1, gender: 1 },
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-				{},
-			],
-			ActionsList: [
-				{
-					label: "批量删除",
-					value: 1,
-				},
-				{
-					label: "批量导出",
-					value: 2,
-				},
-			],
+			tableData: [],
+			companyData: [],
+			cityData: [],
+			cityData2: [],
+			cityData3: [],
+			address1: undefined,
+			// 添加/修改小区
+			modelType: 1, //1添加 2修改
+			visible: false,
 		};
 	},
+	mounted() {
+		this.getApi();
+		this.getData()
+	},
 	methods: {
-		handleTableChange(pagination) {
-			console.log(pagination);
-			const pager = { ...this.pagination };
-			pager.current = pagination.current;
-			pager.pageSize = pagination.pageSize;
-			this.pagination = pager;
+		getData() {
+			getCommunityList(this.form).then(res => {
+				let data = res.data.rows;
+				this.pagination.total = res.data.total;
+				this.tableData = data
+			})
 		},
-		del(data) {
-			console.log(data);
+		getApi() {
+			let obj = {pageNum: 1,size: 1000};
+			getAllRequest(obj).then(res => {
+				let data = res.data.rows
+				this.companyData = data;
+			})
+			getAllCity().then(res => {
+				let data = res.data;
+				this.cityData = data;
+			})
 		},
-		Actions(data) {
-			console.log(data);
+		//分页
+		handleTableChange(pagination) {
+			this.form.size = pagination.pageSize;
+			this.form.pageNum = pagination.current;
+			this.getData();
 		},
 		selectionChoosed(data) {
-			console.log(data);
 			this.tableChoosed = data
 		},
+		//点击详情
+		detail(record) {
+			this.modelType = 2;
+			this.chosenId = record.id; //小区id
+			this.visible = true;
+		},
+		//查询
+		handlerSearch() {
+			this.getData()
+		},
+		//重置
+		handlerReset() {
+			this.form.communityName = '';
+			this.getData()
+		},
+		//添加小区
+		hanlderAdd() {
+			this.modelType = 1;
+			this.visible = true;
+		},
+		hanlderClose() {
+			this.visible = false;
+		},
+		addConfirm() {
+			if(this.modelType == 1) {
+				getAddCommunity(this.addForm).then(res => {
+					console.log(res)
+				})
+			} else {
+				let obj = Object.assign({id: this.chosenId}, this.addForm)
+				updateCommunity(obj).then(res => {
+					console.log(res)
+				})
+			}
+			this.visible = false;
+		},
+		//添加小区-输入城市
+		cityChange1(val) {
+			this.address1 = undefined,
+			this.addForm.address = undefined,
+			this.cityData3 = [],
+			this.cityData2 = this.cityData[val-2].cityList
+		},
+		cityChange2(val) {
+			this.addForm.address = undefined
+			getCityByParent({parentId: val}).then(res => {
+				let data = res.data;
+				this.cityData3 = data;
+			})
+		},
+		//添加小区-上传图片
+		addFile(file) {
+			console.log(file)
+		}
 	},
 };
 </script>
 
-<style>
+<style lang="less">
 </style>
\ No newline at end of file