init

src/page/wel.vue

@@ -1,5 +1,26 @@
 <template>
   <div class="box-center">
+        <div class="app-titel">
+          <div class="titel-text">时间</div>
+          <div class="toptimeqhuan">
+            <div :class="{ tophove: TimetoAhoose == 0 }" @click="tabtimetap(0)">近7天</div>
+            <div :class="{ tophove: TimetoAhoose == 1 }" @click="tabtimetap(1)"> 近15天 </div>
+            <div :class="{ tophove: TimetoAhoose == 2 }" @click="tabtimetap(2)">  近30天 </div>
+          </div>
+          <div style="margin-left: 26px">
+            <el-date-picker
+              @change="confirmtime()"
+              v-model="customtime"
+              type="daterange"
+              range-separator="-"
+              :default-time="['00:00:00', '23:59:59']"
+              value-format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            >
+            </el-date-picker>
+        </div>
+      </div>
       <!-- 卡片部分 -->
       <div class="page-container">
           <div class="pagechen">
@@ -7,7 +28,7 @@
             <div class="pageboxtitle2">
               <div class="span1">5020</div>
               <div class="span2">
-                <span class="span2-1"> 昨日:288</span>
+                <span class="span2-1"> 环比:288</span>
                 <span class="span2-2">25%</span>
               </div>
             </div>
@@ -43,7 +64,7 @@
             <div class="pageboxtitle2">
                  <div class="span1">5020</div>
              <div class="span2">
-               <span class="span2-1"> 昨日:288</span>
+               <span class="span2-1"> 环比:288</span>
                <span class="span2-2">25%</span>
              </div>
             </div>
@@ -53,7 +74,7 @@
             <div class="pageboxtitle2">
                  <div class="span1">20</div>
              <div class="span2">
-               <span class="span2-1"> 昨日:288</span>
+               <span class="span2-1"> 环比:288</span>
                <span class="span2-2">25%</span>
              </div>
             </div>
@@ -63,7 +84,7 @@
             <div class="pageboxtitle2">
                  <div class="span1">50</div>
              <div class="span2">
-               <span class="span2-1"> 昨日:288</span>
+               <span class="span2-1"> 环比:288</span>
                <span class="span2-2">25%</span>
              </div>
             </div>
@@ -73,7 +94,7 @@
             <div class="pageboxtitle2">
                   <div class="span1">80</div>
              <div class="span2">
-               <span class="span2-1"> 昨日:288</span>
+               <span class="span2-1"> 环比:288</span>
                <span class="span2-2">25%</span>
              </div>
             </div>
@@ -85,41 +106,113 @@
             </div>
           </div>
       </div>
-      <!-- 列表部分 -->
-      <div class="table-box">
-        <div class="title">急需充电的工牌</div>
-        <div class="tabbox">
-           <el-table
-            :header-cell-style="{background:'#F2F4F5'}"
-            :data="tableData"
-            height="300"
-            style="width: 100%">
-            <el-table-column
-              prop="name"
-              label="顾问"
-              align="center">
-            </el-table-column>
 
-            <el-table-column
-              prop="num"
-              label="电话"
-              align="center">
-            </el-table-column>
 
-            <el-table-column
-              prop="address"
-              label="状态"
-              align="center">
-            </el-table-column>
+      <div class="app-box-san">
+        <div class="zuo">
+          <div class="title">
+            <div class="text1">违禁提醒</div>
+          </div>
+
+          <div class="tabbox">
+             <el-table
+                :header-cell-style="{background:'#F2F4F5'}"
+                :data="tableData"
+                height="320"
+                style="width: 100%">
+                <el-table-column
+                  prop="name"
+                  label="顾问"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="num"
+                  label="禁忌执行率"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="address"
+                  label="接待时间"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="date"
+                  label="操作"
+                  align="center">
+                    <template slot-scope="">
+                      <div style="color: #2671E2;">查看</div>
+                    </template>
+                </el-table-column>
+              </el-table>
+            </div>
 
-            <el-table-column
-              prop="date"
-              label="电量"
-              align="center">
-            </el-table-column>
-           </el-table>
         </div>
-      </div>
+        <div class="you">
+          <div class="title">
+            <div class="text1" @click="tabclick('1')" :class="{ colostyle: classatec == 1 }">低电工牌</div>
+            <div class="text1" @click="tabclick('2')" :class="{ colostyle: classatec == 2 }">离线工牌</div>
+          </div>
+            <div class="tabbox" v-if="classatec==1">
+              <el-table
+                :header-cell-style="{background:'#F2F4F5'}"
+                :data="tableData"
+                height="320"
+                style="width: 100%">
+                <el-table-column
+                  prop="name"
+                  label="顾问"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="num"
+                  label="电话"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="address"
+                  label="状态"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="date"
+                  label="电量"
+                  align="center">
+                </el-table-column>
+              </el-table>
+            </div>
+             <div class="tabbox" v-if="classatec==2">
+              <el-table
+                :header-cell-style="{background:'#F2F4F5'}"
+                :data="tableData"
+                height="320"
+                style="width: 100%">
+                <el-table-column
+                  prop="name"
+                  label="顾问"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="num"
+                  label="电话"
+                  align="center">
+                </el-table-column>
+
+                <el-table-column
+                  prop="address"
+                  label="离线时间"
+                  align="center">
+                </el-table-column>
+              </el-table>
+            </div>
+        </div>
+    </div>
   </div>
 </template>
 
@@ -128,6 +221,9 @@ export default {
   name: 'Wel',
   data() {
     return {
+      classatec:1,
+      customtime:[],
+      TimetoAhoose:0,
          tableData: [
            {
             date: '80%',
@@ -211,8 +307,15 @@ export default {
     }
   },
   methods: {
-
-
+      tabclick(i){
+        this.classatec=i;
+      },
+      tabtimetap(i){
+        this.TimetoAhoose=i
+      },
+      confirmtime() {
+        console.log(this.customtime)
+      },
   }
 }
 </script>
@@ -227,6 +330,7 @@ export default {
 .page-container{
   width: 100%;
   display: flex;
+  margin-top: 16px;
   .pagechen{
     flex: 1;
     min-width: 223px;
@@ -273,6 +377,9 @@ export default {
     }
   }
 }
+.colostyle{
+  color: red;
+}
 .table-box{
   width:98.8%;
   height: 400px;
@@ -287,7 +394,7 @@ export default {
     text-indent: 30px;
     font-weight: 500;
     color: #32363D;
-    border-bottom: 1px solid #E6E6E6;
+    // border-bottom: 1px solid #E6E6E6;
   }
   .tabbox{
     padding-left: 30px;
@@ -301,4 +408,86 @@ export default {
       margin-bottom: 0;
     }
   }
+
+
+  .app-box-san{
+  width: 100%;
+  height: 400px;
+  display: flex;
+  margin-top: 15px;
+  .zuo{
+    // flex: 1;
+    height: 100%;
+    margin-right: 15px;
+    background: #FFFFFF;
+    border-radius: 4px;
+    width: 48.7%;
+    .title{
+      width: 100%;
+      height: 55px;
+      // border-bottom: 1px solid #E0E0E0;
+      display: flex;
+      align-content: center;
+      .text1{
+          flex: 2;
+          line-height: 55px;
+          text-indent: 20px;
+          font-weight: 500;
+          font-size: 16px;
+      }
+    }
+  }
+  .you{
+    height: 100%;
+    width: 49%;
+    background: #FFFFFF;
+    border-radius: 4px;
+    .title{
+      width: 100%;
+      height: 55px;
+      // border-bottom: 1px solid #E0E0E0;
+      display: flex;
+      align-content: center;
+      .text1{
+          line-height: 55px;
+          text-indent: 20px;
+          font-weight: 500;
+          font-size: 16px;
+      }
+    }
+  }
+}
+
+.tophove {
+  color: #ffffff;
+  background: #2671e2;
+}
+.app-titel {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  .titel-text {
+    height: 100%;
+    font-size: 16px;
+    color: #32363d;
+  }
+  .toptimeqhuan {
+    width: 190px;
+    height: 32px;
+    background: #ffffff;
+    border-radius: 4px;
+    border: 1px solid #e0e0e0;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    margin-left: 20px;
+    cursor: pointer;
+  }
+  .toptimeqhuan div {
+    flex: 1;
+    text-align: center;
+    line-height: 32px;
+    font-size: 14px;
+  }
+}
 </style>

src/views/Customer/SalesStage.vue

@@ -0,0 +1,250 @@
+<template>
+
+  <div class="box-center">
+
+       <!-- 头 -->
+    <div class="app-top">
+       <div class="app-titel">
+        <div class="label" style="color: #32363D;font-weight: 400;font-size: 16px;">楼盘选择：</div>
+        <div>
+          <el-select v-model="value" placeholder="请选择">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div style="margin-left: 20px">
+          <el-button @click="infoadd()" style="background: #2671e2; color: #ffffff" >新增</el-button>
+        </div>
+
+      </div>
+    </div>
+    <!-- 表格 -->
+    <div class="cen-tab">
+
+        <el-table
+          :data="tableData"
+          stripe
+          style="width: 100%">
+          <el-table-column
+            prop="name"
+            label="楼盘名称"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="operatorName"
+            label="阶段名称"
+             align="center"
+           >
+          </el-table-column>
+          <el-table-column
+            prop="operationStaffName"
+            label="循序"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="address"
+            label="备注"
+             align="center"
+           >
+          </el-table-column>
+
+         <el-table-column label="操作" align="center">
+            <template slot-scope="scope">
+              <div style="color: #2671E2;" @click="infoeditor(scope.row)">编辑</div>
+              <div style="color: #2671E2;" @click="toinifodelete(scope)">删除</div>
+            </template>
+          </el-table-column>
+        </el-table>
+    </div>
+
+
+     <el-dialog title="新增阶段" :visible.sync="dialogVisible" >
+      <el-form :model="addagentobj" label-position="labelPosition" :rules="rules"  ref="addagentobj" label-width="140px" style="width:60%; margin: 0 auto;">
+
+           <el-form-item label="阶段名称：" prop="name">
+              <el-input v-model="addagentobj.name"></el-input>
+          </el-form-item>
+          <el-form-item label="顺序：" prop="contactPerson">
+              <el-input v-model="addagentobj.contactPerson"></el-input>
+          </el-form-item>
+          <el-form-item label="备注：">
+              <el-input v-model="addagentobj.contactNumber"></el-input>
+          </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" @click="add()">保存</el-button>
+      </div>
+  </el-dialog>
+
+
+
+
+
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      addagentobj:{
+        name:'',// 公司名称
+        contactPerson:'',// 联系人
+        contactNumber:'',// 联系人手机号
+      },
+      rules:{
+          name: [
+            { required: true, message: '请输入阶段名称：', trigger: 'blur' },
+          ],
+         contactPerson: [
+            { required: true, message: '请输入顺序', trigger: 'blur' },
+          ],
+      },
+      tableData:[],
+      dialogVisible:false,
+      options:[],
+      value:''
+
+    };
+  },
+  mounted() {
+
+  },
+  methods: {
+
+    //删除
+    toinifodelete(item){
+        this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+            this.$api.http.delOrg({id:item.row.id}).then((res) => {
+                 if(res.code==0){
+                     this.$message({
+                      type: 'success',
+                      message: '删除成功!'
+                    });
+                    this.Screeningofempty()
+                 }else{
+                    this.$message.error(res.message);
+                 }
+            })
+        }).catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除'
+          });
+        });
+    },
+
+      //新增
+    infoadd(){
+        this.dialogVisible=true;
+    },
+
+    //确认新增
+    add(){
+      this.$refs.addagentobj.validate((valid) => {
+          if (valid) {
+            this.addagentobj.pid=0;
+             this.$api.http.AddaddOrg(this.addagentobj).then((res) => {
+               if(res.code==0){
+                    this.dialogVisible=false;
+                    this.$refs.addagentobj.resetFields();
+                    this.Screeningofempty()
+                }else{
+                  this.$message.error(res.message);
+               }
+             });
+          } else {
+            return false;
+          }
+        });
+    },
+
+
+    // 获取列表
+    getcompanyList() {
+      this.tableData=[];
+      let parmest={
+          current: this.pageNum,
+          size: this.pageSize,
+          operatorName:this.operatorName,
+          operationStaffName:this.operationStaffName,
+          name:this.name,
+      }
+      this.$api.http.getcompanyList(parmest).then((res) => {
+          console.log(res.data);
+         this.tableData=res.data.records;
+          this.total=res.data.total
+        });
+    },
+
+  },
+};
+</script>
+
+<style scoped="scoped" lang="scss" >
+.box-center {
+  width: 100%;
+  padding: 15px;
+  min-width: 1200px;
+  padding-bottom: 100px;
+}
+.cen-tab{
+  width: 100%;
+  padding: 15px;
+  min-height: 400px;
+  background: #FFFFFF;
+  margin-top: 15px;
+}
+.tophove {
+  color: #ffffff;
+  background: #2671e2;
+}
+.app-top {
+  width: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  .app-titel {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    .label {
+      font-size: 14px;
+      font-weight: 400;
+      color: #32363d;
+      line-height: 14px;
+      margin-left: 15px;
+    }
+    .toptimeqhuan {
+      height: 30px;
+      background: #ffffff;
+      display: flex;
+      align-items: center;
+    }
+    .toptimeqhuan div {
+      padding-left: 20px;
+      padding-right: 20px;
+      text-align: center;
+      line-height: 30px;
+      font-size: 14px;
+      margin-right: 15px;
+      border-radius: 4px;
+      border: 1px solid #e0e0e0;
+    }
+  }
+}
+</style>

src/views/Receive/index.vue

@@ -4,8 +4,8 @@
       {{ currentAudioName || audioList[0].name }}
       <audio-player
         ref="audioPlayer"
-        :show-prev-button="false"
-        :show-next-button="false"
+        :show-prev-button="true"
+        :show-next-button="true"
         :audio-list="audioList.map((elm) => elm.url)"
         :before-play="handleBeforePlay"
         theme-color="#ff2929"
@@ -26,10 +26,10 @@ export default {
           name: "音频1",
           url: "https://static.quhouse.com/audio/d7879fbcdfcc436189ce79e643e0aeb8.mp3",
         },
-        // {
-        //   name: '音频2',
-        //   url: 'https://www.0dutv.com/upload/dance/20200316/C719452E3C7834080007662021EA968E.mp3'
-        // }
+        {
+          name: '音频2',
+          url: 'https://static.quhouse.com/record/dev/2021-09-26/1632648911706-56129.mp3'
+        }
       ],
     };
   },

vue.config.js

@@ -3,9 +3,9 @@
  * https://cli.vuejs.org/zh/config/
  */
 // const url = 'http://pigx-gateway'
-const url = 'http://39.97.167.65:9999' //测试
-// const url = 'http://192.168.31.160:9999' //长龙
-// const url = 'http://192.168.31.128:9999' //嘉豪
+// const url = 'http://39.97.167.65:9999' //测试
+const url = 'http://192.168.31.160:9999' //长龙
+// const url = 'http://192.168.31.127:9999' //嘉豪
 // const url = 'http://192.168.31.100:9999' //王笑
 
 const CompressionWebpackPlugin = require('compression-webpack-plugin')