团组信息

src/components/OP/Groupedit.vue

@@ -1,14 +1,117 @@
 <template>
     <div>
-        bianjian
+        <div class="groupedit">
+            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+                <el-form-item label="活销售报价号" prop="name">
+                  <el-input v-model="ruleForm.name"></el-input>
+                </el-form-item>
+                <el-form-item label="本团成单人" prop="region">
+                  <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
+                    <el-option label="区域一" value="shanghai"></el-option>
+                    <el-option label="区域二" value="beijing"></el-option>
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="本团成单人" prop="region">
+                    <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
+                      <el-option label="区域一" value="shanghai"></el-option>
+                      <el-option label="区域二" value="beijing"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="本团成单人" prop="region">
+                    <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
+                      <el-option label="区域一" value="shanghai"></el-option>
+                      <el-option label="区域二" value="beijing"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="即时配送" prop="delivery">
+                  <el-switch v-model="ruleForm.delivery"></el-switch>
+                </el-form-item>
+                <el-form-item label="活动性质" prop="type">
+                  <el-checkbox-group v-model="ruleForm.type">
+                    <el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox>
+                    <el-checkbox label="地推活动" name="type"></el-checkbox>
+                    <el-checkbox label="线下主题活动" name="type"></el-checkbox>
+                    <el-checkbox label="单纯品牌曝光" name="type"></el-checkbox>
+                  </el-checkbox-group>
+                </el-form-item>
+                <el-form-item label="特殊资源" prop="resource">
+                  <el-radio-group v-model="ruleForm.resource">
+                    <el-radio label="线上品牌商赞助"></el-radio>
+                    <el-radio label="线下场地免费"></el-radio>
+                  </el-radio-group>
+                </el-form-item>
+                <el-form-item label="活动形式" prop="desc">
+                  <el-input type="textarea" v-model="ruleForm.desc"></el-input>
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
+                  <el-button @click="resetForm('ruleForm')">重置</el-button>
+                </el-form-item>
+              </el-form>
+        </div>
     </div>
 </template>
 
 <script>
 export default {
-    
+    data() {
+      return {
+        ruleForm: {
+          name: '',
+          region: '',
+          date1: '',
+          date2: '',
+          delivery: false,
+          type: [],
+          resource: '',
+          desc: ''
+        },
+        rules: {
+          name: [
+            { required: true, message: '请输入活动名称', trigger: 'blur' },
+            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
+          ],
+          region: [
+            { required: true, message: '请选择活动区域', trigger: 'change' }
+          ],
+          date1: [
+            { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
+          ],
+          date2: [
+            { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
+          ],
+          type: [
+            { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
+          ],
+          resource: [
+            { required: true, message: '请选择活动资源', trigger: 'change' }
+          ],
+          desc: [
+            { required: true, message: '请填写活动形式', trigger: 'blur' }
+          ]
+        }
+      };
+    },methods: {
+      submitForm(formName) {
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            alert('submit!');
+          } else {
+            console.log('error submit!!');
+            return false;
+          }
+        });
+      },
+      resetForm(formName) {
+        this.$refs[formName].resetFields();
+      }
+    }
 }
 </script>
 <style>
-
+    .groupedit{
+        background-color: #fff;
+        border-radius: 10px;
+        padding: 20px 0;
+    }
 </style>>

src/components/OP/OPgroup.vue

@@ -1,21 +1,30 @@
 <template>
     <div>
-        <div class="communal-list">
-            <div class="communal-title">
-                <div>员工列表</div>
-                <div class="communal-box">
+        <div class="group-list">
+            <div class="group-title">
+                <div>团组列表</div>
+                <div class="group-box">
+                    <el-select v-model="value" clearable placeholder="请选择" @change="filterStatus(value)">
+                        <el-option
+                        v-for="item in options"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                        </el-option>
+                    </el-select>
                     <el-input
-                        @input="Inquireclick()"
-                        placeholder="请输入内容"
-                        v-model="input"
-                        clearable>
+                    style="width:200px;"
+                    @input="Inquireclick()"
+                    placeholder="请输入查询内容"
+                    v-model="input"
+                    clearable>
                     </el-input>
                     <el-button @click="Inquireclick()" type="primary"><i class="icon-sousuo"></i></el-button>
                 </div>
             </div>
             <template>
                 <el-table
-                :data="tableDatas.slice((currentPage-1)*pageSize,currentPage*pageSize)"
+                :data="groupDatas.slice((currentPage-1)*pageSize,currentPage*pageSize)"
                 border
                 style="width: 100%">
                     <el-table-column
@@ -27,64 +36,72 @@
                         </template>
                     </el-table-column>
                     <el-table-column
-                        prop="number"
+                        prop="tourCode"
                         width="100"
                         label="团 号">
                     </el-table-column>
                     <el-table-column
                         width="100" 
-                        prop="cnName"
+                        prop="salesQuoteNo"
                         label="销售报价号">
                     </el-table-column>
                     <el-table-column
-                        prop="companyName"
+                        prop="teamType"
+                        label="团组类型"
+                        width="150">
+                    </el-table-column>
+                    <el-table-column
+                        prop="teamLev"
                         label="级 别"
-                        width="220">
+                        width="80">
                     </el-table-column>
                     <el-table-column
-                        prop="jobName"
+                        prop="teamName"
                         label="团队名称"
                         width="200">
                     </el-table-column>
                     <el-table-column
-                        prop="ext"
+                        prop="clientName"
                         label="客户名称"
                         width="100">
                     </el-table-column>
                     <el-table-column
-                        prop="phone"
+                        prop="clientUnit"
                         label="客户单位"
                         width="200">
                     </el-table-column>
                     <el-table-column
-                        prop="urgentPhone"
-                        label="团组类型"
-                        width="200">
-                    </el-table-column>
-                    <el-table-column
-                        prop="email"
-                        label="出访时间">
-                    </el-table-column>
-                    <el-table-column
-                        prop="email"
-                        label="出访天数">
-                    </el-table-column>
-                    <el-table-column
-                        prop="email"
-                        label="出访人数">
+                        prop="visitDate"
+                        :formatter="filteryear"
+                        label="出访时间"
+                        width="100">
                     </el-table-column>
                     <el-table-column
-                        prop="email"
-                        label="接团操作人">
+                        prop="visitDays"
+                        label="出访天数"
+                        width="80">
                     </el-table-column>
                     <el-table-column
-                        prop="email"
-                        label="投诉状况">
+                        prop="visitPNumber"
+                        label="出访人数"
+                        width="80">
                     </el-table-column>
                     <el-table-column
-                        prop="email"
-                        label="操 作">
+                        prop="jietuanOperator"
+                        label="接团操作人"
+                        width="110">
                     </el-table-column>
+                    <el-table-column label="操作">
+                        <template slot-scope="scope">
+                          <el-button
+                            size="mini"
+                            @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+                          <el-button
+                            size="mini"
+                            type="danger"
+                            @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+                        </template>
+                      </el-table-column>
                 </el-table>
             </template>
             <div class="block">
@@ -92,10 +109,10 @@
                     @size-change="handleSizeChange" 
                     @current-change="handleCurrentChange"
                     :current-page="currentPage" 
-                    :page-sizes="[10,15,20]" 
+                    :page-sizes="[10,12,15,20]" 
                     :page-size="pageSize" 
                     layout="total, sizes, prev, pager, next" 
-                    :total="tableDatas.length">
+                    :total="groupDatas.length">
                 </el-pagination>
             </div>
         </div>
@@ -106,12 +123,26 @@ import { co, el } from '@fullcalendar/core/internal-common';
 export default {
     data() {
         return {
-            tableDatas:[],
-            tableData: [
+            options: [
+                {
+                    value: '0',
+                    label: '全部'
+                }, {
+                    value: '1',
+                    label: '已完成'
+                }, {
+                    value: '2',
+                    label: '未完成'
+                }
+            ],
+            value: '0',
+            groupDatas:[],
+            groupData: [
                 
             ],
+            groupDatass:[],
             currentPage: 1, // 当前页码
-            pageSize: 15 ,// 每页的数据条数
+            pageSize: 12 ,// 每页的数据条数
             input:'',
             token:''
         }
@@ -127,41 +158,50 @@ export default {
             this.currentPage = val;
         },
         Inquireclick(){
+            console.log(this.groupDatass)
             var newarr=[];
             if(this.input==""){
-                newarr=this.tableData;
+                if(this.value=="0"){
+                    console.log(123)
+                    newarr=this.groupData;
+                }else{
+                    newarr=this.groupDatass;
+                }
             }else{
-                for(var i=0;i<this.tableData.length;i++){
-                    if(this.tableData[i].number.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                for(var i=0;i<this.groupDatas.length;i++){
+                    if(this.groupDatas[i].clientName.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].cnName.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].clientUnit.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].jobName.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].jietuanOperator.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].companyName.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].salesQuoteNo.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].ext.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].teamLev.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].phone.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].teamName.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].urgentPhone.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].teamType.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
-                    else if(this.tableData[i].email.indexOf(this.input)!=-1){
-                        newarr.push(this.tableData[i]);
+                    else if(this.groupDatas[i].tourCode.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
+                    }else if(this.groupDatas[i].visitDate.indexOf(this.input)!=-1){
+                        newarr.push(this.groupDatas[i]);
                     }
                 }
             }
-            this.tableDatas=newarr;
+            this.groupDatas=newarr;
         },
-        Getemployees(){
-            var url="/api/System/GetUserList"
+        //
+        Grouplist(){
+            var url="/api/Group"
             var that=this
             this.$axios({
                 method: 'post',
@@ -173,71 +213,123 @@ export default {
                     portType: 1,
                 }
             }).then(function(res){
-                console.log(res)
                 if(res.data.code==200){
-                    that.tableData=res.data.data
-                    that.tableData.forEach(item=>{
-                        if(item.cnName==null){
-                            item.cnName = ''
+                    that.groupData=res.data.data
+                    that.groupData.forEach(item=>{
+                        if(item.clientName==null){
+                            item.clientName = ''
                         } 
-                        if(item.companyId==null){
-                            item.companyId = ''
+                        if(item.clientUnit==null){
+                            item.clientUnit = ''
                         } 
-                        if(item.companyName==null){
-                            item.companyName = ''
+                        if(item.id==null){
+                            item.id = ''
                         } 
-                        if(item.depId==null){
-                            item.depId = ''
+                        if(item.isSure==null){
+                            item.isSure = ''
                         } 
-                        if(item.depName==null){
-                            item.depName = ''
+                        if(item.jietuanOperator==null){
+                            item.jietuanOperator = ''
                         } 
-                        if(item.email==null){
-                            item.email = ''
+                        if(item.salesQuoteNo==null){
+                            item.salesQuoteNo = ''
                         } 
-                        if(item.ext==null){
-                            item.ext = ''
+                        if(item.teamName==null){
+                            item.teamName = ''
                         } 
-                        if(item.id==null){
-                            item.id = ''
+                        if(item.teamType==null){
+                            item.teamType = ''
                         } 
-                        if(item.jobName==null){
-                            item.jobName = ''
+                        if(item.tourCode==null){
+                            item.tourCode = ''
                         } 
-                        if(item.jobPostId==null){
-                            item.jobPostId = ''
+                        if(item.visitDate==null){
+                            item.visitDate = ''
                         } 
-                        if(item.number==null){
-                            item.number = ''
+                        if(item.visitDays==null){
+                            item.visitDays = ''
                         } 
-                        if(item.phone==null){
-                            item.phone = ''
+                        if(item.visitPNumber==null){
+                            item.visitPNumber = ''
                         } 
-                        if(item.urgentPhone==null){
-                            item.urgentPhone = ''
-                        }
                     })
-                    that.tableDatas=that.tableData;
-                    console.log(that.tableDatas)
+                    that.groupDatas=that.groupData;
+                    console.log(that.groupData)
                 }
             })
+        },
+        filteryear(val){
+            let gstime=val.visitDate.split('T')[0]
+            return gstime;
+        },
+        //筛选状态
+        filterStatus(val){
+            console.log(val)
+            var newgroup=[];
+            if(this.input==""){
+                if(val=="0"||val==""){
+                    newgroup=this.groupData;
+                }else if(val=="1"){
+                    for(var j=0;j<this.groupData.length;j++){
+                        if(this.groupData[j].isSure==1){
+                            newgroup.push(this.groupData[j])
+                        }
+                    }
+                }else if(val=="2"){
+                    for(var j=0;j<this.groupData.length;j++){
+                        if(this.groupData[j].isSure==0){
+                            newgroup.push(this.groupData[j])
+                        }
+                    }
+                }
+                this.groupDatas=newgroup
+                this.groupDatass=newgroup 
+            }else{
+                if(val=="0"||val==""){
+                    newgroup=this.groupData
+                }else if(val=="1"){
+                    for(var j=0;j<this.groupData.length;j++){
+                        if(this.groupData[j].isSure==1){
+                            newgroup.push(this.groupData[j])
+                        }
+                    }
+                }else if(val=="2"){
+                    for(var j=0;j<this.groupData.length;j++){
+                        if(this.groupData[j].isSure==0){
+                            newgroup.push(this.groupData[j])
+                        }
+                    }
+                }
+                this.groupDatas=newgroup
+                this.groupDatass=newgroup 
+                this.Inquireclick()
+            }
+        },
+        //编辑
+        handleEdit(index, row) {
+            console.log(index, row.id);
+        },
+        //删除
+        handleDelete(index, row) {
+            console.log(index, row.id);
         }
     },
     mounted(){
         this.token=JSON.parse(localStorage.getItem('userinif')).token;
         console.log(this.token)
-        this.Getemployees();
+        this.Grouplist();
     }
 }
 </script>
 <style>
-    .communal-list{
+    .group-list{
         background-color: #fff;
         padding: 10px;
         box-shadow: 0 0 5px #0005;
         border-radius: 10px;
+        min-width: 1525px;
     }
-    .communal-title{
+    .group-title{
         display: flex;
         font-size: 17px;
         font-weight:600 ;
@@ -247,11 +339,17 @@ export default {
         justify-content: space-between;
         align-items: center;
     }
-    .communal-box{
+    .group-box{
         display: flex;
     }
-    .communal-box>button{
+    .group-box>button{
         margin-left: 10px;
         padding: 8px 20px;
     }
+    .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
+        text-align: center;
+    }
+    .group-box>.el-input{
+        margin-left: 10px;
+    }
 </style>