liumin
/
zkPCproject
0
0
フォーク 0
コード 課題 0 プルリクエスト 0 リリース 0 Wiki アクティビティ
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
529 コミット
4 ブランチ
45 MiB
 
 
 
ツリー: 5013e68a82
ブランチ タグ
${ item.name }
ブランチ ${ searchTerm } を作成
'5013e68a82' から
${ noResults }
zkPCproject/src/views/building/Count.vue

761 行
26 KiB
Raw Blame 履歴 

  1. <template>

  2.   <div class="box-center">

  3.     <div style="

  4.     width: calc(100% - 270px);

  5.     position: fixed;    

  6.     z-index: 999;

  7.     margin-top: -16px;

  8.     background: #ecedf0;

  9.     box-shadow: 0px 0px 10px 0px #dadada;

  10.     ">

  11.       <div class="toptab" style="cursor: pointer" v-if="orgType != 2">

  12.         <div @click="tapclickyab(0)" :class="{ activecllasscet: activeTotal == 0 }"

  13.           :style="{ background: activeTotal == 0 ? '#2671E2' : '#ffffff' }">

  14.           项目

  15.         </div>

  16.         <div v-if="orgType == 0" @click="tapclickyab(1)" :class="{ activecllasscet: activeTotal == 1 }"

  17.           :style="{ background: activeTotal == 1 ? '#2671E2' : '#ffffff' }">

  18.           代理商

  19.         </div>

  20.         <div v-if="orgType == 0 || orgType == 1" @click="tapclickyab(2)" :class="{ activecllasscet: activeTotal == 2 }"

  21.           :style="{ background: activeTotal == 2 ? '#2671E2' : '#ffffff' }">

  22.           公司

  23.         </div>

  24.       </div>

  25.       <!-- 头 -->

  26.       <div class="app-top">

  27.         <div class="app-titel" style="margin-top: 5px">

  28.           <div class="div-lab">

  29.             <div class="label" style="margin-left: 15px">时间：</div>

  30.             <div class="toptimeqhuan">

  31.               <div :class="{ tophove: searchForm.dateType == 4 }" @click="tabtimetap(4)" style="cursor: pointer">

  32.                 近7天

  33.               </div>

  34.               <div :class="{ tophove: searchForm.dateType == 5 }" @click="tabtimetap(5)" style="cursor: pointer">

  35.                 近15天

  36.               </div>

  37.               <div :class="{ tophove: searchForm.dateType == 6 }" @click="tabtimetap(6)" style="cursor: pointer">

  38.                 近30天

  39.               </div>

  40.             </div>

  41.             <div>

  42.               <el-date-picker v-model="time" type="daterange" class="div-inp" range-separator="-"

  43.                 start-placeholder="开始日期" :default-time="['00:00:00', '23:59:59']" value-format="yyyy-MM-dd"

  44.                 end-placeholder="结束日期" @change="timeChange">

  45.               </el-date-picker>

  46.             </div>

  47.           </div>

  48. 

  49.           <!--

  50.         <div class="div-lab" v-if="orgType!=2">

  51.           <el-input

  52.             v-model="changeValue"

  53.             clearable

  54.             placeholder="请输入"

  55.             maxlength="10"

  56.             @change="selectChange"

  57.             style="width: 363px"

  58.           >

  59.             <el-select

  60.               v-model="selflag"

  61.               slot="prepend"

  62.               class="input-with-select"

  63.               style="width: 115px"

  64.               placeholder="请选择"

  65.               @change="selChange"

  66.             >

  67.               <el-option label="公司名称" value="1"></el-option>

  68.               <el-option v-if="orgType==0&&activeTotal != 2" label="代理商名称" value="2"></el-option>

  69.               <el-option label="项目名称" value="3"></el-option>

  70.             </el-select>

  71.           </el-input>

  72.         </div> -->

  73. 

  74.           <div class="div-lab" v-if="orgType == 0">

  75.             <el-input v-model="changeValue" clearable placeholder="请输入" maxlength="10" @change="selectChange"

  76.               style="width: 363px">

  77.               <el-select v-model="selflag" slot="prepend" class="input-with-select" style="width: 115px"

  78.                 placeholder="请选择" @change="selChange">

  79.                 <el-option v-if="activeTotal != 1" label="公司名称" value="1"></el-option>

  80.                 <el-option v-if="activeTotal != 2" label="代理商名称" value="2"></el-option>

  81.                 <el-option v-if="activeTotal == 0" label="项目名称" value="3"></el-option>

  82.               </el-select>

  83.             </el-input>

  84.           </div>

  85. 

  86.           <div class="div-lab" v-if="orgType == 1">

  87.             <el-input v-model="changeValue" clearable placeholder="请输入" maxlength="10" @change="selectChange"

  88.               style="width: 363px">

  89.               <el-select v-model="selflag" slot="prepend" class="input-with-select" style="width: 115px"

  90.                 placeholder="请选择" @change="selChange">

  91.                 <el-option v-if="activeTotal != 1" label="公司名称" value="1"></el-option>

  92.                 <el-option v-if="activeTotal == 0" label="项目名称" value="3"></el-option>

  93.               </el-select>

  94.             </el-input>

  95.           </div>

  96.         </div>

  97.         <div class="app-titel" style="margin-top: 5px">

  98.           <div class="div-lab">

  99.             <div class="label">地区：</div>

  100.             <el-cascader :props="props" @change="locationsChange" placeholder="省/市" size="small" separator="/"

  101.               v-model="provice" clearable></el-cascader>

  102.           </div>

  103.           <!-- <div class="div-lab" v-if="orgType == 0">

  104.           <div class="label" style="min-width:70px;">系统运营：</div>

  105.           <el-input  maxlength="10" clearable v-model="searchForm.linkman"></el-input>

  106.         </div>

  107.         <div class="div-lab" v-if="orgType == 1">

  108.           <div class="label" style="min-width:70px;">售后运营：</div>

  109.           <el-input  maxlength="10" clearable v-model="searchForm.linkman"></el-input>

  110.         </div> -->

  111.           <div v-if="orgType == 0 || orgType == 1" class="div-lab">

  112.             <div class="label">运营人员：</div>

  113.             <el-select v-model="searchForm.operationStaffId" placeholder="请选择" class="div-inp" filterable clearable>

  114.               <el-option v-for="item in operaList" :key="item.accountId" :label="item.name" :value="item.accountId">

  115.               </el-option>

  116.             </el-select>

  117.           </div>

  118.         </div>

  119.         <div class="app-titel" style="margin-top: 15px">

  120.           <div style="margin-left: 20px">

  121.             <el-button type="primary" @click="screen">筛选</el-button>

  122.           </div>

  123.           <div style="margin-left: 20px">

  124.             <el-button @click="clascreen" type="text">清空筛选条件</el-button>

  125.           </div>

  126.           <div style="margin-left: auto; margin-right: 10px" v-if="cus_build_count_download">

  127.             <el-button @click="downLoad" icon="el-icon-download">导出</el-button>

  128.           </div>

  129.         </div>

  130.       </div>

  131.     </div>

  132. 

  133.     <!-- 表格 -->

  134.     <div class="cen-tab" :style="{ marginTop: orgType != 2 ? '230px' : '170px' }">

  135.       <el-table :header-cell-style="{ background: '#F5F7FA', color: '#333333' }" v-if="activeTotal == 0" :data="tableData"

  136.         stripe style="width: 100%" height="640">

  137.         <el-table-column prop="propertyName" label="项目名称" align="center">

  138.         </el-table-column>

  139.         <el-table-column prop="orgName" label="公司名称" align="center">

  140.           <template slot-scope="{ row }">

  141.             <el-tooltip class="item" effect="dark" :content="row.orgName" placement="top-start">

  142.               <span

  143.                 style="display: block;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{ row.orgName }}</span>

  144.             </el-tooltip>

  145.           </template>

  146.         </el-table-column>

  147.         <el-table-column prop="agentName" label="代理商" align="center">

  148.         </el-table-column>

  149.         <el-table-column prop="avgExacutiveRate" label="平均执行率" width="110" align="center" sortable>

  150.           <template slot-scope="{ row }">

  151.             {{ row.avgExacutiveRate || 0 }}%

  152.           </template>

  153.         </el-table-column>

  154.         <!-- <el-table-column prop="axExacutiveRate" label="最高执行率" align="center" sortable width="110">

  155.         </el-table-column>

  156.         <el-table-column prop="noMarkAdviserCount" label="未标顾问" align="center" sortable width="110">

  157.         </el-table-column> -->

  158.         <el-table-column prop="equipmentNum" label="设备总数" align="center" sortable width="100">

  159.         </el-table-column>

  160. 

  161.         <el-table-column prop="area" label="地区" align="center">

  162.           <template slot-scope="{ row }">

  163.             <el-tooltip class="item" effect="dark" :content="row.area" placement="top-start">

  164.               <span

  165.                 style="display: block;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{ row.area }}</span>

  166.             </el-tooltip>

  167.           </template>

  168.         </el-table-column>

  169. 

  170.         <el-table-column v-if="orgType != 2" prop="operationStaffName" label="运营人员" align="center">

  171.           <template slot-scope="{ row }">

  172.             <el-tooltip class="item" effect="dark" :content="row.operationStaffName" placement="top-start">

  173.               <span

  174.                 style="display: block;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{ row.operationStaffName }}</span>

  175.             </el-tooltip>

  176.           </template>

  177.         </el-table-column>

  178.         <el-table-column prop="onlineQuantity" label="在线设备" align="center" sortable width="100">

  179.         </el-table-column>

  180.         <el-table-column prop="noOnlineQuantity" label="离线设备" width="100" align="center" sortable>

  181.         </el-table-column>

  182.         <el-table-column prop="activeQuantity" label="活跃设备" align="center" sortable width="100">

  183.         </el-table-column>

  184.         <el-table-column prop="activeAccount" label="活跃顾问" align="center" sortable width="100">

  185.         </el-table-column>

  186.         <el-table-column prop="sumReception" label="接待量" align="center" sortable>

  187.         </el-table-column>

  188.         <!-- <el-table-column prop="sumActiveCustomer" label="有效接待" align="center" sortable width="110">

  189.         </el-table-column>

  190.         <el-table-column prop="noActiveCustomer" label="无效接待" align="center" sortable width="110">

  191.         </el-table-column> -->

  192.         <el-table-column prop="sumRecordTime" label="接待时长" align="center" sortable width="100">

  193.         </el-table-column>

  194. 

  195.         <el-table-column prop="sumProhibitedQuantity" label="违禁次数" width="100" align="center" sortable>

  196.         </el-table-column>

  197.         <el-table-column label="操作" align="center" fixed="right" width="100">

  198.           <template slot-scope="{ row }">

  199.             <el-button type="text" v-if="cus_build_area_record" @click="goEquiment(row)">设备使用统计</el-button>

  200.           </template>

  201.         </el-table-column>

  202.       </el-table>

  203. 

  204.       <el-table :header-cell-style="{ background: '#F5F7FA', color: '#333333' }" v-if="activeTotal == 2" :data="tableData"

  205.         stripe style="width: 100%" height="640">

  206.         <el-table-column prop="orgName" label="公司名称" align="center">

  207.         </el-table-column>

  208.         <el-table-column prop="houseQuantityOfEnough" label="服务期内项目" align="center" width="140">

  209.         </el-table-column>

  210.         <el-table-column prop="avgExacutiveRate" label="平均执行率" align="center" width="110" sortable>

  211.           <template slot-scope="{ row }">

  212.             {{ row.avgExacutiveRate || 0 }}%

  213.           </template>

  214.         </el-table-column>

  215.         <!-- <el-table-column prop="axExacutiveRate" label="最高执行率" align="center" sortable width="110">

  216.         </el-table-column>

  217.         <el-table-column prop="noMarkAdviserCount" label="未标顾问" align="center" sortable width="110">

  218.         </el-table-column> -->

  219.         <el-table-column prop="onlineQuantity" label="在线设备" align="center" sortable width="110">

  220.         </el-table-column>

  221.         <el-table-column prop="area" label="地区" align="center">

  222.         </el-table-column>

  223.         <el-table-column prop="operationStaffName" label="运营人员" align="center">

  224.         </el-table-column>

  225.         <el-table-column prop="equipmentNum" label="设备总数" align="center" sortable width="110">

  226.         </el-table-column>

  227.         <el-table-column prop="noOnlineQuantity" label="离线设备" width="100" align="center" sortable>

  228.         </el-table-column>

  229.         <el-table-column prop="activeQuantity" label="活跃设备" align="center" sortable width="110">

  230.         </el-table-column>

  231.         <el-table-column prop="activeAccount" label="活跃顾问" align="center" sortable width="110">

  232.         </el-table-column>

  233.         <el-table-column prop="sumReception" label="接待量" align="center" sortable width="110">

  234.         </el-table-column>

  235.         <!-- <el-table-column prop="sumActiveCustomer" label="有效接待" align="center" sortable width="110">

  236.         </el-table-column>

  237.         <el-table-column prop="noActiveCustomer" label="无效接待" align="center" sortable width="110">

  238.         </el-table-column> -->

  239.         <el-table-column prop="sumRecordTime" label="接待时长" align="center" sortable width="110">

  240.         </el-table-column>

  241. 

  242.         <el-table-column prop="sumProhibitedQuantity" label="违禁次数" align="center" sortable width="110">

  243.         </el-table-column>

  244.         <el-table-column label="操作" align="center" fixed="right" width="100">

  245.           <template slot-scope="{ row }">

  246.             <el-button type="text" @click="goDetail(row, 2)">查看详情</el-button>

  247.           </template>

  248.         </el-table-column>

  249.       </el-table>

  250. 

  251.       <el-table :header-cell-style="{ background: '#F5F7FA', color: '#333333' }" v-if="activeTotal == 1" :data="tableData"

  252.         stripe style="width: 100%" height="640">

  253.         <el-table-column prop="agentName" label="代理商名称" align="center">

  254.         </el-table-column>

  255.         <el-table-column prop="area" label="地区" align="center">

  256.         </el-table-column>

  257.         <el-table-column prop="avgExacutiveRate" label="平均执行率" align="center" width="140" sortable>

  258.           <template slot-scope="{ row }">

  259.             {{ row.avgExacutiveRate || 0 }}%

  260.           </template>

  261.         </el-table-column>

  262.         <!-- <el-table-column prop="axExacutiveRate" label="最高执行率" align="center" sortable width="110">

  263.         </el-table-column>

  264.         <el-table-column prop="noMarkAdviserCount" label="未标顾问" align="center" sortable width="110">

  265.         </el-table-column> -->

  266.         <el-table-column prop="operationStaffName" label="运营人员" align="center">

  267.         </el-table-column>

  268.         <el-table-column prop="houseQuantityOfEnough" label="服务期内项目" align="center" width="150" sortable>

  269.         </el-table-column>

  270.         <el-table-column prop="sumReception" label="接待量" align="center" sortable width="110">

  271.         </el-table-column>

  272.         <!-- <el-table-column prop="sumActiveCustomer" label="有效接待" align="center" sortable width="110">

  273.         </el-table-column>

  274.         <el-table-column prop="noActiveCustomer" label="无效接待" align="center" sortable width="110">

  275.         </el-table-column> -->

  276.         <el-table-column prop="equipmentNum" label="设备总数" align="center" sortable width="110">

  277.         </el-table-column>

  278.         <el-table-column prop="sumRecordTime" label="接待时长" align="center" sortable width="110">

  279.         </el-table-column>

  280. 

  281.         <el-table-column prop="sumProhibitedQuantity" label="违禁次数" align="center" width="110" sortable>

  282.         </el-table-column>

  283.         <el-table-column label="操作" align="center" fixed="right" width="100">

  284.           <template slot-scope="{ row }">

  285.             <el-button type="text" @click="goDetail(row, 1)">查看详情</el-button>

  286.           </template>

  287.         </el-table-column>

  288.       </el-table>

  289.       <div style="display: flex; justify-content: flex-end; margin-top: 10px">

  290.         <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"

  291.           :page-sizes="[10, 30, 50]" :page-size="size" layout="total, sizes, prev, pager, next, jumper" :total="total">

  292.         </el-pagination>

  293.       </div>

  294.     </div>

  295.   </div>

  296. </template>

  297. 

  298. <script>

  299. import { mapGetters } from "vuex";

  300. import { getAreaList } from "@/api/modules/api";

  301. export default {

  302.   data() {

  303.     return {

  304.       props: {

  305.         lazy: true,

  306.         checkStrictly: true,

  307.         expandTrigger: "hover",

  308.         async lazyLoad(node, resolve) {

  309.           const { level } = node;

  310.           if (level == 0) {

  311.             // console.log(23);

  312.             const { data } = await getAreaList({ parentId: 0 }); //获取省接口

  313.             var nodes = data.map((item) => {

  314.               return {

  315.                 value: item.id,

  316.                 label: item.name,

  317.                 leaf: false,

  318.               };

  319.             });

  320.             resolve(nodes);

  321.           } else if (level == 1) {

  322.             const { data } = await getAreaList({ parentId: node.data.value }); //获取市接口

  323.             var nodes = data.map((item) => {

  324.               return {

  325.                 value: item.id,

  326.                 label: item.name,

  327.                 leaf: true,

  328.               };

  329.             });

  330.             resolve(nodes);

  331.           } else {

  332.             resolve();

  333.           }

  334.         },

  335.       },

  336.       activeTotal: "0",

  337.       provice: [],

  338.       value: "",

  339.       input: "",

  340.       tableData: [],

  341.       multipleSelection: [],

  342.       changeValue: "",

  343.       dialogVisible: false,

  344.       houseList: [],

  345.       time: [],

  346.       orgType: localStorage.getItem("orgType"),

  347.       searchForm: {

  348.         propertyName: "",

  349.         provinceId: "",

  350.         cityId: "",

  351.         orgName: "",

  352.         agentName: "",

  353.         userName: "",

  354.         dateType: "4",

  355.         startDate: "",

  356.         endDate: "",

  357.         operationStaffId: "",

  358.       },

  359.       currentPage: 1,

  360.       selflag: "1",

  361.       size: 30,

  362.       total: 10,

  363.       operaList: [],

  364.     };

  365.   },

  366.   computed: {

  367.     ...mapGetters(["permissions"]),

  368.   },

  369.   created() {

  370.     this.cus_build_area_record = this.permissions["cus_build_area_record"];

  371.     this.cus_build_count_download =

  372.       this.permissions["cus_build_count_download"];

  373.   },

  374.   mounted() {

  375.     if (this.orgType == 1) {

  376.       this.selflag = "3";

  377.     }

  378.     // 获取项目列表

  379.     this.tabtimetap(4);

  380.     this.getOperaList();

  381.     this.houseStatistics();

  382.   },

  383.   methods: {

  384.     downLoad() {

  385.       let obj = {

  386.         ...this.searchForm,

  387.         agentId: localStorage.getItem("agentId"),

  388.         orgCode: localStorage.getItem("orgCode"),

  389.         houseId: localStorage.getItem("houseId"),

  390.         orgType: localStorage.getItem("orgType"),

  391.       };

  392.       if (this.activeTotal == 0) {

  393.         if (this.orgType == 0) {

  394.           obj.operationType = 1;

  395.         } else if (this.orgType == 1) {

  396.           obj.operationType = 2;

  397.         } else {

  398.           obj.operationType = null;

  399.         }

  400.         // 项目

  401.         this.exportMethodPost(

  402.           "/autoSR/cusStageStatistics/houseStatisticsExport",

  403.           "项目数据",

  404.           obj

  405.         );

  406.       } else if (this.activeTotal == 1) {

  407.         obj.operationType = null;

  408.         // 代理商

  409.         this.exportMethodPost(

  410.           "/autoSR/cusStageStatistics/agentStatisticsExport",

  411.           "代理商",

  412.           obj

  413.         );

  414.       } else {

  415.         if (this.orgType == 0) {

  416.           obj.operationType = 1;

  417.         } else if (this.orgType == 1) {

  418.           obj.operationType = 2;

  419.         } else {

  420.           obj.operationType = null;

  421.         }

  422.         this.exportMethodPost(

  423.           "/autoSR/cusStageStatistics/companyStatisticsExport",

  424.           "公司",

  425.           obj

  426.         );

  427.       }

  428.     },

  429.     // 导出.Excel公用方法

  430.     exportMethodPost(url, name, data = {}) {

  431.       axios({

  432.         method: "get",

  433.         url: url,

  434.         params: data,

  435.         responseType: "blob",

  436.       })

  437.         .then((res) => {

  438.           let blob = new Blob([res], { type: "application/vnd.ms-excel" });

  439.           let date = new Date();

  440.           let time = date.toLocaleDateString();

  441.           // console.log(time, "时间");

  442.           if ("download" in document.createElement("a")) {

  443.             const link = document.createElement("a");

  444.             link.style.display = "none";

  445.             link.href = URL.createObjectURL(blob);

  446.             // link.download = res.headers['content-disposition'] //下载后文件名

  447.             link.download = (name || "导出文件") + time + ".xlsx"; //下载的文件名

  448.             document.body.appendChild(link);

  449.             link.click();

  450.             document.body.removeChild(link);

  451.           } else {

  452.             // console.log("--------------------jingla")

  453.             let fileName = (name || "导出文件") + time + ".xlsx"; //下载的文件名

  454.             navigator.msSaveBlob(blob, fileName);

  455.           }

  456.         })

  457.         .catch((error) => {

  458.           // Message.error({

  459.           //     message: '网络连接错误'

  460.           //  })

  461.           console.log(error);

  462.         });

  463.     },

  464.     getOperaList() {

  465.       if (this.orgType == 1) {

  466.         this.$api.http

  467.           .getAllOperationsStaffByAgent({

  468.             agentId: localStorage.getItem("agentId"),

  469.           })

  470.           .then((res) => {

  471.             this.operaList = res.data;

  472.           });

  473.       } else {

  474.         this.$api.http.getAllOperationsStaff().then((res) => {

  475.           this.operaList = res.data;

  476.         });

  477.       }

  478.     },

  479.     selectChange(e) {

  480.       this.searchForm.equipImei = "";

  481.       this.searchForm.userName = "";

  482.       if (!e) retun;

  483.       if (this.selflag == 1) {

  484.         this.searchForm.orgName = e;

  485.       }

  486.       if (this.selflag == 2) {

  487.         this.searchForm.agentName = e;

  488.       }

  489.       if (this.selflag == 3) {

  490.         this.searchForm.propertyName = e;

  491.       }

  492.     },

  493.     goEquiment(row) {

  494.       console.log(row);

  495.       this.$router.push({

  496.         path: "/Equipment/equipmentDetailList",

  497.         query: {

  498.           houseId: row.id,

  499.           startDate: this.searchForm.startDate,

  500.           endDate: this.searchForm.endDate,

  501.           timeType: this.searchForm.dateType,

  502.         },

  503.       });

  504.     },

  505.     goDetail(row, i) {

  506.       this.activeTotal = 0;

  507.       console.log(row);

  508.       if (i == 1) {

  509.         // 代理商

  510.         this.selflag = "2";

  511.         this.changeValue = row.agentName;

  512.         this.searchForm.agentName = row.agentName;

  513.         this.houseStatistics();

  514.       } else {

  515.         // 公司

  516.         this.selflag = "1";

  517.         this.changeValue = row.orgName;

  518.         this.searchForm.orgName = row.orgName;

  519.         this.houseStatistics();

  520.       }

  521.     },

  522.     tapclickyab(i) {

  523.       this.activeTotal = i;

  524.       if (this.orgType == 0) {

  525.         if (i == 1) {

  526.           this.selflag = "2";

  527.         } else if (i == 2) {

  528.           this.selflag = "1";

  529.         }

  530.       } else if (this.orgType == 1) {

  531.         if (i == 2) {

  532.           this.selflag = "1";

  533.         }

  534.       }

  535.       this.clascreen();

  536.       // this.houseStatistics();

  537.     },

  538.     timeChange(e) {

  539.       this.searchForm.dateType = null;

  540.       this.searchForm.startDate = e[0];

  541.       this.searchForm.endDate = e[1];

  542.       this.houseStatistics();

  543.     },

  544.     tabtimetap(idx) {

  545.       this.searchForm.startDate = "";

  546.       this.searchForm.endDate = "";

  547.       this.searchForm.dateType = idx;

  548.       this.time = [];

  549.       this.houseStatistics();

  550.     },

  551.     locationsChange(e) {

  552.       console.log(e);

  553.       if (!e) return;

  554.       this.searchForm.provinceId = e[0];

  555.       this.searchForm.cityId = e[1];

  556.     },

  557.     selChange() {

  558.       this.changeValue = "";

  559.       this.searchForm.agentName = "";

  560.       this.searchForm.userName = "";

  561.       this.searchForm.orgName = "";

  562.     },

  563.     screen() {

  564.       this.currentPage = 1;

  565.       console.log(this.searchForm);

  566.       this.houseStatistics();

  567.     },

  568.     clascreen() {

  569.       this.time = [];

  570.       this.provice = [];

  571.       this.changeValue = "";

  572.       this.searchForm = {

  573.         propertyName: "",

  574.         provinceId: "",

  575.         cityId: "",

  576.         orgName: "",

  577.         agentName: "",

  578.         userName: "",

  579.         dateType: "4",

  580.         startDate: "",

  581.         endDate: "",

  582.       };

  583.       this.currentPage = 1;

  584.       this.houseStatistics();

  585.     },

  586.     houseStatistics() {

  587.       let obj = {

  588.         current: this.currentPage,

  589.         size: this.size,

  590.         ...this.searchForm,

  591.         agentId: localStorage.getItem("agentId"),

  592.         orgCode: localStorage.getItem("orgCode"),

  593.         houseId: localStorage.getItem("houseId"),

  594.         orgType: localStorage.getItem("orgType"),

  595.       };

  596.       if (this.activeTotal == 0) {

  597.         if (this.orgType == 0) {

  598.           obj.operationType = 1;

  599.         } else if (this.orgType == 1) {

  600.           obj.operationType = 2;

  601.         } else {

  602.           obj.operationType = null;

  603.         }

  604.         // 项目

  605.         this.$api.api.houseStatistics1(obj).then((res) => {

  606.           // console.log(res);

  607.           this.tableData = res.data.records;

  608.           this.total = res.data.total;

  609.         });

  610.       } else if (this.activeTotal == 1) {

  611.         obj.operationType = null;

  612.         // 代理商

  613.         this.$api.api.agentStatistics(obj).then((res) => {

  614.           // console.log(res);

  615.           this.tableData = res.data.records;

  616.           this.total = res.data.total;

  617.         });

  618.       } else {

  619.         if (this.orgType == 0) {

  620.           obj.operationType = 1;

  621.         } else if (this.orgType == 1) {

  622.           obj.operationType = 2;

  623.         } else {

  624.           obj.operationType = null;

  625.         }

  626.         // 公司

  627.         this.$api.api.companyStatistics(obj).then((res) => {

  628.           // console.log(res);

  629.           this.tableData = res.data.records;

  630.           this.total = res.data.total;

  631.         });

  632.       }

  633.     },

  634.     handleSelectionChange(val) {

  635.       this.multipleSelection = val;

  636.     },

  637.     handleSizeChange(val) {

  638.       console.log(`每页 ${val} 条`);

  639.       this.size = val;

  640.       this.houseStatistics();

  641.     },

  642.     handleCurrentChange(val) {

  643.       console.log(`当前页: ${val}`);

  644.       this.currentPage = val;

  645.       this.houseStatistics();

  646.     },

  647.   },

  648. };

  649. </script>

  650. 

  651. <style scoped="scoped" lang="scss" >

  652. .box-center {

  653.   width: 100%;

  654.   padding: 15px;

  655.   min-width: 1000px;

  656.   padding-bottom: 100px;

  657. }

  658. 

  659. .toptab {

  660.   width: 100%;

  661.   display: flex;

  662.   margin-bottom: 20px;

  663. }

  664. 

  665. .toptab div {

  666.   padding-left: 30px;

  667.   padding-right: 30px;

  668.   padding-top: 10px;

  669.   padding-bottom: 10px;

  670.   font-size: 14px;

  671. }

  672. 

  673. .activecllasscet {

  674.   color: #ffffff;

  675. }

  676. 

  677. .cen-tab {

  678.   width: 100%;

  679.   padding: 15px;

  680.   background: #ffffff;

  681.   margin-top: 15px;

  682. }

  683. 

  684. .tophove {

  685.   color: #ffffff;

  686.   background: #2671e2;

  687. }

  688. 

  689. .app-top {

  690.   width: 100%;

  691.   background: #ffffff;

  692.   box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);

  693.   border-radius: 4px;

  694.   padding-top: 15px;

  695.   padding-bottom: 15px;

  696. 

  697.   .app-titel {

  698.     width: 100%;

  699.     display: flex;

  700.     align-items: center;

  701.     flex-wrap: wrap;

  702. 

  703.     .label {

  704.       font-size: 14px;

  705.       font-weight: 400;

  706.       color: #32363d;

  707.       line-height: 32px;

  708.       margin-left: 15px;

  709.       // min-width: 100px;

  710.     }

  711. 

  712.     .toptimeqhuan {

  713.       height: 30px;

  714.       background: #ffffff;

  715.       display: flex;

  716.       align-items: center;

  717.     }

  718. 

  719.     .toptimeqhuan div {

  720.       padding-left: 20px;

  721.       padding-right: 20px;

  722.       text-align: center;

  723.       line-height: 30px;

  724.       font-size: 14px;

  725.       margin-right: 15px;

  726.       border-radius: 4px;

  727.       border: 1px solid #e0e0e0;

  728.     }

  729.   }

  730. }

  731. 

  732. .div-lab {

  733.   display: flex;

  734.   margin: 5px;

  735. }

  736. 

  737. .div-inp {

  738.   width: 250px;

  739. }

  740. 

  741. /deep/ .el-table__header-wrapper {

  742.   thead {

  743.     tr {

  744.       th {

  745.         background: #F5F7FA;

  746.         color: #333333;

  747.       }

  748.     }

  749.   }

  750. }

  751. 

  752. /deep/ .el-button--primary {

  753.   background: #2671E2 !important;

  754.   border: 1px solid #2671E2 !important;

  755. }

  756. 

  757. /deep/ .el-button--text {

  758.   color: #2671E2;

  759. }

  760. </style>