瀏覽代碼

合并代码

朱鑫波 4 年之前
父節點
當前提交
881a77e3a8
共有 77 個文件被更改,包括 16359 次插入1841 次删除
  1. 5 0
      public/index.html
  2. 二進制
      public/noImg.png
  3. 1 1
      src/App.vue
  4. 21 0
      src/api/actor.js
  5. 7 0
      src/api/yard.js
  6. 二進制
      src/assets/noImg.png
  7. 二進制
      src/assets/success.png
  8. 二進制
      src/assets/touxiang.png
  9. 7 4
      src/components/ctop/ActorModal.vue
  10. 185 0
      src/components/ctop/propModal.vue
  11. 553 0
      src/components/ctop/vm-card-prop.vue
  12. 120 16
      src/components/ctop/vm-card.vue
  13. 21 9
      src/components/ctop/vm-image-list.vue
  14. 330 0
      src/components/formComponents/checkBoxGroup.vue
  15. 237 0
      src/components/formComponents/radioCheck.vue
  16. 376 0
      src/components/formComponents/selectGroup.vue
  17. 75 0
      src/components/formComponents/timeRange.vue
  18. 336 0
      src/components/formComponents/toutiaoTime.vue
  19. 46 34
      src/components/music-list/music-list.vue
  20. 9 2
      src/components/page/GlobalLayout.vue
  21. 237 216
      src/components/uploadFile.vue
  22. 6 3
      src/mixins/JeecgListMixin.js
  23. 2 2
      src/store/modules/app.js
  24. 342 0
      src/utils/Tools.js
  25. 1 1
      src/views/modules/BatchCreate/TouTiaoBatch.vue
  26. 21 13
      src/views/modules/Statistics/components/Treeselect.vue
  27. 3 4
      src/views/modules/Statistics/components/datePick.vue
  28. 186 52
      src/views/modules/Statistics/imageStatics/imageCostReport.vue
  29. 2 2
      src/views/modules/Statistics/mediaReport.vue
  30. 388 100
      src/views/modules/Statistics/newPlanStatic/newPlanStatic.vue
  31. 3 1
      src/views/modules/Statistics/videoStatics/TTvideoStatics.vue
  32. 21 6
      src/views/modules/actor/ActorList.vue
  33. 3 3
      src/views/modules/actor/modules/ActorModal.vue
  34. 88 14
      src/views/modules/advertiser/ProjectList.vue
  35. 113 58
      src/views/modules/advertiser/modules/projectListModal.vue
  36. 1 0
      src/views/modules/attendanceRecords/attendanceRecordsList.vue
  37. 120 43
      src/views/modules/autoRules/autoRulesList.vue
  38. 612 153
      src/views/modules/autoRules/newBlankRule.vue
  39. 1180 0
      src/views/modules/earlyWarningRules/configRules.vue
  40. 394 0
      src/views/modules/earlyWarningRules/index.vue
  41. 1487 0
      src/views/modules/earlyWarningRules/ruleModule.vue
  42. 594 0
      src/views/modules/earlyWarningRules/switchConfig.vue
  43. 468 0
      src/views/modules/earlyWarningRules/useRuleList.vue
  44. 2 1
      src/views/modules/kuaishouapp/account/copyGroup.vue
  45. 4 3
      src/views/modules/kuaishouapp/account/editGroup.vue
  46. 6 5
      src/views/modules/kuaishouapp/account/editGroupNew.vue
  47. 305 61
      src/views/modules/kuaishouapp/account/stepForm/Step3.vue
  48. 230 19
      src/views/modules/kuaishouapp/account/stepForm/Step4.vue
  49. 73 0
      src/views/modules/kuaishouapp/account/stepForm/stepModule/animate.css
  50. 21 1
      src/views/modules/kuaishouapp/account/stepForm/stepModule/newModulePop.vue
  51. 22 2
      src/views/modules/kuaishouapp/account/stepForm/stepModule/targetedPopulation.vue
  52. 462 0
      src/views/modules/kuaishouapp/crossAccount/createCampaign.vue
  53. 564 0
      src/views/modules/kuaishouapp/crossAccount/createUnit.vue
  54. 888 0
      src/views/modules/material/musicBytedance.vue
  55. 17 12
      src/views/modules/material/musicTab.vue
  56. 5 16
      src/views/modules/material/scriptFile.vue
  57. 6 3
      src/views/modules/material/videoMaterial.vue
  58. 639 503
      src/views/modules/onlineTraining/onlineTrainingList.vue
  59. 1 1
      src/views/modules/prop/modules/ActorModal.vue
  60. 1 0
      src/views/modules/prop/modules/vm-image-list.vue
  61. 19 6
      src/views/modules/prop/prop.vue
  62. 33 0
      src/views/modules/workBench/designLeader/index.vue
  63. 518 0
      src/views/modules/workBench/designLeader/platForm.vue
  64. 32 0
      src/views/modules/workBench/designPeople/index.vue
  65. 84 53
      src/views/modules/workBench/index.vue
  66. 773 0
      src/views/modules/workBench/materialList.vue
  67. 41 0
      src/views/modules/workBench/operator/index.vue
  68. 834 0
      src/views/modules/workBench/operator/materialList.vue
  69. 511 0
      src/views/modules/workBench/operator/platForm.vue
  70. 271 114
      src/views/modules/workBench/orderDetail.vue
  71. 769 0
      src/views/modules/workBench/orderList.vue
  72. 139 81
      src/views/modules/workBench/placeOrder.vue
  73. 121 13
      src/views/modules/yard/YardList.vue
  74. 117 171
      src/views/modules/yard/modules/YardModal.vue
  75. 2 4
      src/views/modules/yard/modules/yardDetail.vue
  76. 243 25
      src/views/playerPart/playerList.vue
  77. 5 10
      vue.config.js

+ 5 - 0
public/index.html

@@ -12,10 +12,13 @@
   <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.2.5/polyfill.js"></script> -->
   <script src="<%= BASE_URL %>polyfill.js"></script>
   <script src="<%= BASE_URL %>web-office-sdk-v1.1.1.umd.js"></script>
+  <link href="https://fonts.googleapis.com/css?family=Lexend+Deca&display=swap" rel="stylesheet">
   <link
   rel="stylesheet"
   href="//at.alicdn.com/t/font_1367495_eza6utwbiqn.css"
 />
+
+
   <style>
     html,
     body,
@@ -281,6 +284,8 @@
     window._CONFIG['imgDomainURL'] = 'http://139.186.31.213:8804/jeecg-boot/sys/common/view';
     window._CONFIG['pdfDomainURL'] = 'http://139.186.31.213:8804/jeecg-boot/sys/common/pdf/pdfPreviewIframe';
   </script>
+  <script src="https://unpkg.com/splitting/dist/splitting.min.js"></script>
+
 </head>
 
 <body>

二進制
public/noImg.png


+ 1 - 1
src/App.vue

@@ -22,7 +22,7 @@ export default {
       // tablet
       if (deviceType === 0) {
         that.$store.commit('TOGGLE_DEVICE', 'mobile')
-        that.$store.dispatch('setSidebar', false)
+        that.$store.dispatch('setSidebar', true)
       }
       // mobile
       else if (deviceType === 1) {

+ 21 - 0
src/api/actor.js

@@ -32,6 +32,20 @@ export function actorPhotoDelete(parameter) {
       params: parameter
     })
 }
+export function actorListDelete(parameter) {
+    return axios({
+      url: "/ctop/actor/delete",
+      method: 'delete',
+      params: parameter
+    })
+}
+export function propListDelete(parameter) {
+    return axios({
+      url: "/ctop/prop/delete",
+      method: 'delete',
+      params: parameter
+    })
+}
 
 export function actorPhotoAdd(parameter) {
     return axios({
@@ -64,6 +78,13 @@ export function actorDetail(parameter) {
         params: parameter
     })
 }
+export function propDetail(parameter) {
+    return axios({
+        url: "/ctop/prop/detail",
+        method: 'get',
+        params: parameter
+    })
+}
 
 
 export function actorCommentList(parameter) {

+ 7 - 0
src/api/yard.js

@@ -8,6 +8,13 @@ export function yardPhotoList(parameter) {
       params: parameter
     })
 }
+export function yardListDelete(parameter) {
+    return axios({
+      url: "/ctop/yard/delete",
+      method: 'delete',
+      params: parameter
+    })
+}
 
 export function yardVideoList(parameter) {
     return axios({

二進制
src/assets/noImg.png


二進制
src/assets/success.png


二進制
src/assets/touxiang.png


+ 7 - 4
src/components/ctop/ActorModal.vue

@@ -21,16 +21,16 @@
             :accessKeySecret="accessKeySecret"
           ></upload-to-ali> -->
 
-          <uploadFile :value.sync="coverUrl" :fileCount="1" uploadType="image" :multiple="false" />
+          <uploadFile :value.sync="coverUrl" :fileCount="1" uploadType="image" :multiple="false" :sizeCheck="false"/>
         </a-form-item>
         <a-form-item label="照片" :labelCol="labelCol" :wrapperCol="wrapperCol" v-if="!model.name">
-          <uploadFile :value.sync="imageUrl" :fileCount="10" uploadType="image"  />
+          <uploadFile :value.sync="imageUrl" :fileCount="10" uploadType="image"  :sizeCheck="false"/>
           <!-- <upload-to-ali v-model="imageUrl" :customDomain="customDomain" multiple preview :region="region"
             :bucket="bucket" :accept="acceptImage" :max="10" :size="1024000" :accessKeyId="accessKeyId"
             :accessKeySecret="accessKeySecret"></upload-to-ali> -->
         </a-form-item>
         <a-form-item label="视频作品" :labelCol="labelCol" :wrapperCol="wrapperCol" v-if="!model.name">
-          <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" />
+          <uploadFile :value.sync="videoUrl" :fileCount="10" uploadType="video" :sizeCheck="false"/>
           <!-- <upload-to-ali v-model="videoUrl" :customDomain="customDomain" multiple preview :region="region"
             :bucket="bucket" :accept="acceptVideo" :max="10" :size="1024000" :accessKeyId="accessKeyId"
             :accessKeySecret="accessKeySecret"></upload-to-ali> -->
@@ -130,6 +130,9 @@
         })
       },
       add() {
+        this.imageUrl = []
+        this.videoUrl = []
+        this.coverUrl = ""
         this.edit({});
       },
       edit(record) {
@@ -138,7 +141,7 @@
         that.form.resetFields();
         that.model = Object.assign({}, record);
         that.visible = true;
-        // that.coverUrl = ""
+        that.coverUrl = record.coverUrl?record.coverUrl:''
         // that.imageUrl = ""
         // that.videoUrl = ""
         that.$nextTick(() => {

+ 185 - 0
src/components/ctop/propModal.vue

@@ -0,0 +1,185 @@
+<template>
+  <a-modal :title="title" :width="800" :visible="visible" :confirmLoading="confirmLoading" @ok="handleOk"
+    @cancel="handleCancel" cancelText="关闭">
+
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="道具名称">
+          <a-input placeholder="请输入道具名称" v-decorator="['name', validatorRules.name ]" />
+        </a-form-item>
+        <a-form-item label="照片" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <uploadFile  v-if="visible" :value.sync="imageUrl" :fileCount="10"
+            uploadType="image" :sizeCheck="false"/>
+          <!-- <upload-to-ali v-model="imageUrl" :customDomain="customDomain" multiple preview :region="region"
+            :bucket="bucket" :accept="acceptImage" :max="10" :size="1024000" :accessKeyId="accessKeyId"
+            :accessKeySecret="accessKeySecret"></upload-to-ali> -->
+        </a-form-item>
+        <a-form-item label="道具类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input placeholder="请输入道具类型" v-decorator="['type']" />
+        </a-form-item>
+        <!-- <a-form-item label="生日" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-date-picker
+            style="width: 100%"
+            placeholder="请选择生日"
+            v-decorator="['birthday', {initialValue:!model.birthday?null:moment(model.birthday,dateFormat)}]"/>
+        </a-form-item>
+
+        <a-form-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-select v-decorator="[ 'sex', {}]" placeholder="请选择性别">
+            <a-select-option :value="1">男</a-select-option>
+            <a-select-option :value="2">女</a-select-option>
+          </a-select>
+        </a-form-item> -->
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="描述">
+          <a-input placeholder="请输入道具描述" v-decorator="['desc']" />
+        </a-form-item>
+
+
+      </a-form>
+    </a-spin>
+  </a-modal>
+</template>
+
+<script>
+  import {
+    httpAction
+  } from '@/api/manage'
+  import pick from 'lodash.pick'
+  import JTreeSelect from '@/components/jeecg/JTreeSelect'
+  import moment from 'moment'
+  import UploadToAli from '@femessage/upload-to-ali'
+  import uploadFile from '@/components/uploadFile.vue'
+  export default {
+    name: "ActorModal",
+    components: {
+      UploadToAli,
+      JTreeSelect,
+      uploadFile
+    },
+    data() {
+      return {
+        title: "操作",
+        visible: false,
+        model: {},
+        videoUrl: [],
+        imageUrl: [],
+        customDomain: '',
+        region: 'oss-cn-beijing',
+        bucket: 'ctop-media',
+        acceptVideo: 'video/mpeg,video/mp4',
+        acceptImage: 'image/jpeg,image/jpg,image/png',
+        accessKeyId: 'LTAIbNbqWzSOklQV',
+        accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
+        dateFormat: "YYYY-MM-DD",
+        labelCol: {
+          xs: {
+            span: 24
+          },
+          sm: {
+            span: 5
+          },
+        },
+        wrapperCol: {
+          xs: {
+            span: 24
+          },
+          sm: {
+            span: 16
+          },
+        },
+
+        confirmLoading: false,
+        form: this.$form.createForm(this),
+        validatorRules: {
+          name: {
+            rules: [{
+              required: true,
+              message: '请输入演员姓名!'
+            }]
+          },
+          // sex:{initialValue:((!this.model.sex)?"": (this.model.sex+""))},
+        },
+        url: {
+          add: "/ctop/prop/add",
+          edit: "/ctop/prop/edit",
+        },
+      }
+    },
+    created() {},
+    methods: {
+      add() {
+        this.edit({});
+      },
+      edit(record) {
+        console.log(record)
+        let that = this;
+        that.form.resetFields();
+        that.model = Object.assign({}, record);
+        that.visible = true;
+        that.imageUrl = record.coverUrl?[record.coverUrl]:[]
+        that.$nextTick(() => {
+          that.form.setFieldsValue(pick(this.model, 'name', 'desc'))
+          //时间格式化
+        });
+
+      },
+      close() {
+        this.$emit('close');
+        this.visible = false;
+      },
+      moment,
+      handleOk() {
+        const that = this;
+        // 触发表单验证
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            that.confirmLoading = true;
+            let httpurl = '';
+            let method = '';
+            if (!this.model.id) {
+              httpurl += this.url.add;
+              method = 'post';
+            } else {
+              httpurl += this.url.edit;
+              method = 'put';
+            }
+            // if (!values.birthday) {
+            //   values.birthday = '';
+            // } else {
+            //   values.birthday = values.birthday.format(this.dateFormat);
+            // }
+            values.coverUrl = this.imageUrl[0]
+            let formData = Object.assign(this.model, values);
+            //时间格式化
+
+            console.log(formData)
+            httpAction(httpurl, formData, method).then((res) => {
+              if (res.success) {
+                that.$message.success(res.message);
+                that.$emit('ok');
+                that.$emit("updateList")
+              } else {
+                that.$message.warning(res.message);
+              }
+            }).finally(() => {
+              that.confirmLoading = false;
+              that.close();
+            })
+
+
+          }
+        })
+      },
+      handleCancel() {
+        this.close()
+      },
+
+
+    }
+  }
+</script>
+
+<style lang="less" scoped>
+
+</style>

+ 553 - 0
src/components/ctop/vm-card-prop.vue

@@ -0,0 +1,553 @@
+<style>
+.ping .ant-modal-content .ant-modal-footer {
+  display: none !important;
+}
+.ping .ant-list-item-content {
+  justify-content: space-between;
+  cursor: pointer;
+}
+.ping-list .detele {
+  display: none;
+}
+/* .ping-list:hover span {
+  display: block;
+} */
+li {
+  list-style-type: none;
+}
+</style>
+<style lang="scss" scoped>
+.actor-photo-list {
+  display: flex;
+  padding-left: 0;
+  li {
+    width: 25%;
+    margin: 10px;
+    position: relative;
+    height: 250px;
+    border: 1px solid #f2f2f2;
+    img,
+    video {
+      width: 100%;
+      margin-top: auto;
+      margin-bottom: auto;
+      top: 0;
+      bottom: 0;
+      position: absolute;
+      max-height: 250px;
+    }
+  }
+}
+</style>
+<template>
+  <div :class="[type === 'horizantal' ? 'vm-card-horizantal' : 'vm-card-vertical' , 'vm-panel']" style="border:1px solid black">
+    <div
+      class="card-img"
+      style="height:250px;border-bottom:1px solid #f2f2f2"
+      :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
+    >
+      <!-- <img :src="img" alt="" height="250"> -->
+      <div v-if="editable && type == 'vertical'" class="control">
+        <span class="edit">
+          <a href="javascript:;">
+            <a-icon type="edit" @click="handleDetail(record)"></a-icon>
+          </a>
+        </span>
+        <span class="delete">
+          <a-icon type="message" @click="getComment"></a-icon>
+        </span>
+      </div>
+    </div>
+    <div class="card-desc panel-body">
+      <h2>{{ title }}</h2>
+      <p>{{ desc }}</p>
+      <a :href="detailUrl" @click="getDetail">详情 ></a>
+      <a :href="detailUrl" @click="deleteItemCard" style="float:right">删除 </a>
+    </div>
+    <a-modal title="评论" v-model="visible" class="ping">
+      <div>
+        <div style="height:300px;overflow:auto">
+          <a-list
+            v-if="comments.length"
+            :dataSource="comments"
+            :header="`${comments.length} ${comments.length > 1 ? 'replies' : 'reply'}`"
+            itemLayout="horizontal"
+          >
+            <a-list-item slot="renderItem" slot-scope="item, index" class="ping-list">
+              <a-comment
+                :author="item.createBy"
+                :avatar="item.avatar"
+                :content="item.comment"
+                :datetime="item.createTime"
+              ></a-comment>
+              <span class="detele" style="margin:20px;color:red;" @click="detele(item,index)">删除</span>
+            </a-list-item>
+          </a-list>
+          <div v-else style="height:300px;text-align:center;line-height:300px">暂无评论</div>
+        </div>
+        <a-comment>
+          <!-- <a-avatar
+            slot="avatar"
+            :src="loginInfo.value.avatar"
+            alt="Han Solo"
+          />-->
+          <img :src="loginInfo.value.avatar" alt slot="avatar" />
+          <div slot="content">
+            <a-form-item>
+              <a-textarea :rows="4" @change="handleChange" :value="value"></a-textarea>
+            </a-form-item>
+            <a-form-item>
+              <a-button
+                htmlType="submit"
+                :loading="submitting"
+                @click="handleSubmit"
+                type="primary"
+              >添加</a-button>
+            </a-form-item>
+          </div>
+        </a-comment>
+      </div>
+    </a-modal>
+
+    <a-modal title="详情" v-model="detail" class="ping" :width="800">
+      <a-tabs defaultActiveKey="1" @change="callback" v-model="indexDetail">
+        <a-tab-pane tab="演员信息" key="1">
+          <div style="display:flex;flex-direction:row;height:200px;">
+            <div
+              style="height:200px;width:30%;border:1px solid #f2f2f2;"
+              :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
+            ></div>
+            <div style="flex:1;margin:15px">
+              <a-form :form="form">
+                <a-form-item label="姓名" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.name}}</span>
+                </a-form-item>
+                <a-form-item label="性别" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.sex==1?"男":"女"}}</span>
+                </a-form-item>
+                <a-form-item label="出生年月" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.birthday}}</span>
+                </a-form-item>
+              </a-form>
+            </div>
+          </div>
+          <div style="margin-top:20px">
+            <a-collapse accordion>
+              <a-collapse-panel header="个人信息" key="1">
+                <p>{{form.speciality}}</p>
+              </a-collapse-panel>
+            </a-collapse>
+          </div>
+        </a-tab-pane>
+        <a-tab-pane tab="演员图集" key="2" forceRender>
+          <div>
+            <a type="primary" style="margin-left:10px" @click="addPhoto=true">新增图集</a>
+            <ul class="actor-photo-list">
+              <li v-for="(item,index) of photoList" :key="index">
+                <a-icon
+                  type="close-circle"
+                  style="position:absolute;top:-5px;right:-5px;color:red;z-index:10;cursor: pointer;"
+                  @click="deteleImg(item.id)"
+                />
+                <img :src="item.photoUrl" alt />
+              </li>
+            </ul>
+          </div>
+          <div style="text-align:right">
+            <a-pagination
+              showQuickJumper
+              :total="total"
+              @change="pageChange"
+              :pageSize.sync="pageSize"
+            />
+          </div>
+        </a-tab-pane>
+        <a-tab-pane tab="演员作品" key="3">
+          <div>
+            <a type="primary" style="margin-left:10px" @click="addVideo=true">新增作品</a>
+            <ul class="actor-photo-list">
+              <li v-for="(item,index) of videoList" :key="index">
+                <a-icon
+                  type="close-circle"
+                  style="position:absolute;top:-5px;right:-5px;color:red;z-index:10;cursor: pointer;"
+                  @click="deteleVideo(item.id)"
+                />
+                <video
+                  class="video"
+                  :src="item.videoUrl"
+                  controls="controls"
+                  style="min-height:160px"
+                >您的浏览器不支持 video 标签。</video>
+              </li>
+            </ul>
+          </div>
+          <div style="text-align:right">
+            <a-pagination
+              showQuickJumper
+              :total="videoTotal"
+              @change="pageChange"
+              :pageSize.sync="pageSize"
+            />
+          </div>
+        </a-tab-pane>
+      </a-tabs>
+    </a-modal>
+    <!-- 新增图集 -->
+    <a-modal
+      v-model="addPhoto"
+      title="新增图集"
+      @ok="handleOk('photo')"
+      @cancel="handleCancel('photo')"
+    >
+    <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" :sizeCheck="false"/>
+      <!-- <upload-to-ali
+        style="margin:10px"
+        v-model="imageUrl"
+        :customDomain="customDomain"
+        preview
+        :region="region"
+        :bucket="bucket"
+        :accept="acceptImage"
+        :max="1"
+        :size="1024000"
+        :accessKeyId="accessKeyId"
+        :accessKeySecret="accessKeySecret"
+      ></upload-to-ali> -->
+    </a-modal>
+    <!-- 新增作品 -->
+    <a-modal
+      v-model="addVideo"
+      title="新增作品"
+      @ok="handleOk('video')"
+      @cancel="handleCancel('video')"
+    >
+    <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false" :sizeCheck="false"/>
+      <!-- <upload-to-ali
+        style="margin:10px"
+        v-model="videoUrl"
+        :customDomain="customDomain"
+        preview
+        :region="region"
+        :bucket="bucket"
+        :accept="acceptVideo"
+        :max="1"
+        :size="1024000"
+        :accessKeyId="accessKeyId"
+        :accessKeySecret="accessKeySecret"
+      ></upload-to-ali> -->
+    </a-modal>
+    <actor-modal ref="modalForm" @ok="modalFormOk" @updateList="updateList" @close="closeVideo"></actor-modal>
+  </div>
+</template>
+<script>
+import moment from 'moment'
+import {
+  actorDetail,
+  actorCommentList,
+  actorCommentAdd,
+  actorCommentDetele,
+  actorPhotoList,
+  actorVideoList,
+  actorPhotoDelete,
+  actorVideoDelete,
+  actorPhotoAdd,
+  actorVideoAdd
+} from '@/api/actor'
+import actorModal from './ActorModal'
+import UploadToAli from '@femessage/upload-to-ali'
+  import uploadFile from '@/components/uploadFile.vue'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import { closeAllVideoFun } from '@/utils/videoControl'
+export default {
+  name: 'VmCard',
+  mixins: [JeecgListMixin],
+  components: {
+    actorModal,
+    UploadToAli,
+    uploadFile
+  },
+  props: {
+    type: {
+      type: String,
+      default: 'vertical'
+    },
+    editable: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'Title'
+    },
+    img: {
+      type: String,
+      default: require('@/assets/img/noImg.png')
+    },
+    desc: {
+      type: String,
+      default:
+        "Lorem Ipsum is simply dummy text of the printing and typesetting industry,Lorem Ipsum has been the industry's standard dummy text ever since the 1500s"
+    },
+    detailUrl: {
+      type: String,
+      default: '#'
+    },
+    editUrl: {
+      type: String,
+      default: '#'
+    },
+    deleteUrl: {
+      type: String,
+      default: '#'
+    },
+    id: {
+      default() {
+        return 0
+      }
+    },
+    record: {
+      default() {
+        return {}
+      }
+    }
+  },
+  data: function() {
+    return {
+      addPhoto: false,
+      addVideo: false,
+      indexDetail: '1',
+      to: null,
+      comments: [],
+      submitting: false,
+      value: '',
+      moment,
+      visible: false,
+      detail: false,
+      customDomain: '',
+      region: 'oss-cn-beijing',
+      bucket: 'ctop-media',
+      acceptVideo: 'video/mpeg,video/mp4',
+      acceptImage: 'image/jpeg,image/jpg,image/png',
+      accessKeyId: 'LTAIbNbqWzSOklQV',
+      accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
+      form: {
+        name: '',
+        birthday: '',
+        sex: null,
+        speciality: ''
+      },
+      noImgUrl: require('@/assets/img/noImg.png'),
+      loginInfo: JSON.parse(localStorage.getItem('pro__Login_Userinfo')),
+      photoList: [],
+      imageUrl: '',
+      videoUrl: '',
+      total: 1,
+      videoTotal: 1,
+      pageSize: 4,
+      url: {
+        list: '/ctop/actor/list'
+      },
+      columns: [
+        {
+          title: 'ID',
+          align: 'center',
+          dataIndex: 'id'
+        },
+        {
+          title: '姓名',
+          align: 'center',
+          dataIndex: 'name'
+        },
+        {
+          title: '生日',
+          align: 'center',
+          dataIndex: 'birthday'
+        },
+        {
+          title: '性别',
+          align: 'center',
+          dataIndex: 'sex_dictText'
+        },
+        {
+          title: '特长',
+          align: 'center',
+          dataIndex: 'speciality'
+        },
+        {
+          title: '创建时间',
+          align: 'center',
+          dataIndex: 'createTime'
+        },
+        {
+          title: '操作',
+          dataIndex: 'action',
+          align: 'center',
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      currentPage: 1,
+      videoList: []
+    }
+  },
+  methods: {
+    updateList() {
+      this.$emit('updateList')
+    },
+    pageChange: function(page) {
+      console.log(page)
+      this.currentPage = page
+      if (this.indexDetail == '2') {
+        this.getPhoto()
+      } else if (this.indexDetail == '3') {
+        this.getVideo()
+      }
+    },
+    handleSubmit() {
+      if (!this.value) {
+        return
+      }
+
+      this.submitting = true
+
+      actorCommentAdd({ actorId: this.id, comment: this.value }).then(res => {
+        this.submitting = false
+        if (res.code == 200) {
+          this.getComment()
+          this.value = ''
+        }
+      })
+      //   setTimeout(() => {}, 1000)
+    },
+    handleChange(e) {
+      this.value = e.target.value
+    },
+    // 删除
+    deleteItemCard(){
+      this.$emit('delete-ok', {id:this.id})
+    },
+    getDetail() {
+      this.indexDetail = '1'
+      this.detail = true
+      actorDetail({ actorId: this.id }).then(res => {
+        console.log(res)
+        if (res.code == 0) {
+          this.form.name = res.result.name
+          this.form.birthday = res.result.birthday
+          this.form.sex = res.result.sex
+          this.form.speciality = res.result.speciality
+        }
+      })
+    },
+    getComment() {
+      this.visible = true
+      this.comments = []
+      actorCommentList({ actorId: this.id }).then(res => {
+        if (res.code == 0) {
+          console.log(res)
+          this.comments = res.result.records.reverse()
+        }
+      })
+    },
+    detele(item, index) {
+      console.log(item, index)
+
+      actorCommentDetele({ id: item.id }).then(res => {
+        if (res.code == 200) {
+          this.comments.splice(index, 1)
+        }
+      })
+    },
+    closeVideo() {
+      closeAllVideoFun()
+    },
+    callback(key) {
+      console.log(key)
+      if (key == '2') {
+        this.closeVideo()
+        this.currentPage = 1
+        this.getPhoto()
+      } else if (key == '3') {
+        this.currentPage = 1
+        this.getVideo()
+      } else if (key == '1') {
+        this.closeVideo()
+      }
+    },
+    getPhoto() {
+      actorPhotoList({ pageNo: this.currentPage, pageSize: 4, actorId: this.id }).then(res => {
+        if (res.code == 0) {
+          console.log(res)
+          this.photoList = res.result.records
+          this.total = res.result.total
+        }
+      })
+    },
+    getVideo() {
+      actorVideoList({ pageNo: this.currentPage, pageSize: 4, actorId: this.id }).then(res => {
+        if (res.code == 0) {
+          console.log(res)
+          this.videoList = res.result.records
+          this.videoTotal = res.result.total
+        }
+      })
+    },
+    deteleImg(id) {
+      actorPhotoDelete({ id: id }).then(res => {
+        if (res.code == 200) {
+          console.log(res)
+          this.getPhoto()
+        }
+      })
+    },
+    deteleVideo(id) {
+      actorPhotoDelete({ id: id }).then(res => {
+        if (res.code == 200) {
+          console.log(res)
+          this.getPhoto()
+        }
+      })
+    },
+    handleOk(type) {
+      const that = this
+      if (type == 'photo') {
+        actorPhotoAdd({ actorId: that.id, photoUrl: that.imageUrl })
+          .then(res => {
+            if (res.success) {
+              this.getPhoto()
+              this.handleCancel('photo')
+            } else {
+              that.$message.warning(res.message)
+            }
+          })
+          .finally(() => {
+            that.confirmLoading = false
+            that.handleCancel('photo')
+          })
+      } else {
+        actorVideoAdd({ actorId: that.id, videoUrl: that.videoUrl })
+          .then(res => {
+            if (res.success) {
+              this.getVideo()
+              this.handleCancel('video')
+            } else {
+              that.$message.warning(res.message)
+            }
+          })
+          .finally(() => {
+            that.confirmLoading = false
+            that.handleCancel('video')
+          })
+      }
+    },
+    handleCancel(type) {
+      if (type == 'photo') {
+        this.imageUrl = ''
+        this.addPhoto = false
+      } else {
+        this.videoUrl = ''
+        this.addVideo = false
+      }
+    }
+  }
+}
+</script>

+ 120 - 16
src/components/ctop/vm-card.vue

@@ -50,7 +50,7 @@ li {
       <div v-if="editable && type == 'vertical'" class="control">
         <span class="edit">
           <a href="javascript:;">
-            <a-icon type="edit" @click="handleDetail(record)"></a-icon>
+            <a-icon type="edit" @click="handleDetails(record)"></a-icon>
           </a>
         </span>
         <span class="delete">
@@ -62,6 +62,7 @@ li {
       <h2>{{ title }}</h2>
       <p>{{ desc }}</p>
       <a :href="detailUrl" @click="getDetail">详情 ></a>
+      <a :href="detailUrl" @click="deleteItemCard" style="float:right">删除 </a>
     </div>
     <a-modal title="评论" v-model="visible" class="ping">
       <div>
@@ -109,7 +110,8 @@ li {
     </a-modal>
 
     <a-modal title="详情" v-model="detail" class="ping" :width="800">
-      <a-tabs defaultActiveKey="1" @change="callback" v-model="indexDetail">
+    <!-- {{pageTitle}} -->
+      <a-tabs defaultActiveKey="1" @change="callback" v-model="indexDetail" v-if="pageTitle=='演员列表'">
         <a-tab-pane tab="演员信息" key="1">
           <div style="display:flex;flex-direction:row;height:200px;">
             <div
@@ -190,6 +192,28 @@ li {
           </div>
         </a-tab-pane>
       </a-tabs>
+      <div v-if="pageTitle=='道具列表'">
+        <div style="display:flex;flex-direction:row;height:200px;">
+            <div
+              style="height:200px;width:30%;border:1px solid #f2f2f2;"
+              :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
+            ></div>
+            <div style="flex:1;margin:15px">
+              <a-form :form="form">
+                <a-form-item label="道具名称" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.name}}</span>
+                </a-form-item>
+                <a-form-item label="道具类型" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.type|| '暂无类型'}}</span>
+                </a-form-item>
+                <a-form-item label="道具描述" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{form.decs|| '暂无描述'}}</span>
+                </a-form-item>
+              </a-form>
+            </div>
+          </div>
+      </div>
+      
     </a-modal>
     <!-- 新增图集 -->
     <a-modal
@@ -198,7 +222,7 @@ li {
       @ok="handleOk('photo')"
       @cancel="handleCancel('photo')"
     >
-    <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" />
+    <uploadFile :value.sync="imageUrl" :fileCount="10" uploadType="image" :sizeCheck="false"/>
       <!-- <upload-to-ali
         style="margin:10px"
         v-model="imageUrl"
@@ -220,7 +244,7 @@ li {
       @ok="handleOk('video')"
       @cancel="handleCancel('video')"
     >
-    <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false" />
+    <uploadFile :value.sync="videoUrl" :fileCount="10" uploadType="video" :sizeCheck="false"/>
       <!-- <upload-to-ali
         style="margin:10px"
         v-model="videoUrl"
@@ -235,7 +259,9 @@ li {
         :accessKeySecret="accessKeySecret"
       ></upload-to-ali> -->
     </a-modal>
-    <actor-modal ref="modalForm" @ok="modalFormOk" @updateList="updateList" @close="closeVideo"></actor-modal>
+    <actor-modal ref="modalFormActor" @ok="modalFormOks" @updateList="updateList" @close="closeVideo"  ></actor-modal>
+    <propModal ref="modalFormProp" @ok="modalFormOks" @updateList="updateList" @close="closeVideo"  ></propModal>
+    <yardModal ref="modalFormYard" @ok="modalFormOks" @updateList="updateList" @close="closeVideo" ></yardModal>
   </div>
 </template>
 <script>
@@ -250,20 +276,25 @@ import {
   actorPhotoDelete,
   actorVideoDelete,
   actorPhotoAdd,
-  actorVideoAdd
+  actorVideoAdd,
+  propDetail,
 } from '@/api/actor'
 import actorModal from './ActorModal'
+import yardModal from '@/views/modules/yard/modules/YardModal'
 import UploadToAli from '@femessage/upload-to-ali'
   import uploadFile from '@/components/uploadFile.vue'
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import { closeAllVideoFun } from '@/utils/videoControl'
+
+import propModal from './propModal'
 export default {
   name: 'VmCard',
-  mixins: [JeecgListMixin],
   components: {
     actorModal,
     UploadToAli,
-    uploadFile
+    uploadFile,
+    propModal,
+    yardModal
   },
   props: {
     type: {
@@ -278,14 +309,19 @@ export default {
       type: String,
       default: 'Title'
     },
+    pageTitle: {
+      type: String,
+    },
     img: {
       type: String,
       default: require('@/assets/img/noImg.png')
     },
     desc: {
       type: String,
-      default:
-        "Lorem Ipsum is simply dummy text of the printing and typesetting industry,Lorem Ipsum has been the industry's standard dummy text ever since the 1500s"
+      default(){
+        return ""
+      }
+       
     },
     detailUrl: {
       type: String,
@@ -295,6 +331,10 @@ export default {
       type: String,
       default: '#'
     },
+    deleteUrl: {
+      type: String,
+      default: '#'
+    },
     id: {
       default() {
         return 0
@@ -329,13 +369,15 @@ export default {
         name: '',
         birthday: '',
         sex: null,
-        speciality: ''
+        speciality: '',
+        desc:'',
+        type:'',
       },
       noImgUrl: require('@/assets/img/noImg.png'),
       loginInfo: JSON.parse(localStorage.getItem('pro__Login_Userinfo')),
       photoList: [],
-      imageUrl: '',
-      videoUrl: '',
+      imageUrl: [],
+      videoUrl: [],
       total: 1,
       videoTotal: 1,
       pageSize: 4,
@@ -387,6 +429,9 @@ export default {
   methods: {
     updateList() {
       this.$emit('updateList')
+      if(this.pageTitle=='场地列表'){
+        this.loadData(1)
+      }
     },
     pageChange: function(page) {
       console.log(page)
@@ -416,10 +461,16 @@ export default {
     handleChange(e) {
       this.value = e.target.value
     },
+    // 删除
+    deleteItemCard(){
+  
+      this.$emit('delete-ok', {id:this.id})
+    },
     getDetail() {
       this.indexDetail = '1'
       this.detail = true
-      actorDetail({ actorId: this.id }).then(res => {
+      if(this.pageTitle=='演员列表'){
+        actorDetail({ actorId: this.id }).then(res => {
         console.log(res)
         if (res.code == 0) {
           this.form.name = res.result.name
@@ -428,6 +479,23 @@ export default {
           this.form.speciality = res.result.speciality
         }
       })
+      }else if(this.pageTitle=='道具列表'){
+        propDetail({ propId: this.id }).then(res => {
+            console.log(res)
+          if (res.code == 0) {
+            this.form.name = res.result.name
+            this.form.type = res.result.type
+            this.form.desc = res.result.desc
+            
+          }
+        })
+      }else{
+        console.log(1)
+        this.indexDetail = '1'
+        this.detail = false
+        this.$emit('showDetail')
+      }
+      
     },
     getComment() {
       this.visible = true
@@ -538,7 +606,43 @@ export default {
         this.videoUrl = ''
         this.addVideo = false
       }
-    }
-  }
+    },
+
+    handleDetails(record) {
+      console.log(record) 
+      if(this.pageTitle=='演员列表'){
+        console.log(this.$refs.modalFormActor)
+        this.$refs.modalFormActor.edit(record);
+        this.$refs.modalFormActor.title = "详情";
+        this.$refs.modalFormActor.disableSubmit = true;
+      }else if(this.pageTitle=='道具列表'){
+        this.$refs.modalFormProp.edit(record);
+        this.$refs.modalFormProp.title = "详情";
+        this.$refs.modalFormProp.disableSubmit = true;
+      }else if(this.pageTitle=='场地列表'){
+        this.$refs.modalFormYard.edit(record);
+        this.$refs.modalFormYard.title = "详情";
+        this.$refs.modalFormYard.disableSubmit = true;
+      }
+      
+    },
+
+    modalFormOks() {
+      // 新增/修改 成功时,重载列表
+      if(this.pageTitle=='演员列表'){
+        this.url.list='/ctop/actor/list'
+      }else if(this.pageTitle=='道具列表'){
+        this.url.list='/ctop/prop/list'
+      }else if(this.pageTitle=='场地列表'){
+        this.url.list='/ctop/yard/list'
+      }
+      // this.loadData(1);
+      this.updateList()
+    },
+  },
+
+  mounted() {
+    console.log(this.pageTitle)
+  },
 }
 </script>

+ 21 - 9
src/components/ctop/vm-image-list.vue

@@ -68,23 +68,25 @@
       </a-row>
     </a-row>
     <a-row class="image-list" :gutter="16" style="padding:0 8px">
-      <a-col :lg="6" :sm="12" class="vm-margin" v-for="(item, index) of dataShow" :key="index" style="padding:0">
-        <vm-card
+      <a-col :lg="6" :sm="12" class="vm-margin" style="padding:0"  v-for="(item, index) of dataShow" :key="index" >
+          <vm-card
           style="margin: 0 15px;"
           :editable="true"
           :title="item.name"
           :img="item.coverUrl"
           :desc="item.speciality"
           :detailUrl="item.videoUrl"
-          :editUrl="item.editUrl"
+          :editUrl="item.editUrl"      
+          :pageTitle='title'   
           :id="item.id"
-          :record="item"
-          @delete-ok="deleteOk(item)"
+          :record="item"          
+          @delete-ok="deleteOk({...item,'page':currentPage})"
           @updateList="updateList"
         ></vm-card>
       </a-col>
     </a-row>
-    <actor-modal ref="modalForm" @ok="modalFormOk" @updateList="updateList"></actor-modal>
+    <actor-modal ref="modalForm" @ok="modalFormOk" @updateList="updateList" v-if="title=='演员列表'"></actor-modal>
+    <propModal ref="modalForm" @ok="modalFormOk" @updateList="updateList" v-if="title=='道具列表'"></propModal>
   </div>
 </template>
 
@@ -93,6 +95,7 @@ import VmCard from '@/components/ctop/vm-card'
 import ARow from 'ant-design-vue/es/grid/Row'
 import ACol from 'ant-design-vue/es/grid/Col'
 import actorModal from './ActorModal'
+import propModal from './propModal'
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 export default {
   name: 'VmImageList',
@@ -100,13 +103,15 @@ export default {
     ACol,
     ARow,
     VmCard,
-    actorModal
+    actorModal,
+    propModal
   },
   mixins: [JeecgListMixin],
+  
   props: {
     title: {
       type: String,
-      default: '演员列表'
+      // default: '演员列表'
     },
     // origin data
     data: {
@@ -180,6 +185,9 @@ export default {
       ]
     }
   },
+  // provide:{
+  //   page:this.currentPage,
+  // },
   methods: {
     updateList() {
       this.$emit('updateList')
@@ -209,8 +217,12 @@ export default {
     //     }
     //   })
     // },
+    // deleteItem(data){
+    //     console.log(data,1)
+    //     this.$emit('delete-ok', {page:this.currentPage,...data})
+    // },
     deleteOk: function(data) {
-      this.$emit('delete-ok', data)
+      this.$emit('delete-ok', {page:this.currentPage,...data})
     },
     search() {
       if (this.keyword) {

+ 330 - 0
src/components/formComponents/checkBoxGroup.vue

@@ -0,0 +1,330 @@
+<style lang="scss">
+.ul-radio-group {
+  border-radius: 5px;
+  height: 32px;
+  padding: 0;
+  margin: 0;
+  border: none;
+  background: transparent;
+
+  .btn {
+    background: transparent;
+    padding: 0;
+    margin: 0;
+    border: none;
+  }
+  .item {
+    min-width: 80px;
+    padding: 0px 15px;
+    text-align: center;
+    display: inline-block;
+    border: 1px solid #ccc;
+    border-left: 0;
+    height: 32px;
+    line-height: 32px;
+    cursor: pointer;
+    .checkbox-button-input {
+      width: 0;
+      height: 0;
+      opacity: 0;
+    }
+    .ant-checkbox {
+      display: none;
+    }
+  }
+  .bgcolor {
+    color: rgba(0, 0, 0, 0.25);
+    background-color: #f5f5f5;
+    border-color: #d9d9d9;
+    cursor: not-allowed;
+  }
+  .item::after {
+    content: '';
+    position: absolute;
+    right: 1px;
+    top: -2px;
+    width: 0;
+    height: 0;
+    border-top: 6px solid transparent;
+    border-bottom: 6px solid transparent;
+    border-left: 6px solid;
+    border-left-color: #e0e0e0;
+    -webkit-transform: rotate(-45deg);
+    -ms-transform: rotate(-45deg);
+    transform: rotate(-45deg);
+    border-radius: 2px;
+  }
+  .item:hover {
+    color: #1890ff;
+  }
+  .selection {
+    color: #fff;
+    background: #1890ff;
+    // border-color: #1890ff;
+  }
+  .item.selection:hover {
+    color: #fff;
+    background: #40a9ff;
+  }
+  .item.selection:after {
+    border-left: 6px solid #1890ff;
+  }
+  .item:hover::after {
+    // border-color: #40a9ff;
+    border-left: 6px solid #40a9ff;
+  }
+  .bgcolor:hover {
+    color: rgba(0, 0, 0, 0.25);
+    background-color: #f5f5f5;
+    border-color: #d9d9d9;
+    cursor: not-allowed;
+  }
+  .bgcolor:hover::after {
+    // border-color: #40a9ff;
+    border-left: 6px solid #e0e0e0;
+  }
+  .bgcolor.selection:after {
+    border-left: 6px solid #e0e0e0;
+  }
+  .bgcolor.selection {
+    color: rgba(0, 0, 0, 0.25);
+    background-color: #f5f5f5;
+    border-color: #d9d9d9;
+    cursor: not-allowed;
+  }
+  .bgcolor.selection:hover {
+    // color: #1890ff;
+    color: rgba(0, 0, 0, 0.25);
+    background-color: #f5f5f5;
+    border-color: #d9d9d9;
+    cursor: not-allowed;
+  }
+  .bgcolor.selection:after {
+    border-left: 6px solid #e0e0e0;
+  }
+  .ant-checkbox-wrapper + .ant-checkbox-wrapper {
+    margin-left: 0;
+  }
+}
+.ul-radio-group .item:first-child {
+  border-radius: 5px 0 0 5px;
+  border-left: 1px solid #ccc;
+}
+.ul-radio-group .item.selection:first-child {
+  border-radius: 5px 0 0 5px;
+  border-left: 1px solid #1890ff;
+}
+.ul-radio-group .item.selection:nth-child(2) {
+  border-left: 1px solid #1890ff;
+}
+.ul-radio-group .item:first-child:after {
+  border-left: 0;
+}
+.ul-radio-group .item:last-child {
+  border-radius: 0px 5px 5px 0px;
+}
+</style>
+<template>
+  <div class="ul-radio-group">
+    <a-checkbox-group v-model="selectedVal" :disabled="disabled" style="width: 100%">
+      <a-checkbox
+        v-for="item of selectOption"
+        :label="item.label"
+        :key="item.value"
+        :value="item.value"
+        :class="{
+          item: true && userButton,
+          selection: selectedVal && selectedVal.indexOf(item.value) > -1 && userButton,
+          bgcolor: item.disabled,
+        }"
+        >{{ item.label }}</a-checkbox
+      >
+    </a-checkbox-group>
+  </div>
+</template>
+
+<script>
+// import { dictionary } from '@/components/service/core/dictionary'
+import { isArray } from '@/utils/Tools'
+import { httpAction, getAction } from '@/api/manage'
+export default {
+  name: 'CheckboxGroup', // checkbox组件二次封装
+  props: {
+    userButton: {
+      type: Boolean,
+      default() {
+        return true
+      },
+    },
+    code: {
+      // 参数code
+      type: String,
+      default: '',
+    },
+    allValue: {
+      type: Boolean,
+      default() {
+        return false
+      },
+    },
+    options: {
+      // 外部传入的option 可替代请求项
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    value: {
+      // v-model绑定值
+      type: [Number, Array, String],
+      default() {
+        return []
+      },
+    },
+    label: {
+      // label 绑定值
+      type: [Array, String],
+      default: '',
+    },
+    radioStyle: {
+      // 是否复选框模拟单选效果
+      type: Boolean,
+      default: false,
+    },
+    disabled: {
+      // 是否禁用
+      type: Boolean,
+      default: false,
+    },
+  },
+  components: {},
+  data() {
+    return {
+      selectOption: [],
+    }
+  },
+  watch: {
+    options(val) {
+      if (isArray(val)) {
+        this.selectOption.splice(0, this.selectOption.length)
+        this.selectOption.push(...val)
+      }
+    },
+    selectedVal(n, o) {
+      if (this.radioStyle && !this.allValue) {
+        if (n.length == 0) {
+          this.selectedVal = o
+        }
+      }
+    },
+  },
+  computed: {
+    selectedVal: {
+      get: function () {
+        return this.value
+      },
+      set: function (val) {
+        this.selectChange(val)
+      },
+    },
+  },
+  mounted() {
+    this.$nextTick(() => {
+      if (this.code && this.options.length == 0) {
+        // 如果code值不为空且options.lengt==0, 则去请求字典项
+        this.getOptions()
+      } else {
+        // 否则直接获取外部传入的options
+        this.selectOption.splice(0, this.selectOption.length)
+        this.selectOption.push(...this.options)
+      }
+    })
+  },
+  methods: {
+    getOptions() {
+      // 获取字典项
+      getAction('/sys/dictItem/list', { dictId: this.code, pageSize: 1000, pageNo: 1 }).then((res) => {
+        if (res.success && isArray(res.result.records)) {
+          var data = res.result.records
+          data = data.map((item) => {
+            return {
+              label: item.itemText,
+              value: item.itemValue,
+              ...item,
+            }
+          })
+          if (this.allValue) {
+            data.unshift({ label: '不检查', value: 'unlimited' })
+            if (this.value == '' || this.value == '' || this.value == null || this.value.length == 0) {
+              this.selectedVal = ['unlimited']
+            }
+          } else {
+            if (this.value == '' || this.value == '' || this.value == null || this.value.length == 0) {
+              this.selectedVal = []
+            }
+          }
+          this.selectOption.push(...data)
+        }
+      })
+    },
+    selectChange(val) {
+      // 选择事件
+      if (!this.radioStyle) {
+        // 多选
+        var retrunData = []
+        let label = this.selectOption.filter((v) => val.findIndex((item) => item == v.value) > -1).map((v) => v.label)
+        if (this.allValue) {
+          if (val.findIndex((item) => item == 'unlimited') == 0) {
+            retrunData = val.slice(-1)
+          } else if (val.findIndex((item) => item == 'unlimited') == val.length - 1) {
+            retrunData = ['unlimited']
+          } else {
+            retrunData = val
+          }
+        } else {
+          retrunData = val
+        }
+
+        this.$emit('input', retrunData)
+        this.$emit('update:label', label)
+        this.$emit('change', val)
+        // this.consoleFun('VALUE: ', val, 'LABEL:', label)
+      } else {
+        // 模拟单选radio效果
+        let selectVal = []
+        if (this.allValue) {
+          if (val.length == 0) {
+            selectVal = ['unlimited']
+          }
+        } else {
+          if (val.length == 0) {
+            selectVal = []
+          }
+        }
+
+        if (val.length > 0) {
+          selectVal = val.slice(-1)
+        }
+        let label = this.selectOption
+          .filter((v) => selectVal.findIndex((item) => item == v.value) > -1)
+          .map((v) => v.label)
+        this.$emit('input', selectVal)
+        this.$emit('update:label', label)
+        this.$emit('change', selectVal)
+        // this.consoleFun('VALUE: ', selectVal, 'LABEL:', label)
+      }
+    },
+    emitChange(...args) {
+      // emit change事件
+      this.$emit('change', ...args)
+    },
+    consoleFun(...args) {
+      // 打印信息
+      if (process.env.NODE_ENV == 'development') {
+        console.log(...args)
+      }
+    },
+  },
+}
+</script>
+

+ 237 - 0
src/components/formComponents/radioCheck.vue

@@ -0,0 +1,237 @@
+<template>
+    <div class="radioCheck" >
+        
+            <label :class="{'item':true,'selection': selectValue.indexOf(item.value)>-1,'bgcolor':item.disabled}" v-for="(item,index) in checkArr" :key="index">
+                
+                <span>
+                    <input type="checkbox" :value="item.value"  class="checkbox-button-input" @click="radioCheckChange($event,item)">
+                </span>
+                <span>{{item.title}}</span>
+                
+            </label>
+            <!-- <label :class="{'item':true,'selection': selectValue.indexOf(item.value)>-1}" v-for="(item,index) in checkArr" :key="index" :disabled='item.disabled'>               
+                <span>
+                    <input type="checkbox" :value="item.value"  class="checkbox-button-input" @click="radioCheckChange">
+                </span>
+                <span>{{item.title}}</span>               
+            </label>        -->
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            selectValue:[''],
+            currentSelect:'',
+        }
+    },
+   
+    props:['checkArr','selectArr'],
+    watch:{
+        checkArr:{
+            handler(n,o){
+                // console.log(n,o)
+                this.selectValue=[];
+                let i=0;
+                this.checkArr.forEach((item,index)=>{
+                    // console.log(item)
+                    if(item.disabled==false){
+                        i++;
+                        this.selectValue[0]=item.value;
+                        // console.log(this.selectValue)
+                    }else if(item.disabled==undefined){
+                        if(item.checked){
+                            this.selectValue.push(item.value)
+                        }
+                        
+                    }
+                })
+                if(this.selectValue.length==0){
+                    this.selectValue=[''];
+                }
+                if(i==3){
+                    this.selectValue[0]='';
+                }
+                // console.log(this.selectValue)
+                this.$emit('getSonValue',this.selectValue)
+            },
+            deep:true,
+            // immediate: true
+
+        },
+        
+    },
+    methods: {
+        //单选多选的事件
+        radioCheckChange(e,item){
+            console.log(e.target,item,!item.disabled);
+            
+            this.currentSelect=e.target.value;
+            if(!item.disabled){
+
+                if(e.target.value=='' || this.selectValue.length==0 ){
+                    this.selectValue=[''];
+                }else{
+                    if(this.selectValue.indexOf('')>-1){
+                        let i=this.selectValue.indexOf('');
+                        this.selectValue.splice(0,1)
+                    }
+                    
+                    if(this.selectValue.indexOf(e.target.value)==-1){
+                        this.selectValue.push(e.target.value)
+                    }else if(this.selectValue.indexOf(e.target.value)>-1){
+                        this.selectValue=this.selectValue.filter((item)=>{
+                            return item!=e.target.value
+                        })  
+                    }
+
+                    if(this.selectValue.length==0){
+                        this.selectValue=[''];
+                    }
+                    
+                }
+            // console.log(this.currentSelect,this.selectValue);
+            }
+            this.$emit('getSonValue',this.selectValue)
+        },
+    },
+    mounted() {
+        // this.selectValue=[]
+        // console.log(this.checkArr)
+        this.checkArr.forEach((item,index)=>{
+            
+            if(item.disabled&&item.disabled!=undefined){
+                this.selectValue[0]=item.value
+            }else{
+                this.selectValue=['']
+            }
+        })
+        this.$emit('getSonValue',this.selectValue)
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.radioCheck{        
+    border-radius: 5px;
+    height: 32px;
+    padding: 0;
+    margin: 0;
+    border: none;
+    background: transparent;
+    .btn{
+        background: transparent;
+        padding: 0;
+        margin: 0;
+        border: none;
+    }
+    .item{
+        min-width: 80px;
+        padding: 0px 15px;
+        text-align: center;
+        display: inline-block;
+        border: 1px solid #ccc;
+        border-left: 0;
+        height: 32px;
+        line-height: 32px;
+        cursor: pointer;
+        .checkbox-button-input{
+            width: 0;
+            height: 0;
+            opacity: 0;
+        }
+
+    }
+    .bgcolor{
+        color:rgba(0, 0, 0, 0.25);
+        background-color: #f5f5f5;
+        border-color: #d9d9d9;
+        cursor: not-allowed;
+    }
+    .item::after{
+        content: "";
+        position: absolute;
+        right: 1px;
+        top: -2px;
+        width: 0;
+        height: 0;
+        border-top: 6px solid transparent;
+        border-bottom: 6px solid transparent;
+        border-left: 6px solid;
+        border-left-color: #e0e0e0;
+        -webkit-transform: rotate(-45deg);
+        -ms-transform: rotate(-45deg);
+        transform: rotate(-45deg);
+        border-radius: 2px;
+    }
+    .item:hover{
+        color: #1890ff;
+    }
+    .selection{
+        color: #1890ff;
+        background: #fff;
+        border-color: #1890ff;
+    }
+    .item.selection:hover{
+        // color: #1890ff;
+        color: #40a9ff;
+        background: #fff;
+        border-color: #40a9ff;
+    }
+    .item.selection:after{
+        border-left: 6px solid #1890ff;
+    }
+    .item:hover::after{
+        // border-color: #40a9ff;
+        border-left: 6px solid #40a9ff;
+    }
+    .bgcolor:hover{
+        color:rgba(0, 0, 0, 0.25);
+        background-color: #f5f5f5;
+        border-color: #d9d9d9;
+        cursor: not-allowed;
+    }
+    .bgcolor:hover::after{
+        // border-color: #40a9ff;
+        border-left: 6px solid #e0e0e0;
+    }
+    .bgcolor.selection:after{
+        border-left: 6px solid #e0e0e0;
+    }
+    .bgcolor.selection{
+        color:rgba(0, 0, 0, 0.25);
+        background-color: #f5f5f5;
+        border-color: #d9d9d9;
+        cursor: not-allowed;
+    }
+    .bgcolor.selection:hover{
+        // color: #1890ff;
+        color:rgba(0, 0, 0, 0.25);
+        background-color: #f5f5f5;
+        border-color: #d9d9d9;
+        cursor: not-allowed;
+    }
+    .bgcolor.selection:after{
+        border-left: 6px solid #e0e0e0;
+    }
+}
+.radioCheck .item:first-child {
+    border-radius: 5px 0 0 5px;
+    border-left: 1px solid #ccc;
+}
+.radioCheck .item.selection:first-child {
+    border-radius: 5px 0 0 5px;
+    border-left: 1px solid #1890ff;
+}
+.radioCheck .item.selection:nth-child(2) {
+    
+    border-left: 1px solid #1890ff;
+}
+.radioCheck .item:first-child:after{
+    border-left: 0;
+}
+.radioCheck .item:last-child {
+    border-radius: 0px 5px 5px 0px;
+}
+</style>

+ 376 - 0
src/components/formComponents/selectGroup.vue

@@ -0,0 +1,376 @@
+<template>
+  <a-select
+    :title="title"
+    v-model="selectedVal"
+    :collapse-tags="collapseTags"
+    :placeholder="placeholder"
+    :allow-create="allowCreate"
+    :allowClear="allowClear"
+    :mode="multiple ? 'multiple' : 'default'"
+    :disabled="disabled"
+    :filterOption="filterOptionAll"
+    :remote="remote"
+    :remote-method="remoteMethod"
+    :maxTagCount="maxTagCount"
+  >
+    <a-select-option v-for="(item, index) in filterOption" :value="item.value" :key="'select' + item.value + index">
+      {{ item.label }}
+    </a-select-option>
+  </a-select>
+</template>
+<script>
+// import { dictionary } from '@/components/service/core/dictionary'
+// import { queryParaCascByIdAndParamType } from '@/components/service/core/sysConfig'
+import { isArray } from '@/utils/Tools'
+import { httpAction, getAction } from '@/api/manage'
+export default {
+  name: 'selectPara',
+  props: {
+    code: {
+      // 字典代码
+      type: String,
+      default: '',
+    },
+    require: {
+      type: Boolean,
+      default() {
+        return false
+      },
+    },
+    value: {
+      // v-model绑定值
+      type: [String, Array, Number, Boolean],
+      default() {
+        if (this.multiple) return []
+        else return ''
+      },
+    },
+    label: {
+      // label值
+      type: [String, Array, Number],
+      default() {
+        if (this.multiple) {
+          return []
+        }
+        if (!this.multiple) {
+          return ''
+        }
+      },
+    },
+    collapseTags: {
+      // 多选时是否将选中值按文字的形式展示
+      type: Boolean,
+      default: false,
+    },
+    placeholder: {
+      type: String,
+      default: '请选择',
+    },
+    options: {
+      // 外部传入的options 可代替自带的请求项
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    allowCreate: {
+      // 是否允许创建新条目
+      type: Boolean,
+      default: false,
+    },
+    defaultFirstOption: {
+      // 按回车键 选择第一项
+      type: Boolean,
+      default: false,
+    },
+    allowClear: {
+      // 选项是否可清除
+      type: Boolean,
+      default: true,
+    },
+    disabled: {
+      // 是否禁用
+      type: Boolean,
+      default: false,
+    },
+    multiple: {
+      // 是否多选
+      type: Boolean,
+      default: false,
+    },
+    filterable: {
+      // 模糊搜索
+      type: Boolean,
+      default: false,
+    },
+    remote: {
+      // 远程搜索
+      type: Boolean,
+      default: false,
+    },
+    remoteMethod: {
+      // 远程搜索方法
+      type: Function,
+      default: () => {
+        console.error('没有配置远程搜索方法!')
+      },
+    },
+    disabledChange: {
+      // 禁用change事件
+      type: Boolean,
+      default: false,
+    },
+    enable: {
+      // 允许选择的项   为空数组全显示,不为空数组只显示规定的选项
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    casCode: {
+      // 下级级联参数的code
+      type: String,
+      default: '',
+    },
+    casVal: {
+      // 下级参数绑定值
+      type: [String, Number],
+      default: '',
+    },
+    casLabel: {
+      // 下级参数绑定label
+      type: String,
+      default: '',
+    },
+    casOpt: {
+      // 级联参数options
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    maxTagCount: {
+      type: Number,
+      default() {
+        return 2
+      },
+    },
+  },
+  data() {
+    return {
+      selectOption: [],
+      visible: false,
+      label_tmp: null,
+    }
+  },
+  watch: {
+    options(val) {
+      if (isArray(val)) {
+        this.selectOption.splice(0, this.selectOption.length)
+        this.selectOption.push(...val)
+      }
+    },
+    value(val, oldVal) {
+      if (!this.valueEquals(val, oldVal)) {
+        this.selectChange(val)
+      }
+    },
+  },
+  computed: {
+    selectedVal: {
+      get: function () {
+
+        return this.value
+      },
+      set: function (val) {
+        this.$emit('input', val)
+      },
+    },
+    filterOption() {
+      // 过滤后的下拉项
+      if (this.enable.length == 0) {
+        return this.selectOption
+      } else {
+        return this.selectOption.filter((v) => this.enable.findIndex((item) => item == v.value) > -1)
+      }
+    },
+    title() {
+      // title提示文字
+      // if (!this.multiple) {
+      //   return this.filterOption.filter((v) => v.value == this.value).length == 1
+      //     ? this.filterOption.filter((v) => v.value == this.value)[0].label
+      //     : ''
+      // } else if (this.multiple) {
+      //   return this.filterOption
+      //     .filter((item) => {
+      //       return this.value.findIndex((v) => v == item.value) > -1
+      //     })
+      //     .map((item2) => item2.label)
+      // }
+      // if (this.enable.length > 0) {
+      //   return this.filterOption.map((v) => v.label)
+      // }
+    },
+  },
+  mounted() {
+    this.$nextTick(() => {
+      if (this.code && this.options.length == 0) {
+        // 如果code值不为空且options.lengt==0, 则去请求字典项
+        this.getOptions()
+      } else {
+        // 否则将外部传入的options显示到下拉框中
+        this.selectOption.splice(0, this.selectOption.length)
+        this.selectOption.push(...this.options)
+        this.setDefaultVal(this.selectOption)
+      }
+    })
+  },
+  methods: {
+    filterOptionAll(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    getOptions() {
+      // 获取字典项
+
+      getAction('/sys/dictItem/list', { dictId: this.code, pageSize: 1000, pageNo: 1 }).then((res) => {
+        if (res.success && isArray(res.result.records)) {
+          let data = res.result.records
+          data = data.map((v) => {
+            return {
+              ...v,
+              label: v.itemText,
+              value: v.itemValue+"",
+            }
+          })
+          if (!this.multiple && !this.require) {
+            data.unshift({ label: '不限', value: 'unlimited' })
+            if (this.value == ''|| this.value == null || this.value.length == 0 ) {
+              this.selectedVal = ['unlimited']
+            }
+          } else {
+            if (this.value == ''|| this.value == null || this.value.length == 0 ) {
+              this.selectedVal = []
+              this.$emit('clearValidate', this.selectedVal)
+            }
+          }
+          this.selectOption.splice(0, this.selectOption.length)
+          this.selectOption.push(...data)
+          this.setDefaultVal(this.selectOption)
+        }
+      })
+    },
+    selectChange(val) {
+      // 选择change事件
+      if (this.multiple) {
+        // 多选
+        if (isArray(val) && val.length == 0) {
+          this.$emit('update:label', [])
+          this.emitChange([], [])
+          return
+        }
+        if (isArray(val) && val.length > 0) {
+          this.label_tmp = val.map((v) => {
+            let item = this.selectOption.find((n) => {
+              return n.value == v
+            })
+            if (item) {
+              return item.label
+            }
+          })
+          this.$emit('update:label', this.label_tmp)
+          this.emitChange(val, this.label_tmp)
+        }
+      }
+
+      if (!this.multiple) {
+        // 单选
+        if (!this.valueEquals(val, this.selectedVal)) return
+        if (!val) {
+          this.emitChange('', '', '')
+          this.$emit('update:label', '')
+          this.clearCascadeOpt()
+          return
+        }
+        let total = 0
+        let interval = window.setInterval(() => {
+          // 定时 解决下级级联参数没有触发change事件的问题
+          total++
+          let obj = this.selectOption.find((v) => v.value == val)
+          if (obj) {
+            this.$emit('update:label', obj.label)
+            this.emitChange(this.selectedVal, obj.id, obj.cId)
+            this.getCascadeOption(obj.id)
+            window.clearInterval(interval)
+          }
+          if (total >= 200) {
+            // 超过2秒 结束计数
+            window.clearInterval(interval)
+          }
+        }, 10)
+      }
+    },
+    valueEquals(a, b) {
+      // 比较两个值是否相同
+      if (a === b) return true
+      if (!(a instanceof Array)) return false
+      if (!(b instanceof Array)) return false
+      if (a.length !== b.length) return false
+      for (let i = 0; i !== a.length; ++i) {
+        if (a[i] !== b[i]) return false
+      }
+      return true
+    },
+    emitChange(...args) {
+      // 触发外部change方法
+      if (!this.disabledChange) {
+        setTimeout(() => {
+          this.$emit('change', ...args)
+        }, 1)
+      }
+    },
+    // 获取下级级联参数的options 开始==================
+    getCascadeOption(id) {
+      // 获取下级级联参数
+      if (!this.casCode) return
+      queryParaCascByIdAndParamType(id, this.casCode).then((res) => {
+        if (res.data.code == 1000) {
+          let data = res.data.data
+          if (isArray(data)) {
+            data = data.map((item) => {
+              return {
+                value: item.valStr,
+                label: item.name,
+                ...item,
+              }
+            })
+            this.$emit('update:casOpt', data)
+            this.clearCascadeVal()
+          }
+        }
+      })
+    },
+    clearCascadeOpt() {
+      // 清空下级级联参数
+      if (!this.casCode) return
+      this.$emit('update:casOpt', [])
+      this.clearCascadeVal()
+    },
+    clearCascadeVal() {
+      // 清空下级参数绑定值
+      this.$emit('update:casVal', '')
+      this.$emit('update:casLabel', '')
+    },
+    // 获取下级级联参数的options 结束==================
+    setDefaultVal(options = []) {
+      // 设置默认值(只有值为空的情况下可以设置默认值)
+      let def = options.find((v) => v.haveDefault == '1')
+      if (def) {
+        if (!this.value && this.value !== 0) {
+          this.$emit('input', def.value)
+          this.$emit('update:label', def.name)
+        }
+      }
+    },
+  },
+}
+</script>

+ 75 - 0
src/components/formComponents/timeRange.vue

@@ -0,0 +1,75 @@
+
+<template>
+  <div class="rang-picker">
+    <a-range-picker v-model="timeRange" :format="format" :allowClear="allowClear" :disabled-date="disabledDate" />
+  </div>
+</template>
+
+<script>
+// import { dictionary } from '@/components/service/core/dictionary'
+import { isArray } from '@/utils/Tools'
+import { httpAction, getAction } from '@/api/manage'
+import moment from 'moment'
+export default {
+  name: 'rang-picker', // 日期选择器组件二次封装
+  props: {
+    format: {
+      type: String,
+      default() {
+        return 'YYYY-MM-DD'
+      },
+    },
+    allowClear: {
+      type: Boolean,
+      default() {
+        return false
+      },
+    },
+    disabledDate: {
+      type: Function,
+      default(current) {
+        return current && current < moment().subtract(1, 'days')
+      },
+    },
+    value: {
+      // v-model绑定值
+      type: [Array, String],
+      default() {
+        return []
+      },
+    },
+    disabled: {
+      // 是否禁用
+      type: Boolean,
+      default: false,
+    },
+  },
+  components: {},
+  data() {
+    return {
+      selectOption: [],
+    }
+  },
+  watch: {},
+  computed: {
+    timeRange: {
+      get: function () {
+        return this.value
+      },
+      set: function (val) {
+        this.$emit('input', val)
+      },
+    },
+  },
+  mounted() {
+    this.$nextTick(() => {})
+  },
+  methods: {
+    emitChange(...args) {
+      // emit change事件
+      this.$emit('change', ...args)
+    },
+  },
+}
+</script>
+

+ 336 - 0
src/components/formComponents/toutiaoTime.vue

@@ -0,0 +1,336 @@
+<template>
+  <div class="calendar">
+    <table class="time_table table" v-on:mouseleave="mouseleave">
+      <thead>
+        <tr>
+          <th rowspan="2" style="width:120px">日期/时间(时)</th>
+        </tr>
+        <tr>
+          <th class="unselectable" colspan="2" v-for="(num, index) in numData" :key="index" style="width:50px">{{ num }}
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="(options, index) in timeData" :key="index">
+          <th scope="row">{{ options.date }}</th>
+          <td v-for="(timeItem, key) in options.time" :key="key" style="width:15px"
+            :class="[{ active_select: timeItem.isSelected, active_select_move: timeItem.show }]"
+            v-on:mousedown="mousedown(index, key)" v-on:mouseover="mouseover(index, key)"
+            v-on:mouseup="mouseup(index, key)" @click="showOne(index, key)"></td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+<script>
+  var arr = []
+  for (let i = 0; i < 48; i++) {
+    arr.push(i / 2)
+  }
+  export default {
+    name: 'calendar-table',
+    props: {
+      scheduleTime: {
+        type: String,
+        default () {
+          var str = ''
+          for (let i = 0; i < 7 * 48; i++) {
+            str += '0'
+          }
+          return str
+        }
+      }
+    },
+    data() {
+      return {
+        show: false,
+        numData: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, ],
+        // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, ],
+        dateTime: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+        timeData: [{
+            date: '周一',
+            time: []
+          },
+          {
+            date: '周二',
+            time: []
+          },
+          {
+            date: '周三',
+            time: []
+          },
+          {
+            date: '周四',
+            time: []
+          },
+          {
+            date: '周五',
+            time: []
+          },
+          {
+            date: '周六',
+            time: []
+          },
+          {
+            date: '周日',
+            time: []
+          }
+        ],
+        selectFlag: false,
+        max: {
+          x: 0,
+          y: 0
+        },
+        dataString: ''
+      }
+    },
+    methods: {
+      // handleClose(item) {
+      //   var index = Math.floor(item / 24)
+      //   var key = item % 7
+      //   if (this.timeData[index].time[key].value == false) {
+      //     if (this.timeData[index].time[key].isSelected) {
+      //       this.timeData[index].time[key].isSelected = false
+      //     } else {
+      //       this.$set(this.timeData[index].time[key], 'isSelected', true)
+      //     }
+      //   }
+      // },
+      showOne(index, key) {
+        //   this.timeData[index].time[key].isSelected = !this.timeData[index].time[key].isSelected
+      },
+      mousedown: function (index, key) {
+        this.selectStart = []
+        this.selectFlag = true
+        if (this.timeData[index].time[key].value == false) {
+          if (this.timeData[index].time[key].isSelected) {
+            this.timeData[index].time[key].isSelected = false
+          } else {
+            this.$set(this.timeData[index].time[key], 'isSelected', true)
+          }
+        }
+        this.selectStart.push({
+          index: index,
+          key: key
+        })
+      },
+      mouseover: function (index, key) {
+        // x 垂直方向  y 水平方向
+        if (this.selectFlag) {
+          if (index >= this.max.x) {
+            this.max.x = index
+          }
+          if (key >= this.max.y) {
+            this.max.y = key
+          }
+          var start = {
+            x: this.selectStart[0].index,
+            y: this.selectStart[0].key
+          }
+          var end = {
+            x: index,
+            y: key
+          }
+          for (var i = end.x; i <= this.max.x; i++) {
+            for (var j = end.y; j <= this.max.y; j++) {
+              this.$set(this.timeData[i].time[j], 'isSelected', false)
+            }
+          }
+          /* 渲染选中的区域 */
+          // for (var i = start.x; i <= end.x; i++) {
+          //   for (var j = start.y; j <= end.y; j++) {
+          //     // this.$set(this.timeData[i].time[j], 'isSelected', true)
+          //     this.$set(this.timeData[i].time[j], 'show', true)
+          //   }
+          // }
+          for (var i = start.x; i <= end.x; i++) {
+            for (var j = start.y; j <= end.y; j++) {
+              this.$set(this.timeData[i].time[j], 'isSelected', true)
+            }
+          }
+        }
+      },
+      mouseup: function (index, key) {
+        var start = {
+          x: this.selectStart[0].index,
+          y: this.selectStart[0].key
+        }
+        var end = {
+          x: index,
+          y: key
+        }
+        /* 渲染选中的区域 */
+        var data = []
+        var arr = []
+        //   for (let i = 0; i < this.timeData.length; i++) {
+        //     for (let j = 0; j < this.timeData[i].time.length; j++) {
+        //       this.timeData[i].time[j].show = false
+        //     }
+        //   }
+        arr = data.concat(
+          this.timeData[0].time,
+          this.timeData[1].time,
+          this.timeData[2].time,
+          this.timeData[3].time,
+          this.timeData[4].time,
+          this.timeData[5].time,
+          this.timeData[6].time
+        )
+        this.dataString = arr.map(item => {
+          if (item.isSelected) {
+            return 1
+          } else {
+            return 0
+          }
+        })
+        this.$emit('update:scheduleTime', this.dataString.join(''))
+        this.selectFlag = false
+        this.max = {
+          x: 0,
+          y: 0
+        }
+      },
+      mouseleave: function () {
+        this.selectFlag = false
+      },
+      setItemDate(sum) {
+        let i = sum
+        if (i < 24) {
+          return '周一' + i + ':00~' + (i + 1) + ':00'
+        } else if (i < 48 && i >= 24) {
+          return '周二' + (i - 24) + ':00~' + (i - 23) + ':00'
+        } else if (i < 72 && i >= 48) {
+          return '周三' + (i - 48) + ':00~' + (i - 47) + ':00'
+        } else if (i < 96 && i >= 72) {
+          return '周四' + (i - 72) + ':00~' + (i - 71) + ':00'
+        } else if (i < 120 && i >= 96) {
+          return '周五' + (i - 96) + ':00~' + (i - 95) + ':00'
+        } else if (i < 144 && i >= 120) {
+          return '周六' + (i - 120) + ':00~' + (i - 119) + ':00'
+        } else {
+          return '周日' + (i - 144) + ':00~' + (i - 143) + ':00'
+        }
+      },
+      init() {
+        var str = this.scheduleTime
+        var arr = str.split('')
+        this.timeData = [{
+            date: '周一',
+            time: []
+          },
+          {
+            date: '周二',
+            time: []
+          },
+          {
+            date: '周三',
+            time: []
+          },
+          {
+            date: '周四',
+            time: []
+          },
+          {
+            date: '周五',
+            time: []
+          },
+          {
+            date: '周六',
+            time: []
+          },
+          {
+            date: '周日',
+            time: []
+          }
+        ]
+        for (let i = 0; i < arr.length; i++) {
+          if (i < 48) {
+            this.timeData[0].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else if (i < 96 && i >= 48) {
+            this.timeData[1].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else if (i < 144 && i >= 96) {
+            this.timeData[2].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else if (i < 192 && i >= 144) {
+            this.timeData[3].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else if (i < 240 && i >= 192) {
+            this.timeData[4].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else if (i < 288 && i >= 240) {
+            this.timeData[5].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          } else {
+            this.timeData[6].time.push({
+              isSelected: arr[i] == 1 ? true : false,
+              move: false,
+              value: false
+            })
+          }
+        }
+      }
+    },
+    watch: {
+      scheduleTime: {
+        immediate: true, // immediate选项可以开启首次赋值监听
+        handler(newVal, oldVal) {
+          this.init()
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .time_table {
+    border: 1px solid #ccc;
+    border-collapse: collapse;
+  }
+
+  .time_table th,
+  .time_table td {
+    border: 1px solid #ccc;
+    text-align: center;
+  }
+
+  .time_table .unselectable {
+    width: 5px !important;
+    height: 30px;
+  }
+
+  .active_select {
+    background: cornflowerblue;
+  }
+
+  .active_select_move {
+    background: aqua;
+  }
+
+  * {
+    -webkit-touch-callout: none !important;
+    -webkit-user-select: none !important;
+    -moz-user-select: none !important;
+    -ms-user-select: none !important;
+    user-select: none !important;
+  }
+</style>

+ 46 - 34
src/components/music-list/music-list.vue

@@ -20,12 +20,7 @@
           <div class="list-name">
             <span>{{ item.name }}</span>
             <div class="list-menu">
-              <mm-icon
-                class="hover"
-                :type="getPlayIconType(item)"
-                :size="40"
-                @click.stop="selectItem(item, index)"
-              />
+              <mm-icon class="hover" :type="getPlayIconType(item)" :size="40" @click.stop="selectItem(item, index)" />
             </div>
           </div>
           <span class="list-artist">{{ item.singer }}</span>
@@ -37,10 +32,16 @@
               :size="40"
               @click.stop="deleteItem(item, index)"
             /> -->
-            <a class="hover list-menu-icon-del" style="font-size:16px" @click.stop="deleteItem(item, index)">下载</a>
+            <a class="hover list-menu-icon-del" style="font-size: 16px" @click.stop="deleteItem(item, index)">下载</a>
           </span>
-          <span v-else class="list-album">{{ item.album }}
-            <a class="hover list-menu-icon-del" style="font-size:16px;float:right;margin-right:10px" @click.stop="deleteItem(item, index)">下载</a>
+          <span v-else class="list-album"
+            >{{ item.album }}
+            <a
+              class="hover list-menu-icon-del"
+              style="font-size: 16px; float: right; margin-right: 10px"
+              @click.stop="deleteItem(item, index)"
+              >下载</a
+            >
           </span>
         </div>
         <slot name="listBtn"></slot>
@@ -55,21 +56,22 @@
 import { mapGetters, mapMutations } from 'vuex'
 import { format } from '@/utils/util'
 import MmNoResult from '@base/mm-no-result/mm-no-result'
+import { postAction, downFilePost } from '../../api/manage'
 
 const musicUrl = 'https://music.163.com/song/media/outer/url'
 export default {
   name: 'MusicList',
   components: {
-    MmNoResult
+    MmNoResult,
   },
   filters: {
-    format
+    format,
   },
   props: {
     // 歌曲数据
     list: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     /**
      *  0:显示专辑栏目(默认)
@@ -77,16 +79,16 @@ export default {
      */
     listType: {
       type: Number,
-      default: 0
-    }
+      default: 0,
+    },
   },
   data() {
     return {
-      lockUp: true // 是否锁定滚动加载事件,默认锁定
+      lockUp: true, // 是否锁定滚动加载事件,默认锁定
     }
   },
   computed: {
-    ...mapGetters(['playing', 'currentMusic'])
+    ...mapGetters(['playing', 'currentMusic']),
   },
   watch: {
     list(newList, oldList) {
@@ -95,17 +97,13 @@ export default {
       }
       if (newList.length !== oldList.length) {
         this.lockUp = false
-      } else if (
-        newList[newList.length - 1].id !== oldList[oldList.length - 1].id
-      ) {
+      } else if (newList[newList.length - 1].id !== oldList[oldList.length - 1].id) {
         this.lockUp = false
       }
-    }
+    },
   },
   activated() {
-    this.scrollTop &&
-      this.$refs.listContent &&
-      (this.$refs.listContent.scrollTop = this.scrollTop)
+    this.scrollTop && this.$refs.listContent && (this.$refs.listContent.scrollTop = this.scrollTop)
   },
   methods: {
     // 滚动事件
@@ -163,7 +161,7 @@ export default {
     getPlayIconType({ id: itemId }) {
       const {
         playing,
-        currentMusic: { id }
+        currentMusic: { id },
       } = this
       return playing && id === itemId ? 'pause-mini' : 'play-mini'
     },
@@ -171,18 +169,32 @@ export default {
     deleteItem(item, index) {
       // this.$emit('del', index) // 触发删除事件
       // console.log(item, index)
-      let downloadElement = document.createElement('a')
-      downloadElement.href = musicUrl + '?id=' + item.id + '.mp3'
-      downloadElement.download = item.name
-      downloadElement.target = '_blank'
-      document.body.appendChild(downloadElement)
-      downloadElement.click()
-      document.body.removeChild(downloadElement)
+      // let downloadElement = document.createElement('a')
+      // downloadElement.href = musicUrl + '?id=' + item.id + '.mp3'
+      // downloadElement.download = item.name
+      // downloadElement.target = '_blank'
+      // document.body.appendChild(downloadElement)
+      // downloadElement.click()
+      // document.body.removeChild(downloadElement)
+
+      downFilePost('/ctop/bytedanceMusicInfo/netEaseDownLoad', {
+        musicName: item.name,
+        musicUrl: musicUrl + '?id=' + item.id + '.mp3',
+      }).then((res) => {
+        const blob = new Blob([res], { type: 'audio/mpeg' })
+        const a = document.createElement('a')
+        const url = window.URL.createObjectURL(blob)
+        const filename = item.musicInfo.name
+        a.href = url
+        a.download = filename
+        a.click()
+        window.URL.revokeObjectURL(url)
+      })
     },
     ...mapMutations({
-      setPlaying: 'SET_PLAYING'
-    })
-  }
+      setPlaying: 'SET_PLAYING',
+    }),
+  },
 }
 </script>
 

+ 9 - 2
src/components/page/GlobalLayout.vue

@@ -1,7 +1,7 @@
 <template>
   <a-layout class="layout" :class="[device]">
-
     <template v-if="layoutMode === 'sidemenu'">
+
       <a-drawer
         v-if="device === 'mobile'"
         :wrapClassName="'drawer-sider ' + navTheme"
@@ -75,7 +75,9 @@
     </a-layout>
 
     <!-- <setting-drawer></setting-drawer> -->
+
   </a-layout>
+ 
 </template>
 
 <script>
@@ -122,11 +124,16 @@
     watch: {
       sidebarOpened(val) {
         this.collapsed = !val
+      },
+      device(n,o){
+        if(n=='desktop'){
+          this.menus = this.permissionMenuList
+        }
       }
     },
     created() {
       //--update-begin----author:scott---date:20190320------for:根据后台菜单配置,判断是否路由菜单字段,动态选择是否生成路由(为了支持参数URL菜单)------
-      //this.menus = this.mainRouters.find((item) => item.path === '/').children;
+      // this.menus = this.mainRouters.find((item) => item.path === '/').children;
       this.menus = this.permissionMenuList
       // 根据后台配置菜单,重新排序加载路由信息
       // console.log('----加载菜单逻辑----')

+ 237 - 216
src/components/uploadFile.vue

@@ -4,95 +4,105 @@
 </style>
 <template>
   <div class="upload-file">
-    <a-upload name="file" :multiple="multiple" list-type="picture-card" class="avatar-uploader"
-      action="https://media-1301855440.cos.ap-chongqing.myqcloud.com/" :before-upload="beforeUpload"
-      @change="handleChange" :accept="uploadType+'/'+(uploadType=='image'?'jpeg,image/jpg':'mp4')" :file-list="fileList"
-      :remove="removeFile" @preview="handlePreview" :disabled="loadingElse||disabled">
-      <div v-if="uploadType=='image'?fileList.length < fileCount:fileList.length<1">
-        <a-progress v-if='loadingElse' :percent="percent" :show-info="false" />
-        <div class="ant-upload-text">
-          点击上传
-        </div>
+    <a-upload
+      name="file"
+      :multiple="multiple"
+      list-type="picture-card"
+      class="avatar-uploader"
+      action="https://media-1301855440.cos.ap-chongqing.myqcloud.com/"
+      :before-upload="beforeUpload"
+      @change="handleChange"
+      :accept="uploadType + '/' + (uploadType == 'image' ? 'jpeg,image/jpg' : 'mp4')"
+      :file-list="fileList"
+      :remove="removeFile"
+      @preview="handlePreview"
+      :disabled="loadingElse || disabled"
+    >
+      <div v-if="fileList.length < fileCount || fileList.length < 1">
+        <a-progress v-if="loadingElse" :percent="percent" :show-info="false" />
+        <div class="ant-upload-text">点击上传</div>
       </div>
     </a-upload>
-    <div style="color:red">{{uploadType=='image'?'请上传jpg格式的图片,并且大小在2m之内':'请上传mp4格式,大小在100m之内'}}</div>
+    <div style="color: red" v-if="sizeCheck">
+      {{ uploadType == 'image' ? '请上传jpg格式的图片,并且大小在2m之内' : '请上传mp4格式,大小在100m之内' }}
+    </div>
     <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
-      <img alt="example" style="width: 100%" :src="previewImage" v-if="uploadType=='image'" />
+      <img alt="example" style="width: 100%" :src="previewImage" v-if="uploadType == 'image'" />
       <video :src="previewImage" v-else style="width: 100%" controls="controls">您的浏览器不支持 video 标签。</video>
     </a-modal>
   </div>
 </template>
 
 <script>
-  import {
-    stopOtherVideo,
-    closeAllVideoFun
-  } from '@/utils/videoControl' // 停止除当前外的其他视频播放,及停止所有视频播放的方法
-  import {
-    mapGetters
-  } from 'vuex'
-  import moment from 'moment'
+import { stopOtherVideo, closeAllVideoFun } from '@/utils/videoControl' // 停止除当前外的其他视频播放,及停止所有视频播放的方法
+import { mapGetters } from 'vuex'
+import moment from 'moment'
 
-  import BMF from 'browser-md5-file'
+import BMF from 'browser-md5-file'
 
-  import qs from 'qs'
-  var COS = require('cos-js-sdk-v5');
-  var cos = new COS({
-    SecretId: 'AKIDE6IpMi8fJQRCg1iuWzFajjRs43kbbets',
-    SecretKey: 'tXzuwMfplTTK3c9GFUyETilasvQfePu9',
-  });
-  var i = 0
-  const oneKB = 1024
+import qs from 'qs'
+var COS = require('cos-js-sdk-v5')
+var cos = new COS({
+  SecretId: 'AKIDE6IpMi8fJQRCg1iuWzFajjRs43kbbets',
+  SecretKey: 'tXzuwMfplTTK3c9GFUyETilasvQfePu9',
+})
+var i = 0
+const oneKB = 1024
 
-  function getBase64(file) {
-    return new Promise((resolve, reject) => {
-      const reader = new FileReader();
-      reader.readAsDataURL(file);
-      reader.onload = () => resolve(reader.result);
-      reader.onerror = error => reject(error);
-    });
-  }
-  export default {
-    name: 'upload-file',
-    components: {},
-    props: {
-      uploadType: { //上传类型  值为  image/video,同时目录名称也是这样
-        type: String,
-        default () {
-          return 'image'
-        }
-      },
-      multiple: { // true 可以批量上传  false 不可以
-        type: Boolean,
-        default () {
-          return true
-        }
+function getBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader()
+    reader.readAsDataURL(file)
+    reader.onload = () => resolve(reader.result)
+    reader.onerror = (error) => reject(error)
+  })
+}
+export default {
+  name: 'upload-file',
+  components: {},
+  props: {
+    uploadType: {
+      //上传类型  值为  image/video,同时目录名称也是这样
+      type: String,
+      default() {
+        return 'image'
       },
-      fileCount: { //最大上传数量
-        type: Number,
-        default () {
-          return 10
-        }
+    },
+    multiple: {
+      // true 可以批量上传  false 不可以
+      type: Boolean,
+      default() {
+        return true
       },
-      checkFile: { //返回promise方法,判读文件是否上传过,进行上传拦截
-        type: Function,
-        default () {
-          return Promise.resolve()
-        }
+    },
+    fileCount: {
+      //最大上传数量
+      type: Number,
+      default() {
+        return 10
       },
-      disabled: {
-        type: Boolean,
-        default () {
-          return false
-        }
+    },
+    checkFile: {
+      //返回promise方法,判读文件是否上传过,进行上传拦截
+      type: Function,
+      default() {
+        return Promise.resolve()
       },
-      value: {
-        type: [String, Array],
-        required: true
+    },
+    disabled: {
+      type: Boolean,
+      default() {
+        return false
       },
-      size: {
-        type: Number,
-        default () {
+    },
+    value: {
+      type: [String, Array],
+      required: true,
+    },
+    size: {
+      type: Number,
+      default() {
+        if (this.sizeCheck) {
           if (this.uploadType == 'image') {
             return 2048
           } else {
@@ -100,172 +110,178 @@
           }
         }
       },
-      onOversize: {
-        type: Function,
-        default () {
-          alert(`请选择${this.size}KB内的文件!`)
-        }
-      },
     },
-    data() {
-      return {
-        fileList: [],
-        loadingElse: false,
-        imageUrl: '',
-        percent: 0,
-        previewVisible: false,
-        previewImage: '',
-      }
+    sizeCheck: {
+      type: Boolean,
+      default() {
+        return true
+      },
     },
-    filters: {},
-    computed: {},
-    mounted() {
-
+    onOversize: {
+      type: Function,
+      default() {
+        alert(`请选择${this.size}KB内的文件!`)
+      },
     },
-    watch: {
-      //    fileListAll
-      value: {
-        immediate: true,
-        handler(n, o) {
-          if (this.fileList.length == 0) {
-            if (typeof n == 'object') {
-              this.fileList = n.map((item, index) => {
-                return {
-                  uid: index + 1,
-                  name: index + 1,
-                  status: 'done',
-                  url: item,
-                }
-              })
+  },
+  data() {
+    return {
+      fileList: [],
+      loadingElse: false,
+      imageUrl: '',
+      percent: 0,
+      previewVisible: false,
+      previewImage: '',
+    }
+  },
+  filters: {},
+  computed: {},
+  mounted() {},
+  watch: {
+    //    fileListAll
+    value: {
+      immediate: true,
+      handler(n, o) {
+        if (this.fileList.length == 0) {
+          if (typeof n == 'object') {
+            this.fileList = n.map((item, index) => {
+              return {
+                uid: index + 1,
+                name: index + 1,
+                status: 'done',
+                url: item,
+              }
+            })
+          } else {
+            if (n == '') {
+              this.fileList = []
             } else {
-              if (n == '') {
-                this.fileList = []
-              } else {
-                this.fileList = [{
+              this.fileList = [
+                {
                   uid: 1,
                   name: 1,
                   status: 'done',
                   url: n,
-                }]
-
-              }
-
-            }
-          } else {
-            if (n.length == 0 || n == '') {
-              this.clearAll()
+                },
+              ]
             }
           }
-
-        },
-        deep: true
-      }
-    },
-    methods: {
-      handleCancel() {
-        closeAllVideoFun()
-        this.previewVisible = false;
-      },
-      handleChange(info) {
-        if (info.file.status === 'uploading') {
-          this.loading = true;
-          return;
-        }
-        if (info.file.status === 'done') {
-          // Get this url from response in real world.
-          getBase64(info.file.originFileObj, imageUrl => {
-            this.imageUrl = imageUrl;
-            this.loading = false;
-          });
-        }
-      },
-      removeFile(file) {
-        // console.log(file)
-        var index = this.fileList.findIndex(v => v.uid === file.uid)
-        this.fileList.splice(index, 1)
-        this.$emit('removeUpload', file)
-      },
-      async handlePreview(file) {
-        if (!file.url && !file.preview) {
-          file.preview = await getBase64(file.originFileObj);
+        } else {
+          if (n.length == 0 || n == '') {
+            this.clearAll()
+          }
         }
-        this.previewImage = file.url || file.preview;
-        this.previewVisible = true;
       },
-      beforeUpload(file) {
-        this.percent = 0
-        this.loadingElse = true
-        const fileOvesize = (file.size > this.size * oneKB)
-        // console.log(fileOvesize)
-        if (fileOvesize) {
-          this.onOversize()
-          this.loadingElse = false
-          return
-        } else {
-          this.checkFile(file).then(res => {
+      deep: true,
+    },
+  },
+  methods: {
+    handleCancel() {
+      closeAllVideoFun()
+      this.previewVisible = false
+    },
+    handleChange(info) {
+      if (info.file.status === 'uploading') {
+        this.loading = true
+        return
+      }
+      if (info.file.status === 'done') {
+        // Get this url from response in real world.
+        getBase64(info.file.originFileObj, (imageUrl) => {
+          this.imageUrl = imageUrl
+          this.loading = false
+        })
+      }
+    },
+    removeFile(file) {
+      // console.log(file)
+      var index = this.fileList.findIndex((v) => v.uid === file.uid)
+      this.fileList.splice(index, 1)
+      this.$emit('removeUpload', file)
+    },
+    async handlePreview(file) {
+      if (!file.url && !file.preview) {
+        file.preview = await getBase64(file.originFileObj)
+      }
+      this.previewImage = file.url || file.preview
+      this.previewVisible = true
+    },
+    beforeUpload(file) {
+      this.percent = 0
+      this.loadingElse = true
+      const fileOvesize = file.size > this.size * oneKB
+      // console.log(fileOvesize)
+      if (fileOvesize && this.sizeCheck) {
+        this.onOversize()
+        this.loadingElse = false
+        return
+      } else {
+        this.checkFile(file)
+          .then((res) => {
             this.cosUpload(file)
-
-          }).catch(() => {
-            this.loadingElse = false
           })
-          return new Promise(function (resolve, reject) {
-            reject()
+          .catch(() => {
+            this.loadingElse = false
           })
+        return new Promise(function (resolve, reject) {
+          reject()
+        })
+      }
+    },
+    clearAll() {
+      this.fileList = []
+    },
+    cosUpload(file) {
+      var that = this
+      let date = new Date()
+      let y = date.getFullYear()
+      let MM = date.getMonth() + 1
+      MM = MM < 10 ? '0' + MM : MM
+      let d = date.getDate()
+      d = d < 10 ? '0' + d : d
+      var timeElse = new Date().getTime()
+      var arr = file.name.split('.')
 
-        }
-
-      },
-      clearAll() {
-        this.fileList = []
-      },
-      cosUpload(file) {
-        var that = this
-        let date = new Date()
-        let y = date.getFullYear()
-        let MM = date.getMonth() + 1
-        MM = MM < 10 ? '0' + MM : MM
-        let d = date.getDate()
-        d = d < 10 ? '0' + d : d
-        var timeElse = new Date().getTime()
-        var arr = file.name.split('.')
-
-        var str = ''
-        for (let i = 0; i < arr.length; i++) {
-          if (i == arr.length - 1) {} else {
-            if (i == arr.length - 2) {
-              str += arr[i]
-            } else {
-              str += (arr[i] + '.')
-            }
+      var str = ''
+      for (let i = 0; i < arr.length; i++) {
+        if (i == arr.length - 1) {
+        } else {
+          if (i == arr.length - 2) {
+            str += arr[i]
+          } else {
+            str += arr[i] + '.'
           }
-
         }
-        // console.log(str + '-' + timeElse + '.' + arr[arr.length - 1])
-        cos.putObject({
+      }
+      // console.log(str + '-' + timeElse + '.' + arr[arr.length - 1])
+      cos.putObject(
+        {
           Bucket: 'media-1301855440',
           /* 必须 */
           Region: 'ap-chongqing',
           /* 存储桶所在地域,必须字段 */
-          Key: that.uploadType + '/' + y + '-' + MM + '-' + d + '/' + str + '-' + timeElse + '.' + arr[arr
-            .length - 1],
+          Key: that.uploadType + '/' + y + '-' + MM + '-' + d + '/' + str + '-' + timeElse + '.' + arr[arr.length - 1],
           /* 必须 */
           StorageClass: 'STANDARD',
           Body: file, // 上传文件对象
-          onProgress: function (progressData) { //进度条方法
+          onProgress: function (progressData) {
+            //进度条方法
 
-            that.percent = (progressData.percent * 100)
+            that.percent = progressData.percent * 100
           },
           onTaskReady: function (tid) {
             // console.log('onTaskReady', tid);
           },
-          onTaskStart: function (info) { //开始上传
+          onTaskStart: function (info) {
+            //开始上传
             // console.log('onTaskStart', info);
           },
-        }, function (err, data) {
+        },
+        function (err, data) {
           if (err) {
             that.loadingElse = false
             that.$message.error('上传失败!!!' + err)
-            return;
+            return
           }
           // alert('成功')
           that.loadingElse = false
@@ -283,24 +299,29 @@
             that.$emit('overUpload', that.fileList)
 
             if (that.multiple) {
-              that.$emit('update:value', that.fileList.map(item => {
-                return item.url
-              }))
+              that.$emit(
+                'update:value',
+                that.fileList.map((item) => {
+                  return item.url
+                })
+              )
             } else {
-              that.$emit('update:value', that.fileList.map(item => {
-                return item.url
-              })[0])
+              that.$emit(
+                'update:value',
+                that.fileList.map((item) => {
+                  return item.url
+                })[0]
+              )
             }
-
-
           } else {
             that.$message.error('上传已达上限' + that.fileCount + '张')
           }
-        });
-      }
-    }
-  }
+        }
+      )
+    },
+  },
+}
 </script>
 <style scoped>
-  @import '~@assets/less/common.less';
+@import '~@assets/less/common.less';
 </style>

+ 6 - 3
src/mixins/JeecgListMixin.js

@@ -314,9 +314,12 @@ export const JeecgListMixin = {
       this.loadData(1);
     },
     handleDetail: function (record) {
-      this.$refs.modalForm.edit(record);
-      this.$refs.modalForm.title = "详情";
-      this.$refs.modalForm.disableSubmit = true;
+      this.$nextTick(()=>{
+        this.$refs.modalForm.edit(record);
+        this.$refs.modalForm.title = "详情";
+        this.$refs.modalForm.disableSubmit = true;
+      })
+      
     },
     /* 导出 */
     handleExportXls2() {

+ 2 - 2
src/store/modules/app.js

@@ -35,9 +35,9 @@ const app = {
       Vue.ls.set(SIDEBAR_TYPE, type)
     },
     CLOSE_SIDEBAR: (state, withoutAnimation) => {
-      Vue.ls.set(SIDEBAR_TYPE, true)
+      Vue.ls.set(SIDEBAR_TYPE, false)
       state.sidebar.opened = false
-      state.sidebar.withoutAnimation = withoutAnimation
+      state.sidebar.withoutAnimation = false
     },
     TOGGLE_DEVICE: (state, device) => {
       state.device = device

+ 342 - 0
src/utils/Tools.js

@@ -0,0 +1,342 @@
+
+
+export const pickerOptions = [{
+        text: "今天",
+        onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime());
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "昨天",
+        onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setDate(start.getDate() - 1);
+            end.setDate(end.getDate() - 1);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "最近七天",
+        onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "最近30天",
+        onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "本月",
+        onClick(picker) {
+            const start = new Date();
+            const end = new Date(start);
+            end.setMonth(start.getMonth() + 1);
+            end.setDate(0);
+            start.setDate(1);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "上个月",
+        onClick(picker) {
+            const start = new Date();
+            const end = new Date(start);
+            end.setMonth(start.getMonth());
+            start.setMonth(start.getMonth() - 1);
+            end.setDate(0);
+            start.setDate(1);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "去年",
+        onClick(picker) {
+            const endYear = new Date().getFullYear() - 1;
+            const startYear = new Date().getFullYear() - 1;
+            const start = new Date(startYear, 0, 1);
+            const end = new Date(endYear, 11, 31);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "今年",
+        onClick(picker) {
+            const endYear = new Date().getFullYear();
+            const startYear = new Date().getFullYear();
+            const start = new Date(startYear, 0, 1);
+            const end = new Date(endYear, 11, 31);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+    {
+        text: "最近一年",
+        onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setFullYear(start.getFullYear() - 1);
+            picker.$emit('pick', [start, end]);
+        }
+    },
+];
+
+/**
+ * tree 形结构格式化
+ * @param {any} data 
+ */
+export const initTree = {
+
+}
+
+/**
+ * 判断是否是数组
+ * @param {Array} arr 
+ */
+export const isArray = (arr) => {
+    return Object.prototype.toString.call(arr) == '[object Array]'
+}
+
+/**
+ * 手机号屏蔽
+ */
+export const hidePhone = (num) => {
+    if (num) {
+        let newNum = String(num);
+        return newNum.replace(/^(\d{3})\d{4}(\d{4})$/, '$1****$2');
+    }
+}
+/**
+ * 时间格式转化
+ * @param {Array} arr 
+ */
+export const dateReturn1 = (date1) => {
+    date1.toLocaleString("en-US", {
+        hour12: false
+    }).replace(/\b\d\b/g, '0><').replace(new RegExp('/', 'gm'), '-');
+}
+/**
+ * 十五分钟倒计时
+ * @param {Array}string
+ */
+export const fiftyDate = () => {
+    let now = new Date();
+    var hour = now.getHours();
+    var minu = now.getMinutes();
+    var sec = now.getSeconds();
+    if (hour < 10) hour = "0" + hour;
+
+    if (minu < 10) minu = "0" + minu;
+
+    if (sec < 10) sec = "0" + sec;
+    var time = "";
+    time = hour + ":" + minu + ":" + sec
+    console.info('倒计时--->', time);
+}
+
+/**
+ * 输入框单字节计算
+ * @param string
+ */
+export const strSubleng = (str) => {
+    var len = 0;
+    for (var i = 0; i < str.length; i++) {
+        var c = str.charCodeAt(i);
+        if ((c >= 0x0001 && c <= 0x007e) || (0xff60 <= c && c <= 0xff9f)) { //单字节加1
+            len++;
+        } else {
+            len += 2;
+        }
+    }
+    return len;
+}
+/**
+ * 截取路由参数
+ * @param string
+ */
+export const subparams = (str) => {
+    //let search = location.search;
+    let params = {};
+    if (str != "") {
+        str.slice(1).split("&").forEach((v) => {
+            let arr = v.split("=");
+            params[arr[0]] = arr[1];
+        })
+    }
+    return params;
+}
+
+/**
+ * get url 对象序列化
+ * @param string
+ */
+export const http_builder_url = (url, data) => {
+    if (typeof (url) == 'undefined' || url == null) {
+        return '';
+    }
+    if (typeof (data) == 'undefined' || data == null || typeof (data) != 'object') {
+        return '';
+    }
+    url += (url.indexOf("?") != -1) ? "" : "?";
+    for (var k in data) {
+        url += ((url.indexOf("=") != -1) ? "&" : "") + k + "=" + encodeURI(data[k]);
+        console.log(url);
+    }
+    return url;
+}
+
+/**
+ * 存储localStorage
+ * @param {any} data 
+ */
+export const setStore = (name, content) => {
+    if (!name) return
+    if (typeof content !== 'string') {
+        content = JSON.stringify(content);
+    }
+    window.localStorage.setItem(name, content);
+}
+/**
+ * 获取localStorage
+ * @param {any} data 
+ */
+export const getStore = name => {
+    if (!name) return;
+    return window.localStorage.getItem(name);
+}
+/**
+ *删除localStorage
+ * @param {any} data 
+ */
+export const removeStore = name => {
+    if (!name) return;
+    window.localStorage.removeItem(name);
+}
+
+/**
+ *去除字符串中逗号
+ * @param {any} data 
+ */
+export const clear = str => {
+    str = str.replace(/,/g, '')
+    return str;
+}
+
+/**
+ * 全屏显示
+ * @param {any} data 
+ */
+export const requestFullScreen = () => {
+    let elem = document.documentElement;
+    if (elem.requestFullscreen) {
+        elem.requestFullscreen()
+    } else if (elem.mozRequestFullScreen) {
+        elem.mozRequestFullScreen()
+    } else if (elem.webkitRequestFullScreen) {
+        elem.webkitRequestFullScreen()
+    } else if (elem.msRequestFullscreen) {
+        document.body.msRequestFullscreen()
+    }
+}
+/**
+ * 退出全屏
+ * @param {any} data 
+ */
+export const exitFullscreen = () => {
+    let doc = document
+    if (doc.exitFullscreen) {
+        doc.exitFullscreen()
+    } else if (doc.mozCancelFullScreen) {
+        doc.mozCancelFullScreen()
+    } else if (doc.webkitCancelFullScreen) {
+        doc.webkitCancelFullScreen()
+    } else if (doc.msExitFullscreen) {
+        document.msExitFullscreen()
+    }
+}
+
+
+/**
+ * 将简单数据格式转换成嵌套的数据格式
+ * @param {Object} setting 
+ * @param {Array} sNodes 
+ */
+export const transformTozTreeFormat = (sNodes, setting={}) => { 
+    var i, l,
+        key = setting.idKey || 'id',
+        parentKey = setting.parentKey || 'parentId',
+        childKey = setting.childKey || 'children';
+    if (!key || key == "" || !sNodes) return [];
+
+    if (isArray(sNodes)) {
+        var r = [];
+        var tmpMap = {};
+        for (i = 0, l = sNodes.length; i < l; i++) {
+            tmpMap[sNodes[i][key]] = sNodes[i];
+        }
+        for (i = 0, l = sNodes.length; i < l; i++) {
+            if (tmpMap[sNodes[i][parentKey]] && sNodes[i][key] != sNodes[i][parentKey]) {
+                if (!tmpMap[sNodes[i][parentKey]][childKey])
+                    tmpMap[sNodes[i][parentKey]][childKey] = [];
+                tmpMap[sNodes[i][parentKey]][childKey].push(sNodes[i]);
+            } else {
+                r.push(sNodes[i]);
+            }
+        }
+        return r;
+    } else {
+        return [sNodes];
+    }
+}
+
+/**
+ * 将嵌套的数据格式转换成简单数据格式
+ * @param {Object} setting 
+ * @param {Array} nodes 
+ */
+export const transformToArrayFormat = (nodes, setting={}) => {
+    if (!nodes) return [];
+    var childKey = setting.childKey || 'children',
+        r = [];
+    if (isArray(nodes)) {
+        for (var i = 0, l = nodes.length; i < l; i++) {
+            r.push(nodes[i]);
+            if (nodes[i][childKey])
+                r = r.concat(transformToArrayFormat(nodes[i][childKey], setting));
+        }
+    } else {
+        r.push(nodes);
+        if (nodes[childKey])
+            r = r.concat(transformToArrayFormat(nodes[childKey], setting));
+    }
+    return r;
+}
+
+/**将对象转换成url查询格式
+ * 
+ * @param {} url 
+ * @param {*} data 
+ */
+export const changeParam = (url, data) => {
+    if(typeof(url) == 'undefined' || url == null) {
+        return '';
+    }
+    if(typeof(data) == 'undefined' || data == null || typeof(data) != 'object') {
+        return '';
+    }
+    url += (url.indexOf("?") != -1) ? "" : "?";
+    for(var k in data) {
+        url += ((url.indexOf("=") != -1) ? "&" : "") + k + "=" + encodeURI(data[k]);
+    }
+    return url;
+}

+ 1 - 1
src/views/modules/BatchCreate/TouTiaoBatch.vue

@@ -986,7 +986,7 @@ export default {
                                 pageSize:this.ipagination.pageSize,
                                 
                             })
-                            this.$message.success(res.message)
+                        this.$message.success(res.message)
                     }else{
                         this.$message.error(res.message)
                     }

+ 21 - 13
src/views/modules/Statistics/components/Treeselect.vue

@@ -57,6 +57,12 @@ export default {
         return true
       },
     },
+    appId: {
+      
+      default() {
+        return ''
+      },
+    },
     //判断媒体类型
     request: {
       type: String,
@@ -77,19 +83,21 @@ export default {
   },
   watch: {
     $route(n, o) {},
-    //   appId: {
-    //     handler(n, o) {
-    //       console.log(n)
-    //       if (n.length == 0) {
-    //         if (this.multiple) {
-    //           this.value = []
-    //         } else {
-    //           this.value = ''
-    //         }
-    //       }
-    //     },
-    //     deep: true
-    //   }
+      appId: {
+        handler(n, o) {
+          console.log(n)
+          if (n.length == 0) {
+            if (this.multiple) {
+              this.value = []
+            } else {
+              this.value = undefined
+            }
+          }else{
+            this.value=this.appId
+          }
+        },
+        deep: true
+      }
   },
   methods: {
     ...mapGetters(['nickname', 'avatar', 'userInfo']),

+ 3 - 4
src/views/modules/Statistics/components/datePick.vue

@@ -163,16 +163,15 @@ export default {
       
     },
     disabledDate(current) {
-      // console.log(current)
-
-      return current && current > moment().subtract(1, 'day')
+        return current && current > moment()
     },
     openChange(open) {
       // console.log(open)
     }
   },
   mounted() {
-    this.mydateValue = [moment(), moment()]    
+    this.mydateValue = this.dateValue;
+    this.active=this.type
     // console.log(this.$refs.pickOptions.style.left)
   }
 

+ 186 - 52
src/views/modules/Statistics/imageStatics/imageCostReport.vue

@@ -33,17 +33,19 @@
         
     </div>
     <div class="timeDiv">
-      <div style="margin-right:30px">
+      <div style="margin-right:30px;display:flex;align-items: center;">
         <span>时间范围:</span>
 
-        <a-range-picker
+        <!-- <a-range-picker
           :disabled-date="disabledDate"
           format="YYYY-MM-DD"
           style="width: 250px;"
           @change="dateChange"
           v-model="dateRange"
-        />
-        
+        /> -->
+        <span  @click="opendate">
+          <DatePicker :openOptions='openOptions'  :parentDate='dateValue' left='-100px'></DatePicker>
+        </span> 
       </div>
       <div>
         <span>图片ID:</span>
@@ -82,19 +84,32 @@
             />
         </div>
         <span slot="cost" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="charge" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="activation" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="eventRegister" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="eventPay" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="formCount" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="eventJinJianApp" slot-scope="text">{{ text | decimalsHandle }}</span>
-        <span slot="eventCreditGrantApp" slot-scope="text">{{ text | decimalsHandle }}</span>
+        <span slot="cost" slot-scope="text">{{ text | decimalsHandle }}</span>
+        <span slot="convertCost" slot-scope="text">{{ text | decimalsHandle }}</span>
+        <span slot="photoShowCost" slot-scope="text">{{ text | decimalsHandle }}</span>
+        <span slot="aclickCost" slot-scope="text">{{ text | decimalsHandle }}</span>
+  
+        <span slot="activation" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="eventRegister" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="eventPay" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="formCount" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="eventJinJianApp" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="eventCreditGrantApp" slot-scope="text">{{ text | formatCurrency }}</span>
         <span slot="photoClick" slot-scope="text">{{ text | formatCurrency }}</span>
         <span slot="photoShow" slot-scope="text">{{ text | formatCurrency }}</span>
         <span slot="click" slot-scope="text">{{ text | formatCurrency }}</span>
         <span slot="showNum" slot-scope="text">{{ text | formatCurrency }}</span>
         <span slot="convert" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="bclick" slot-scope="text">{{ text | formatCurrency }}</span>
+        <span slot="aclick" slot-scope="text">{{ text | formatCurrency }}</span>
+
+        <span slot="clickRate" slot-scope="text">{{ text +'%'}}</span>
+        <span slot="convertRate" slot-scope="text">{{ text +'%'}}</span>
+        <span slot="bclickRate" slot-scope="text">{{ text +'%'}}</span>
+        <span slot="photoClickRate" slot-scope="text">{{ text +'%'}}</span>
         
+
+
         <span slot="operation" slot-scope="text">
          {{ text || '未绑定' }}
         </span>
@@ -127,7 +142,7 @@ import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
 
 import { TreeSelect } from 'ant-design-vue';
 const SHOW_PARENT = TreeSelect.SHOW_PARENT;
-
+import DatePicker from '@/components/DatePicker'
 // import selectComponent from './selectComponent'
 // import Treeselect from '../components/Treeselect'
 const TTcolumns = [
@@ -144,7 +159,7 @@ const TTcolumns = [
     title: '图片ID',
     dataIndex: 'signature',
     align: 'center',
-    width: 150,
+    width: 180,
     fixed: 'left'
   },
   {
@@ -165,12 +180,12 @@ const TTcolumns = [
   },
   
   {
-    title: '消耗',
+    title: '消耗(元)',
     dataIndex: 'cost',
 
     scopedSlots: { customRender: 'cost' },
     align: 'center',
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '点击数',
@@ -178,7 +193,16 @@ const TTcolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'click' },
-    // sorter: () => {}
+    sorter: () => {}
+    // (a, b) => a.clickMaterial - b.clickMaterial
+  },
+  {
+    title: '点击率',
+    dataIndex: 'clickRate',
+    align: 'center',
+
+    scopedSlots: { customRender: 'clickRate' },
+    sorter: () => {}
     // (a, b) => a.clickMaterial - b.clickMaterial
   },
   {
@@ -187,7 +211,7 @@ const TTcolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'showNum' },
-    // sorter: () => {}
+    sorter: () => {}
   },   
   {
     title: '转化数',
@@ -195,7 +219,23 @@ const TTcolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'convert' },
-    // sorter: () => {}
+    sorter: () => {}
+  },
+  {
+    title: '转化成本',
+    dataIndex: 'convertCost',
+    align: 'center',
+
+    scopedSlots: { customRender: 'convertCost' },
+    sorter: () => {}
+  },
+  {
+    title: '转化率',
+    dataIndex: 'convertRate',
+    align: 'center',
+
+    scopedSlots: { customRender: 'convertRate' },
+    sorter: () => {}
   },
   // {
   //   title: '上传时间',
@@ -241,36 +281,85 @@ const KScolumns = [
   
   {
     title: '消耗',
-    dataIndex: 'charge',
+    dataIndex: 'cost',
 
-    scopedSlots: { customRender: 'charge' },
+    scopedSlots: { customRender: 'cost' },
     align: 'center',
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
-    title: '点击数',
+    title: '封面点击数',
     dataIndex: 'photoClick',
     align: 'center',
 
     scopedSlots: { customRender: 'photoClick' },
-    // sorter: () => {}
+    sorter: () => {}
     // (a, b) => a.clickMaterial - b.clickMaterial
   },
   {
-    title: '展示数',
+    title: '封面点击率',
+    dataIndex: 'photoClickRate',
+    align: 'center',
+
+    scopedSlots: { customRender: 'photoClickRate' },
+    sorter: () => {}
+    // (a, b) => a.clickMaterial - b.clickMaterial
+  },
+  {
+    title: '封面曝光数',
     dataIndex: 'photoShow',
     align: 'center',
 
     scopedSlots: { customRender: 'photoShow' },
-    // sorter: () => {}
-  },   
+    sorter: () => {}
+  }, 
+  {
+    title: '素材曝光数',
+    dataIndex: 'aclick',
+    align: 'center',
+
+    scopedSlots: { customRender: 'aclick' },
+    sorter: () => {}
+  }, 
+  {
+    title: '行为数',
+    dataIndex: 'bclick',
+    align: 'center',
+
+    scopedSlots: { customRender: 'bclick' },
+    sorter: () => {}
+  }, 
+  {
+    title: '行为率',
+    dataIndex: 'bclickRate',
+    align: 'center',
+
+    scopedSlots: { customRender: 'bclickRate' },
+    sorter: () => {}
+  }, 
+  {
+    title: '平均千次封面曝光花费',
+    dataIndex: 'photoShowCost',
+    align: 'center',
+
+    scopedSlots: { customRender: 'photoShowCost' },
+    sorter: () => {}
+  }, 
+  {
+    title: '平均千次素材曝光花费',
+    dataIndex: 'aclickCost',
+    align: 'center',
+
+    scopedSlots: { customRender: 'aclickCost' },
+    sorter: () => {}
+  }, 
   {
     title: '激活数',
     dataIndex: 'activation',
     align: 'center',
 
     scopedSlots: { customRender: 'activation' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '注册数',
@@ -278,7 +367,7 @@ const KScolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'eventRegister' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '付费数',
@@ -286,7 +375,7 @@ const KScolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'eventPay' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '表单提交数',
@@ -294,7 +383,7 @@ const KScolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'formCount' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '完件数',
@@ -302,7 +391,7 @@ const KScolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'eventJinJianApp' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   {
     title: '授信数',
@@ -310,7 +399,7 @@ const KScolumns = [
     align: 'center',
 
     scopedSlots: { customRender: 'eventCreditGrantApp' },
-    // sorter: () => {}
+    sorter: () => {}
   },
   // {
   //   title: '上传时间',
@@ -327,6 +416,12 @@ let show = 0
 export default {
   data() {
     return {
+        type:0,
+        dateValue:[moment().subtract(1,'days'),moment().subtract(1,'days')],
+        openOptions:false,
+        order:'desc',
+        target:'cost',
+
         tabKeys:1,
         
         accountIds:[],
@@ -402,6 +497,7 @@ export default {
   components: {
     // selectComponent,
     // Treeselect
+    DatePicker,
   },
     methods: {
         tabChange(val){
@@ -411,10 +507,14 @@ export default {
           if(this.tabKeys==1){
                 this.treeData=this.TTaccountList;
                 this.columns=this.TTcolumns;
+                this.target='cost';
+                this.scrollX=0;
                 this.HttpPost('/image/bytedance/cost')
             }else if (this.tabKeys==2){
                 this.treeData=this.KSaccountList;
                 this.columns=this.KScolumns
+                this.target='cost'
+                this.scrollX=2500
                 this.HttpPost('/image/kuaishou/cost')
             } 
         },
@@ -472,13 +572,16 @@ export default {
         },
         sort(pagination, filters, sorter, { currentDataSource }){
             console.log(pagination, filters, sorter)
-            if(sorter.order == 'ascend'){
-                this.HttpPost(sorter.columnKey+'+')
-                return 
-            }else if(sorter.order == 'descend'){
-                this.HttpPost(sorter.columnKey+'-')
-                return 
-            }
+            if(sorter.order == 'ascend'){            
+              this.order='asc'
+              this.target=sorter.columnKey;
+          }else if(sorter.order == 'descend'){
+              this.order='desc'    
+              this.target=sorter.columnKey;
+          }else{            
+                this.target=this.tabKeys==1?'cost':'cost',
+                this.order='desc'           
+          }   
             this.ipagination.current=pagination.current
             this.ipagination.pageSize= pagination.pageSize;
 
@@ -532,13 +635,14 @@ export default {
           this.data=[]
           show = 0
           postAction(url, {
-              startDate: this.timedata[0],
-              endDate: this.timedata[1],        
+              startDate: this.dateValue[0].format('YYYY-MM-DD'),
+              endDate: this.dateValue[1].format('YYYY-MM-DD'),        
               code: this.videoID,
               pageNumber:this.ipagination.current,
               pageSize:this.ipagination.pageSize,
               accountList:this.accountIds,
-              // sort:sort?sort:''
+              order:this.order,
+              target:this.target,
           }).then(res => {
               let resArr = []
               this.loading=false;
@@ -578,10 +682,13 @@ export default {
         }
             
         downFilePost(url, {
-            startDate: this.timedata[0],
-              endDate: this.timedata[1],        
+              
+              startDate: this.dateValue[0].format('YYYY-MM-DD'),
+              endDate: this.dateValue[1].format('YYYY-MM-DD'),        
               code: this.videoID,
               accountList:this.accountIds,
+              order:this.order,
+              target:this.target,
         }).then(res => {
          
             let blob = new Blob([res], {
@@ -664,13 +771,34 @@ export default {
                             }
                             
                         }
+
+
                         });
                         // console.log(this.treeData)
 
+
+                      if(this.tabKeys==1){
+                        this.treeData=this.TTaccountList
+                      }else if(this.tabKeys==1){
+                        this.treeData=this.KSaccountList
+                      }else{
+                        console.log('数据出错')
+                      }
                     }
                 }
             })
         },
+
+        opendate(){
+          this.openOptions=!this.openOptions;
+            //  console.log(this.openOptions)
+        },
+        opendateClose(){
+              this.openOptions=false;
+              //  console.log(this.openOptions)
+        },
+
+
   },
   // watch:{
   //     'ipagination.current':function(n,o){
@@ -682,8 +810,7 @@ export default {
   filters: {
     
     toshowTime(val) {
-      // console.log(val, this.timedata)
-      // return this.timedata[0] + '~' + this.timedata[1]
+     
       return val
     },
     toPercentage(val) {
@@ -774,15 +901,22 @@ export default {
           
       }
   },
-
+  watch:{
+    dateValue:{
+        deep:true,
+        handler(){
+            if(this.tabKeys==1){               
+                this.HttpPost('/image/bytedance/cost')
+            }else if (this.tabKeys==2){
+                this.HttpPost('/image/kuaishou/cost')
+            } 
+        }
+      }
+  },
 
   mounted() {
     
-    //进入页面默认展示昨天到今天的数据
-    this.dateRange=[moment().subtract(1,'days'),moment()]
-    this.timedata=[moment().subtract(1
-    ,'days').format('YYYY-MM-DD'),moment().format('YYYY-MM-DD')]
-    // this.loading=true;
+   
    
     this.HttpPost('/image/bytedance/cost')
     this.accountHttp(1);

+ 2 - 2
src/views/modules/Statistics/mediaReport.vue

@@ -330,8 +330,8 @@
         if (this.advertiser == '' || this.advertiser == undefined) {
 
           this.project = undefined;
-		  this.projectArr = [];
-		  this.getPruduct()
+          this.projectArr = [];
+          this.getPruduct()
         } else {
           this.project = undefined;
           this.projectArr = [];

+ 388 - 100
src/views/modules/Statistics/newPlanStatic/newPlanStatic.vue

@@ -201,6 +201,7 @@
                 :maxTagCount='1'    
                 :tree-data="treeData"
                 :filterOption='filterOption'
+                :disabled='accountDisabled'
             >
              </a-tree-select>
 
@@ -213,16 +214,21 @@
               style="width: 200px"
               :filter-option="filterOption"
               @change="operateChange"
+              :disabled='operateDisabled'
+              allowClear
             >
-              <a-select-option v-for="item in operateList" :key="item.id" :value="item.id">
-                {{item.name}}
+              <a-select-option v-for="item in operateList" :key="item.user_id" :value="item.user_id">
+                {{item.user_name}}
               </a-select-option>
             </a-select> 
+            <a-button type='primary' style="position:absolute;right:20px" @click="search">查询</a-button>
         </div>
           <div class="time"  @click="opendate" >
             <datePick  :dateValue.sync='dateValue'   :type.sync='type'   />
+            
           </div>
           <!-- <p>对比</p> -->
+          
         </a-card>
       </a-col>
     </a-row>
@@ -230,8 +236,7 @@
       <div class="showNumBox">
           <a-col :sm="24" :md="10" :xl="10" :xxl="10">
             <span class="title">
-              新上
-              {{tabKey==1?'计划数':'推广组'}}
+              新上{{tabKey==1?'计划数':'推广组'}}
             </span>
             <div>
               <countTo
@@ -324,11 +329,11 @@ require('echarts/lib/component/legend')
 
 let TTcolumns=[
   {
-    title: '项目名称',
-    dataIndex: 'accountName',
-    scopedSlots: { customRender: 'accountName' },
+    title: '账户名称',
+    dataIndex: 'authName',
+    scopedSlots: { customRender: 'authName' },
     align: 'center',
-    key:'accountName'
+    key:'authName'
     
   },
   {
@@ -341,36 +346,88 @@ let TTcolumns=[
   },
   {
     title: '账户所属人',
-    dataIndex: 'people',
-    scopedSlots: { customRender: 'people' },
+    dataIndex: 'userName',
+    scopedSlots: { customRender: 'userName' },
     align: 'center',
-    key:'people'
+    key:'userName'
     
   },
   {
-    title: '新计划数',
-    dataIndex: 'newPlan',
-    scopedSlots: { customRender: 'newPlan' },
+    title: '新计划数',
+    dataIndex: 'new',
+    scopedSlots: { customRender: 'new' },
     align: 'center',
-    key:'newPlan'
+    key:'new'
     
   },
   {
-    title: '时间周期',
-    dataIndex: 'statDate',
-    scopedSlots: { customRender: 'statDate' },
+    title: '最近上新',
+    dataIndex: 'maxCreateTime',
+    scopedSlots: { customRender: 'maxCreateTime' },
     align: 'center',
-    key:'statDate'
+    key:'maxCreateTime'
     
   },
 ]
+let TTcolumnsVaild=[
+  {
+    title: '账户名称',
+    dataIndex: 'authName',
+    scopedSlots: { customRender: 'authName' },
+    align: 'center',
+    key:'authName'
+    
+  },
+  {
+    title: '账户ID',
+    dataIndex: 'accountId',
+    scopedSlots: { customRender: 'accountId' },
+    align: 'center',
+    key:'accountId'
+    
+  },
+  {
+    title: '账户所属人',
+    dataIndex: 'userName',
+    scopedSlots: { customRender: 'userName' },
+    align: 'center',
+    key:'userName'
+    
+  },
+  {
+    title: '有效计划数',
+    dataIndex: 'valid',
+    scopedSlots: { customRender: 'valid' },
+    align: 'center',
+    key:'valid'
+    
+  },
+  {
+    title: '最近上新',
+    dataIndex: 'maxCreateTime',
+    scopedSlots: { customRender: 'maxCreateTime' },
+    align: 'center',
+    key:'maxCreateTime'
+    
+  },
+]
+
+
 let KScolumns=[
+  // {
+  //   title: '项目名称',
+  //   dataIndex: 'projectName',
+  //   scopedSlots: { customRender: 'projectName' },
+  //   align: 'center',
+  //   key:'projectName'
+    
+  // },
   {
-    title: '项目名称',
-    dataIndex: 'accountName',
-    scopedSlots: { customRender: 'accountName' },
+    title: '账户名称',
+    dataIndex: 'authName',
+    scopedSlots: { customRender: 'authName' },
     align: 'center',
-    key:'accountName'
+    key:'authName'
     
   },
   {
@@ -383,29 +440,80 @@ let KScolumns=[
   },
   {
     title: '账户所属人',
-    dataIndex: 'people',
-    scopedSlots: { customRender: 'people' },
+    dataIndex: 'userName',
+    scopedSlots: { customRender: 'userName' },
     align: 'center',
-    key:'people'
+    key:'userName'
     
   },
   {
-    title: '新推广组',
-    dataIndex: 'newPlan',
-    scopedSlots: { customRender: 'newPlan' },
+    title: '新推广组',
+    dataIndex: 'new',
+    scopedSlots: { customRender: 'new' },
     align: 'center',
-    key:'newPlan'
+    key:'new'
     
   },
   {
-    title: '时间周期',
-    dataIndex: 'statDate',
-    scopedSlots: { customRender: 'statDate' },
+    title: '最近上新',
+    dataIndex: 'maxCreateTime',
+    scopedSlots: { customRender: 'maxCreateTime' },
     align: 'center',
-    key:'statDate'
+    key:'maxCreateTime'
     
   },
 ]
+let KScolumnsVaild=[
+  // {
+  //   title: '项目名称',
+  //   dataIndex: 'projectName',
+  //   scopedSlots: { customRender: 'projectName' },
+  //   align: 'center',
+  //   key:'projectName'
+    
+  // },
+  {
+    title: '账户名称',
+    dataIndex: 'authName',
+    scopedSlots: { customRender: 'authName' },
+    align: 'center',
+    key:'authName'
+    
+  },
+  {
+    title: '账户ID',
+    dataIndex: 'accountId',
+    scopedSlots: { customRender: 'accountId' },
+    align: 'center',
+    key:'accountId'
+    
+  },
+  {
+    title: '账户所属人',
+    dataIndex: 'userName',
+    scopedSlots: { customRender: 'userName' },
+    align: 'center',
+    key:'userName'
+    
+  },
+  {
+    title: '有效推广组',
+    dataIndex: 'valid',
+    scopedSlots: { customRender: 'valid' },
+    align: 'center',
+    key:'valid'
+    
+  },
+  {
+    title: '最近上新',
+    dataIndex: 'maxCreateTime',
+    scopedSlots: { customRender: 'maxCreateTime' },
+    align: 'center',
+    key:'maxCreateTime'
+    
+  },
+]
+
 
 
 
@@ -421,7 +529,7 @@ let sectionOption={
         }, 
     },
     legend: {
-        data: ['新上计划数','有效计划数']
+        data: ['新上推广组','有效推广组']
     },
     grid: {
         left: '2%',
@@ -430,10 +538,10 @@ let sectionOption={
         top: '12%',
         containLabel: true
     },
-    xAxis: [
+    xAxis: 
         {
             type: 'category',
-            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+            data: [],
             boundaryGap: false,
             // 坐标轴线
             axisLine: {
@@ -451,7 +559,7 @@ let sectionOption={
               }
             }
         }
-    ],
+    ,
     yAxis: [
         {
           type: 'value',
@@ -471,13 +579,14 @@ let sectionOption={
     ],
     series: [
         {
-            name: '新上计划数',
+            name: '新上推广组',
             type: 'line',
             smooth: true,
-            data:  [820, 932, 901, 934, 1290, 1330, 1320],
+            data:  [],
             symbol: 'circle',
+            symbolSize :8,
             color: '#0bcd74',
-            symbolSize: 1,
+           
             lineStyle: {
               normal: {
                 width: 2,
@@ -485,18 +594,18 @@ let sectionOption={
               }
             },
             itemStyle: {
-              borderColor: '#ffffff',
+              borderColor: '#fff',
               borderWidth: 3
             },
         },
         {
-            name: '有效计划数',
+            name: '有效推广组',
             type: 'line',
             smooth: true,
-            data:  [850, 952, 951, 954, 1250, 1530, 1520],           
+            data:  [],           
             symbol: 'circle',
             color: '#9933ff',
-            symbolSize: 1,
+            symbolSize: 8,
             lineStyle: {
               normal: {
                 width: 2,
@@ -524,35 +633,47 @@ export default {
 
   data: function() {
     return {
+      KSaccountList:[],
+      TTaccountList:[],
+
+      KSoperateList:[],
+      TToperateList:[],
+
+      accountDisabled:false,
+      operateDisabled:false,
+      userId:JSON.parse(localStorage.getItem('pro__Login_Userinfo')).value.id,
       duration: 1000,
     //treeselect的参数
       treeValue: [],
       treeData: [],
       SHOW_PARENT,
 
-      type:1,
-      dateValue:[moment(), moment()],
+      type:3,
+      dateValue:[moment().subtract(7,'days'), moment()],
 
       operate:'',
       operateList:[],
 
-      tabKey:1,
-      sectionOption,
+      tabKey:2,
+      sectionOption:JSON.parse(JSON.stringify(sectionOption)),
 
       loading: false,
       TTcolumns,
       KScolumns,
-      columns:[...TTcolumns],    
+      columns:[...KScolumns],    
       dataTable: [],
      
       tableTab:1,
 
-      newPlan:2222,
-      effectPlan:1000,
+      newPlan:0,
+      effectPlan:0,
      
       echartSpinning:false,
 
       openOptions:false,
+
+      target:'',
+      order:'desc',
     }
   },
   methods: {
@@ -563,6 +684,8 @@ export default {
       this.accountId = [];
       //选择一个后禁用其他
       if(val.length==1){
+        this.operateDisabled=true;
+        this.opendate=''
           if(val[0]*1){
             let selectindex=0
               this.treeData.forEach((ele,index)=>{                   
@@ -607,16 +730,7 @@ export default {
               })
           }
           // console.log(this.mediaId)
-          if(this.mediaId=='1'){
-            
-              this.discountDisabled=true;
-              this.rebatePropDisabled=false;
-              this.discount=this.rebateProp;
-          }else{
-            this.rebatePropDisabled=true;
-            this.discountDisabled=false;
-            this.discount=this.discountSelect;
-          }
+          
       }
 
       if(val.length==0){
@@ -630,9 +744,9 @@ export default {
                 }
               
           });
-        this.rebatePropDisabled=false;
-        this.discountDisabled=false;
-        this.discount=1.0  
+        this.operateDisabled=false;
+        this.operate=this.userId
+        // this.accountDisabled=true
       }
       if(val){
         val.forEach((ele,index)=>{
@@ -662,7 +776,8 @@ export default {
     disabledDate(current) {
       // console.log(current)
 
-       return current && current > moment().subtract(1, 'day')
+      //  return  current && current > moment().add(1, 'day')
+      return moment().endOf('day');
     },
     filterOption(input, option){
       console.log(input, option)
@@ -682,15 +797,27 @@ export default {
       
       if(key==1){
         // toutiao
-        this.columns=[...TTcolumns]
+        this.treeData=this.TTaccountList;
+        this.operateList=this.TToperateList
+        this.columns=this.tableTab==1?[...TTcolumns]:[...TTcolumnsVaild]
+        this.sectionOption.legend.data=['新上计划数','有效计划数']
       }else{
         // kuaishou
-        this.columns=[...KScolumns]
+        this.operateList=this.KSoperateList
+        this.treeData=this.KSaccountList;
+        this.columns=this.tableTab==1?[...KScolumns]:[...KScolumnsVaild]
+        this.sectionOption.legend.data=['新上推广组','有效推广组']
       }
-      this.accountHttp()
+      this.getNewPlan()
     },
     operateChange(value){
-      console.log(value)
+      console.log(value);
+      if(value){
+        this.accountDisabled=true;
+        this.accountId=''
+      }else{
+        this.accountDisabled=false
+      }
     },
 
     //初始化chart
@@ -710,7 +837,16 @@ export default {
     moment,
     // table区域的tab切换
     tableTabChange(key){
-
+      if(key==1){
+       
+        this.columns=this.tabKey==1?[...TTcolumns]:[...KScolumns]
+        this.target='new'
+      }else{
+        
+        this.columns=this.tabKey==1?[...TTcolumnsVaild]:[...KScolumnsVaild]
+        this.target='valid'
+      }
+      this.getNewPlan()
     },
     //处理echart
     sectionHttp(params) {
@@ -793,37 +929,65 @@ export default {
 
 
      //请求项目和账户内容
-    accountHttp(){
-     this.treeData=[];
-     this.treeValue=[];
-     getAction(`/ctop/projectMember/getProjectAccountByUserId?mediaType=${this.tabKey}`, {}).then(res => {
+    accountHttp(key){
+      this.treeData=[]
+      this.treeValue=[];
+     getAction(`/ctop/projectMember/getProjectAccountByUserId?mediaType=${key}`, {}).then(res => {
        if(res.success){
             // console.log(res);
+            
             if(res.result){
-                res.result.forEach((element,index) => {
-                  if(element){                  
-                      this.treeData.push({});                    
-                      this.treeData[index].title=element.project.projectName +'_('+ element.project.advertiserName +')';
-                      this.treeData[index].value='project'+element.project.projectId;
-                      this.treeData[index].key=element.project.projectId;
-                      this.treeData[index].mediaId=element.project.mediaId;
-                      this.treeData[index].children=[];
-                                          
-                    if(element.account.length){
-                      element.account.forEach((ele,i)=>{
-                          this.treeData[index].children.push({});
-                          this.treeData[index].children[i].title=ele.userName+'_'+ele.authName+'_'+element.project.projectName +'_('+(ele.accountStatus?'已停投':'投放中')+')';
-                          this.treeData[index].children[i].value=ele.accountId;
-                          this.treeData[index].children[i].key=ele.accountId;
-                          // this.treeData[index].children[i].accountStatus=ele.accountStatus;
-                      })
+              res.result.forEach((element,index) => {
+                if(element){
+                    if(key==1){
+                        this.TTaccountList.push({});
+                        this.TTaccountList[index].title=element.project.projectName +'_('+ element.project.advertiserName +')';
+                        this.TTaccountList[index].value='project'+element.project.projectId;
+                        this.TTaccountList[index].key=element.project.projectId;
+                        this.TTaccountList[index].mediaId=element.project.mediaId;
+                        this.TTaccountList[index].children=[];
+
+                        if(element.account.length){
+                            element.account.forEach((ele,i)=>{
+                                this.TTaccountList[index].children.push({});
+                                this.TTaccountList[index].children[i].title=ele.userName+'_'+ele.authName+'_'+element.project.projectName;
+                                this.TTaccountList[index].children[i].value=ele.accountId;
+                                this.TTaccountList[index].children[i].key=ele.accountId;
+                            })
+
+                        }
                         
-                    }                           
-                  }      
-                });
-                // console.log(this.treeData)
-                
-            }
+                    }else if(key==2){
+                        this.KSaccountList.push({});
+                        this.KSaccountList[index].title=element.project.projectName +'_('+ element.project.advertiserName +')';
+                        this.KSaccountList[index].value='project'+element.project.projectId;
+                        this.KSaccountList[index].key=element.project.projectId;
+                        this.KSaccountList[index].mediaId=element.project.mediaId;
+                        this.KSaccountList[index].children=[];
+
+                        if(element.account.length){
+                            element.account.forEach((ele,i)=>{
+                                this.KSaccountList[index].children.push({});
+                                this.KSaccountList[index].children[i].title=ele.userName+'_'+ele.authName+'_'+element.project.projectName;
+                                this.KSaccountList[index].children[i].value=ele.accountId;
+                                this.KSaccountList[index].children[i].key=ele.accountId;
+                            })
+
+                        }
+                        
+                    }
+                    
+
+                    if(this.tabKey==1){
+                      this.treeData=this.TTaccountList
+                    }else{
+                      this.treeData=this.KSaccountList
+                    }
+                }
+              });
+                        // console.log(this.treeData)
+
+                    }
        }
      })
     },
@@ -835,8 +999,115 @@ export default {
       })
     },
 
+    // 获取所有运营
+    getAllOperator(key){
+      let url=''
+      this.operateList=[]
+      if(key==1){
+        // 头条
+        url='/ctop/bytedance/newPlan/report/AllOperator'
+      }else{
+        // 快手
+        url='/ctop/kuaishou/newGroup/report/AllOperator'
+      }
+      postAction(url,{}).then(res=>{
+        console.log(res);
+        if(res.success){
+          if(key==1){
+            this.TToperateList=res.result;
+          }else{
+            this.KSoperateList=res.result;
+          }
+
+          if(this.tabKey==1){
+            this.operateList=this.TToperateList
+          }else{
+            this.operateList=this.KSoperateList
+          }
+          
+        }
+      })
+    },
+
+
+    // 获取展示数据
+    getNewPlan(){
+      let url=''
+      if(this.tabKey==1){
+        // 头条
+        url='/ctop/bytedance/newPlan/report/data'
+      }else{
+        // 快手
+        url='/ctop/kuaishou/newGroup/report/data'
+      }
+      // if(this.accountId){
+      //   this.operate='';
+      // }else if(this.operate){
+      //   this.accountId=''
+      // }
+      this.loading=true;
+      
+      this.sectionOption=JSON.parse(JSON.stringify(sectionOption));
+      if(this.tabKey==1){
+        this.sectionOption.legend.data=['新上计划数','有效计划数']
+        this.sectionOption.series[0].name='新上计划数'
+        this.sectionOption.series[1].name='有效计划数'
+      }else{
+        this.sectionOption.legend.data=['新上推广组','有效推广组']
+        this.sectionOption.series[0].name='新上推广组'
+        this.sectionOption.series[1].name='有效推广组'
+      }
+      
+      postAction(url,{
+        accountIds:this.accountId,
+        userId:this.operate || '',
+        startDate:this.dateValue[0].format('YYYY-MM-DD'),
+        endDate:this.dateValue[1].format('YYYY-MM-DD'),
+        target:this.tableTab=='1'?'new':'valid',
+        order:this.order
+      }).then(res=>{
+        console.log(res);
+        this.loading=false;
+        this.echartSpinning=false;
+        if(res.success){
+          this.effectPlan=res.result.sumData.valid;
+          this.newPlan=res.result.sumData.new;
+          this.dataTable=res.result.listData;
+
+          // 处理echar数据
+          res.result.chartData.map(item=>{
+            this.sectionOption.xAxis.data.push(item.statDate)
+            this.sectionOption.series[0].data.push(item.new)
+            this.sectionOption.series[1].data.push(item.valid)
+          })
+         
+
+
+          this.getEchartData('sectionChart', this.sectionOption);
+
+        }
+      })
+      this.getEchartData('sectionChart', this.sectionOption);
+    },
+
+    // 查询按钮
+    search(){
+      if(this.accountId || this.operate){
+        this.echartSpinning=true;
+        this.getNewPlan()
+      }else{
+        this.$message.error('请选择具体账户或者运营')
+      }
+      
+    },
+    
+  },
+  watch: {
+    dateValue(newName,oldName){
+      
+        this.search()
+    },
   },
-  watch: {},
   computed: {
     newDate() {
       var myDate = new Date()
@@ -848,10 +1119,27 @@ export default {
       return day
     }
   },
+  mounted() {
+    this.accountHttp(1);
+    this.accountHttp(2);
+    this.getAllOperator(1)
+    this.getAllOperator(2)
+    this.accountDisabled=true
+  },
   activated: function() {
     this.$nextTick(()=>{
       this.getEchartData('sectionChart', this.sectionOption);
-      this.accountHttp()
+
+      // this.tabChange(2)
+      let userInfo=localStorage.getItem('pro__Login_Userinfo')
+      if(userInfo){
+        this.userId=JSON.parse(userInfo).value.id;
+        this.operate=this.userId;
+        this.getNewPlan()
+      }
+      // console.log(this.userId)
+
+      
     })
      
   },

+ 3 - 1
src/views/modules/Statistics/videoStatics/TTvideoStatics.vue

@@ -68,8 +68,9 @@
       style="word-break: break-all;font-size:16px;font-weight:600"
     >
       <div slot="videoU" slot-scope="test,records">
+        <!-- records.converUrl||'@/assets/noImg.png' -->
         <img
-          :src="records.converUrl"
+          :src="records.converUrl||noImg"
           alt
           style="width:80px"
           @click="openVideo(records.url)"
@@ -358,6 +359,7 @@ const initVariableColimns=[
 export default {
   data() {
     return {
+      noImg:require('@/assets/noImg.png'),
       detailLoading:false,
       clip:undefined,
       shot:undefined,

+ 21 - 6
src/views/modules/actor/ActorList.vue

@@ -1,18 +1,20 @@
 <template>
-  <vm-image-list :data="dataImageList" :total="total" @delete-ok="deletefn" class="vm-margin" @getList="getActorList"
+  <vm-image-list :data="dataImageList" :total="total" title="演员列表" @delete-ok="deletefn" class="vm-margin" @getList="getActorList"
     @updateList="getActorList(1, '')"></vm-image-list>
 </template>
 
 <script>
   import VmImageList from '@/components/ctop/vm-image-list'
   import {
-    actorList
+    actorList,
+    actorListDelete
   } from '@/api/actor'
   export default {
     name: 'ImageList',
     components: {
       VmImageList
     },
+    // inject:[page],
     mounted() {
       this.$nextTick(() => {
         this.getActorList(1)
@@ -20,11 +22,24 @@
     },
     methods: {
       deletefn: function (data) {
-        for (let i = 0; i < this.dataImageList.length; i++) {
-          if (this.dataImageList[i].id === data.id) {
-            this.dataImageList.splice(i, 1)
+        console.log('最外层deleteFn执行',data)
+        actorListDelete({
+          id:data.id
+        }).then(res=>{
+          if(res.success){
+            this.$message.success('删除成功')
+            // for (let i = 0; i < this.dataImageList.length; i++) {
+            //   if (this.dataImageList[i].id === data.id) {
+            //     this.dataImageList.splice(i, 1)
+            //   }
+            // }
+            this.getActorList(data.page)
+          }else{
+            this.$message.error('删除失败,稍后再试')
           }
-        }
+          
+        })
+        
       },
       getActorList(page, name) {
         this.dataImageList = []

+ 3 - 3
src/views/modules/actor/modules/ActorModal.vue

@@ -23,7 +23,7 @@
           :wrapperCol="wrapperCol"
         >
 
-        <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" />
+        <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false"  :sizeCheck="false"/>
           <!-- <upload-to-ali
             v-model="imageUrl"
             :customDomain="customDomain"
@@ -43,7 +43,7 @@
           :labelCol="labelCol"
           :wrapperCol="wrapperCol"
         >
-        <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false" />
+        <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false"  :sizeCheck="false"/>
           <!-- <upload-to-ali
             v-model="videoUrl"
             :customDomain="customDomain"
@@ -53,7 +53,7 @@
             :bucket="bucket"
             :accept="acceptVideo"
             :max="10"
-            :size="1024000"
+            :size="1024000" 
             :accessKeyId="accessKeyId"
             :accessKeySecret="accessKeySecret"
           ></upload-to-ali> -->

+ 88 - 14
src/views/modules/advertiser/ProjectList.vue

@@ -22,9 +22,7 @@
                 placeholder="请选择广告主名称"
               >
                 <a-select-option :value="item.id" v-for="(item, index) of list" :key="index">
-                  {{
-                  item.name
-                  }}
+                  {{ item.name }}
                 </a-select-option>
               </a-select>
             </a-form-item>
@@ -47,7 +45,8 @@
                     v-for="appModel in options"
                     :key="appModel.userId + new Date().getTime()"
                     :value="appModel.userId"
-                  >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option>
+                    >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option
+                  >
                 </a-select>
               </a-form-item>
             </a-col>
@@ -70,7 +69,8 @@
                     v-for="appModel in options"
                     :key="appModel.userId + new Date().getTime()"
                     :value="appModel.userId"
-                  >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option>
+                    >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option
+                  >
                 </a-select>
               </a-form-item>
             </a-col>
@@ -88,14 +88,9 @@
             </a-col>
           </template>
           <a-col :md="6" :sm="8">
-            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
               <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
-              <a-button
-                type="primary"
-                @click="searchReset"
-                icon="reload"
-                style="margin-left: 8px"
-              >重置</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
               <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
                 {{ toggleSearchStatus ? '收起' : '展开' }}
                 <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
@@ -127,6 +122,27 @@
       >
         <span slot="maxBid" slot-scope="text">{{ text / 1000 }}</span>
         <span slot="maxDeepCpaBid" slot-scope="text">{{ text / 1000 }}</span>
+        <span slot="ocpxActionType" slot-scope="text">
+          <div v-if="text">
+            <span v-for="(item, index) of JSON.parse(text)" :key="index"
+              >{{ item | ocpxActionType }}{{ index == JSON.parse(text).length - 1 ? '' : ',' }}</span
+            >
+          </div>
+          <div v-else>-</div>
+
+          <!-- {{ text | ocpxActionType }} -->
+        </span>
+        <span slot="bidType" slot-scope="text">
+          <div v-if="text">
+            <span v-for="(item, index) of JSON.parse(text)" :key="index"
+              >{{ item | bidType }}{{ index == JSON.parse(text).length - 1 ? '' : ',' }}</span
+            >
+          </div>
+          <div v-else>-</div>
+        </span>
+        <span slot="mediaId" slot-scope="text">
+          {{ text == '1' || text == '3' ? '头条' : '快手' }}
+        </span>
 
         <span slot="action" slot-scope="text, record">
           <a @click="handleEdit(record)">编辑</a>
@@ -191,6 +207,27 @@ export default {
           },
         },
         {
+          title: '优化目标',
+          align: 'center',
+          dataIndex: 'bidType',
+          scopedSlots: {
+            customRender: 'bidType',
+          },
+        },
+        {
+          title: '转化目标',
+          align: 'center',
+          dataIndex: 'ocpxActionType',
+          scopedSlots: {
+            customRender: 'ocpxActionType',
+          },
+        },
+        {
+          title: '供应商',
+          align: 'center',
+          dataIndex: 'supplierCode_dictText',
+        },
+        {
           title: '销售',
           align: 'center',
           dataIndex: 'saleId_dictText',
@@ -206,6 +243,14 @@ export default {
           dataIndex: 'designResponsibleId_dictText',
         },
         {
+          title: '媒体',
+          align: 'center',
+          dataIndex: 'mediaId',
+          scopedSlots: {
+            customRender: 'mediaId',
+          },
+        },
+        {
           title: '操作',
           dataIndex: 'action',
           align: 'center',
@@ -225,6 +270,37 @@ export default {
       options: [],
     }
   },
+  filters: {
+    bidType(sta) {
+      var data = {
+        null: '-',
+        1: 'CPM',
+        2: 'CPC',
+        6: 'OCPC',
+        10: 'OCPM',
+      }
+      return data[sta]
+    },
+    ocpxActionType(sta) {
+      var data = {
+        null: '-',
+        0: '封面点击',
+        2: '行为数',
+        10: '曝光',
+        11: '点击',
+        31: '下载完成',
+        53: '提交线索',
+        180: '激活',
+        190: '付费',
+        191: '首日ROI',
+        348: '有效线索',
+        383: '授信',
+        384: '完件',
+        394: '订单提交',
+      }
+      return data[sta]
+    },
+  },
   computed: {
     importExcelUrl: function () {
       return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
@@ -236,11 +312,9 @@ export default {
       // params.userId = this.userInfo().id
       params.pageSize = 1000
       params.pageNo = 1
-      console.log(params)
       getAction('/ctop/advertiser/list', params)
         .then((res) => {
           if (res.success) {
-            console.log(res)
             this.list = res.result.records
           } else {
             this.$message.warning(res.message)

+ 113 - 58
src/views/modules/advertiser/modules/projectListModal.vue

@@ -18,19 +18,16 @@
             <a-radio-button value="4">快手内广</a-radio-button>
           </a-radio-group>
         </a-form-item> -->
-        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="项目名称" >
-          <a-input placeholder="请输入项目名称" v-decorator="['projectName', validatorRules.projectName]" disabled/>
+
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="项目名称">
+          <a-input placeholder="请输入项目名称" v-decorator="['projectName', validatorRules.projectName]" disabled />
         </a-form-item>
-        <!-- <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="行业">
-          <j-tree-select ref="treeSelect" placeholder="请选择行业" v-decorator="['industryId']"
-            dict="sys_category,name,id" pidField="pid" pidValue="f5cb2d2d28417b3b65a6dd744bcb9a76">
-          </j-tree-select>
-        </a-form-item>-->
+
         <a-form-item
           :labelCol="labelCol"
           :wrapperCol="wrapperCol"
           label="供应商"
-          v-if="model.mediaId=='2'||model.mediaId=='4'"
+          v-if="model.mediaId == '2' || model.mediaId == '4'"
         >
           <a-select
             optionFilterProp="children"
@@ -38,14 +35,8 @@
             :filterOption="filterOption"
             v-decorator="['supplierCode', validatorRules.supplierCode]"
           >
-            <a-select-option
-              :value="item.supplierCode"
-              v-for="(item, index) of supplierList"
-              :key="index"
-            >
-              {{
-              item.supplierName
-              }}
+            <a-select-option :value="item.supplierCode" v-for="(item, index) of supplierList" :key="index">
+              {{ item.supplierName }}
             </a-select-option>
           </a-select>
         </a-form-item>
@@ -61,9 +52,7 @@
             disabled
           >
             <a-select-option :value="item.id" v-for="(item, index) of list" :key="index">
-              {{
-              item.name
-              }}
+              {{ item.name }}
             </a-select-option>
           </a-select>
         </a-form-item>
@@ -77,36 +66,94 @@
             disabled
           >
             <a-select-option :value="item.id" v-for="(item, index) of listProduct" :key="index">
-              {{
-              item.productName
-              }}
+              {{ item.productName }}
             </a-select-option>
           </a-select>
         </a-form-item>
         <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="最高出价">
-          <a-input
-            placeholder="请输入最高出价"
-            v-decorator="['maxBid', validatorRules.maxBid]"
-            addonAfter="元"
-          />
+          <a-input placeholder="请输入最高出价" v-decorator="['maxBid', validatorRules.maxBid]" addonAfter="元" />
         </a-form-item>
         <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="最高转化出价">
           <a-input placeholder="最高转化出价" v-decorator="['maxDeepCpaBid']" addonAfter="元" />
         </a-form-item>
+        <div v-if="showDian">
+          <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优化目标">
+            <a-select v-decorator="['bidType', { initialValue: 2 }]" mode="multiple">
+              <a-select-option :value="2">点击数</a-select-option>
+              <a-select-option :value="10">OCPM</a-select-option>
+              <a-select-option :value="6">OCPC</a-select-option>
+            </a-select>
+          </a-form-item>
+          <div v-if="Array.isArray(getFormFieldValue('bidType'))">
+            <a-form-item
+              label="转化目标"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              v-show="
+                getFormFieldValue('bidType').findIndex((item) => item == 10) > -1 ||
+                getFormFieldValue('bidType').findIndex((item) => item == 6) > -1
+              "
+            >
+              <a-select v-model="model.ocpxActionType" mode="multiple">
+                <a-select-option :value="2">行为数</a-select-option>
+                <a-select-option :value="180">激活</a-select-option>
+                <a-select-option :value="53">表单提交</a-select-option>
+
+                <a-select-option :value="394">订单提交</a-select-option>
+                <a-select-option :value="348">使用有效线索</a-select-option>
+                <a-select-option :value="383">授信出价</a-select-option>
+                <a-select-option :value="384">完件出价</a-select-option>
+                <a-select-option :value="190">付费出价</a-select-option>
+                <a-select-option :value="191">首日ROI</a-select-option>
+                <a-select-option :value="396">注册优化目标</a-select-option>
+                <a-select-option :value="717">广告观看事件</a-select-option>
+              </a-select>
+            </a-form-item>
+          </div>
+        </div>
+        <!-- <div v-else>
+          <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="优化目标">
+            <a-select v-decorator="['bidType', { initialValue: 2 }]" mode="multiple">
+              <a-select-option :value="2">点击数</a-select-option>
+              <a-select-option :value="10">OCPM</a-select-option>
+              <a-select-option :value="6">OCPC</a-select-option>
+            </a-select>
+          </a-form-item>
+          <div v-if="Array.isArray(getFormFieldValue('bidType'))">
+            <a-form-item
+              label="转化目标"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              v-show="
+                getFormFieldValue('bidType').findIndex((item) => item == 10) > -1 ||
+                getFormFieldValue('bidType').findIndex((item) => item == 6) > -1
+              "
+            >
+              <a-select v-model="model.ocpxActionType" mode="multiple">
+                <a-select-option value="AD_CONVERT_TYPE_ACTIVE_REGISTER">注册</a-select-option>
+                <a-select-option value="AD_CONVERT_TYPE_NEXT_DAY_OPEN">次留</a-select-option>
+                <a-select-option value="AD_CONVERT_TYPE_LT_ROI">广告变现ROI</a-select-option>
+                <a-select-option value="AD_CONVERT_TYPE_PURCHASE_ROI">付费ROI</a-select-option>
+                <a-select-option value="AD_CONVERT_TYPE_GAME_ADDICTION">关键行为</a-select-option>
+              </a-select>
+            </a-form-item>
+          </div>
+        </div> -->
         <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="销售">
           <a-select
             showSearch
             optionFilterProp="children"
             style="width: 100%"
             :filterOption="filterOption"
-            v-decorator="['saleId',{ rules: [{  required: true,message: '请选择销售' }] } ]"
+            v-decorator="['saleId', { rules: [{ required: true, message: '请选择销售' }] }]"
           >
           <!--  -->
             <a-select-option
               v-for="appModel in optionsElse"
               :key="appModel.userId + new Date().getTime()"
               :value="appModel.userId"
-            >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option>
+              >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option
+            >
           </a-select>
         </a-form-item>
         <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="运营负责人">
@@ -123,7 +170,8 @@
               v-for="appModel in options"
               :key="appModel.userId + new Date().getTime()"
               :value="appModel.userId"
-            >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option>
+              >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option
+            >
           </a-select>
         </a-form-item>
         <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="设计负责人">
@@ -140,7 +188,8 @@
               v-for="appModel in options"
               :key="appModel.userId + new Date().getTime()"
               :value="appModel.userId"
-            >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option>
+              >{{ appModel.realName }}&#12288;&#12288;{{ appModel.roleName }}</a-select-option
+            >
           </a-select>
         </a-form-item>
       </a-form>
@@ -201,6 +250,7 @@ export default {
       optionsElse: [],
       supplierList: [],
       editAll: false,
+      showDian: false,
     }
   },
   created() {
@@ -219,19 +269,14 @@ export default {
       console.log(`checked = ${e.target.value}`)
     },
     handleChange(value) {
-      console.log(value)
       getAction('/ctop/product/list', { advertiserId: value, pageSize: 1000 }).then((res) => {
         if (res.success) {
           this.listProduct = res.result.records
         }
       })
     },
-    handleBlur() {
-      console.log('blur')
-    },
-    handleFocus() {
-      console.log('focus')
-    },
+    handleBlur() {},
+    handleFocus() {},
     filterOption(input, option) {
       return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
     },
@@ -240,11 +285,9 @@ export default {
       // params.userId = this.userInfo().id
       params.pageSize = 1000
       params.pageNo = 1
-      console.log(params)
-      getAction(this.url.getList,params)
+      getAction(this.url.getList, params)
         .then((res) => {
           if (res.success) {
-            console.log(res)
             this.list = res.result.records
           } else {
             this.$message.warning(res.message)
@@ -281,34 +324,45 @@ export default {
           }
         })
       }
-      var params = { ...record }
-
-      console.log(record)
+      // else if (this.request == '2,4') {
+      //         params.type = 'kuaishou'
+      //       }
+      if (record.mediaId == '2' || record.mediaId == '4') {
+        var params = { ...record }
+        params.bidType = (record.bidType == null||record.bidType == '') ? [2] : JSON.parse(record.bidType)
+        params.ocpxActionType = (record.ocpxActionType == null||record.ocpxActionType == '') ? [2] : JSON.parse(record.ocpxActionType)
+        this.showDian = true
+      } else {
+        var { ocpxActionType, bidType, ...params } = record
+        this.showDian = false
+      }
       this.form.resetFields()
       this.model = Object.assign({}, params)
       this.model.maxBid = this.model.maxBid ? this.model.maxBid / 1000 : 0
       this.model.maxDeepCpaBid = this.model.maxDeepCpaBid ? this.model.maxDeepCpaBid / 1000 : 0
+      // if (record.mediaId == '2' || record.mediaId == '4') {
+      //   this.model.bidType = this.model.bidType == null ? [2] : JSON.parse(this.model.bidType)
+      //   this.model.ocpxActionType = this.model.ocpxActionType == null ? [2] : JSON.parse(this.model.ocpxActionType)
+      // }
       this.visible = true
+      console.log(this.model)
       this.$nextTick(() => {
-        console.log(this.model)
         if (record.advertiserId) {
           this.form.setFieldsValue(
             pick(
               this.model,
               'projectName',
-              'industryId',
               'advertiserId',
               'productId',
-              'responsibleName',
               'maxBid',
               'maxDeepCpaBid',
-              'userId',
               'designResponsibleId',
               'responsibleId',
-              'industryCode',
+
               'supplierCode',
               // 'advertiserType',
-              'saleId'
+              'saleId',
+              'bidType'
             )
           )
         } else {
@@ -316,18 +370,16 @@ export default {
             pick(
               this.model,
               'projectName',
-              'industryId',
               'advertiserId',
-              'responsibleName',
               'maxBid',
               'maxDeepCpaBid',
-              'userId',
               'designResponsibleId',
               'responsibleId',
-              'industryCode',
               'supplierCode',
               // 'advertiserType',
-              'saleId'
+              'saleId',
+              'bidType',
+              'ocpxActionType'
             )
           )
         }
@@ -335,13 +387,11 @@ export default {
         // this.resId = record.responsibleId
         // this.shejiId = record.designResponsibleId
         getAction('/sys/user/getAllUserListV1', '').then((res) => {
-          console.log(res)
           if (res.success) {
             this.options = res.result
           }
         })
         getAction('/sys/user/getAllSaleList', '').then((res) => {
-          console.log(res)
           if (res.success) {
             this.optionsElse = res.result
           }
@@ -379,11 +429,17 @@ export default {
           formData.responsibleId = values.responsibleId
           formData.designResponsibleId = values.designResponsibleId
           formData.userId = formData.userId ? formData.userId : that.userInfo().id
+          if (this.showDian) {
+            formData.ocpxActionType =
+              formData.bidType == 2 ? JSON.stringify([0]) : JSON.stringify(formData.ocpxActionType)
+            formData.bidType = JSON.stringify(formData.bidType)
+          }
           httpAction(httpurl, formData, method)
             .then((res) => {
               if (res.success) {
                 that.$message.success(res.message)
                 that.$emit('ok')
+                that.confirmLoading = false
               } else {
                 that.$message.warning(res.message)
               }
@@ -402,7 +458,6 @@ export default {
       return this.form.getFieldValue(field)
     },
     get(valueName, key) {
-      console.log(valueName, key)
       this.resId = key
     },
   },

+ 1 - 0
src/views/modules/attendanceRecords/attendanceRecordsList.vue

@@ -337,6 +337,7 @@ export default {
             this.btnLoading=false;
             this.loading=false;
             this.data=[];
+            this.ipagination.current=1
             switch (this.tabKey){
                 case 1:
                     this.columns=[...allDataColumns]

+ 120 - 43
src/views/modules/autoRules/autoRulesList.vue

@@ -35,11 +35,12 @@
                         </a-spin>
                         <!-- <a-switch size="default" :checked=text  @change="switchChange(text,record)"/> -->
                     </span>
+                    <span slot="processMethod" slot-scope="text">
+                        {{text=='SEND'?'仅发送通知':'发送并关停组'}}
+                    </span>
                     <span slot="options" slot-scope="text,record">
                         <a href="javascript:;" @click="editRule(record)">编辑</a>
                         <a-divider type="vertical" />
-                        <a href="javascript:;" @click="recordsRule(record)">计划分析</a>
-                        <a-divider type="vertical" />
                         <a-popconfirm
                             title="确定删除该规则吗?"
                             @confirm="deleteRule(record)"                            
@@ -69,33 +70,32 @@ let existColumns=[
     },
     {
         title: '规则名称',
-        dataIndex: 'name',
+        dataIndex: 'eventRuleName',
         align: 'center',
         
-        key: 'name',
-        scopedSlots: { customRender: 'name' }
+        key: 'eventRuleName',
+        scopedSlots: { customRender: 'eventRuleName' }
     },
     {
-        title: '规则ID',
-        dataIndex: 'id',
+        title: '应用对象',
+        dataIndex: 'accountName',
         align: 'center',
-        key: 'id',
-        scopedSlots: { customRender: 'id' }
+        key: 'accountName',
+        scopedSlots: { customRender: 'accountName' }
     },
     {
-        title: '应用对象',
-        dataIndex: 'applyObject',
+        title: '结果操作',
+        dataIndex: 'processMethod',
         align: 'center',
-        key: 'applyObject',
-        scopedSlots: { customRender: 'applyObject' }
+        key: 'processMethod',
+        scopedSlots: { customRender: 'processMethod' }
     },
     {
         title: '创建者',
-        dataIndex: 'creator',
-        align: 'center',
-        
-        key: 'creator',
-        scopedSlots: { customRender: 'creator' }
+        dataIndex: 'createrName',
+        align: 'center',      
+        key: 'createrName',
+        scopedSlots: { customRender: 'createrName' }
     },
     {
         title: '操作',
@@ -112,39 +112,39 @@ let recordsColumns=[
    
     {
         title: '规则名称',
-        dataIndex: 'name',
+        dataIndex: 'eventRuleName',
         align: 'center',
         
-        key: 'name',
-        scopedSlots: { customRender: 'name' }
+        key: 'eventRuleName',
+        scopedSlots: { customRender: 'eventRuleName' }
     },
     {
         title: '运行时间',
-        dataIndex: 'time',
+        dataIndex: 'runningTime',
         align: 'center',
-        key: 'time',
-        scopedSlots: { customRender: 'time' }
+        key: 'runningTime',
+        scopedSlots: { customRender: 'runningTime' }
     },
     {
         title: '运行对象',
-        dataIndex: 'runObject',
+        dataIndex: 'accountName',
         align: 'center',
-        key: 'runObject',
-        scopedSlots: { customRender: 'runObject' }
+        key: 'accountName',
+        scopedSlots: { customRender: 'accountName' }
     },
     {
         title: '满足条件',
-        dataIndex: 'meetCondition',
+        dataIndex: 'alarmCondition',
         align: 'center',      
-        key: 'meetCondition',
-        scopedSlots: { customRender: 'meetCondition' }
+        key: 'alarmCondition',
+        scopedSlots: { customRender: 'alarmCondition' }
     },
     {
         title: '运行结果',
-        dataIndex: 'result',
+        dataIndex: 'processMethod',
         align: 'center',       
-        key: 'result',
-        scopedSlots: { customRender: 'result' }
+        key: 'processMethod',
+        scopedSlots: { customRender: 'processMethod' }
     },
 ]
 
@@ -178,9 +178,9 @@ export default {
                 }
             },
             url:{
-                OverTime:'/oa/wechatNoList/selectOverTimePage',
-                abnormal:'/oa/wechatNoList/selectNoListPage',
-                allData:'/oa/wechatCheckinData/queryPageList'
+                
+                existUrl:'/alarm/alarmEventRule/list',
+                resultRecordUrl:'/alarm/alarmEventRule/getRunningRecords'
             },
         }
     },
@@ -191,11 +191,15 @@ export default {
         },
         tabChange(key){
             console.log(key);
+            let url=''
             if(key=='1'){
                 this.columns=[...existColumns]
+                url=this.url.existUrl
             }else{
                  this.columns=[...recordsColumns]
+                 url=this.url.resultRecordUrl
             }
+            this.getTableListHttp(url)
         },
         createNewRule(){
             this.$router.push('/newBlankRule')
@@ -205,21 +209,94 @@ export default {
             this.ipagination.current=pagination.current;
 
             this.ipagination.pageSize=pagination.pageSize;
-            this.search()
+            let url=this.tabKey=='1'?this.url.existUrl:this.url.resultRecordUrl
+            
+            this.getTableListHttp(url)
         },
         editRule(record){
-            console.log(record)
-        },
-        recordsRule(record){
-            console.log(record)
+            console.log(record);
+            this.$router.push(`/newBlankRule?id=${record.eventRuleId}`)
         },
+        // recordsRule(record){
+        //     console.log(record);
+            
+        // },
         deleteRule(record){
-            console.log(record)
+            console.log(record);
+            getAction('/alarm/alarmEventRule/delete',{
+                id:record.eventRuleId
+            }).then(res=>{
+                console.log(res);
+                if(res.success){
+                    this.getTableListHttp(this.url.existUrl)
+                }else{
+                    this.$message.error('删除失败')
+                }
+            })
         },
         switchChange(text,record){
-            console.log(text,record)
+            console.log(text,record);
+            record.spin=true;
+            let eventRuleStatus='1'
+            if(text){
+                eventRuleStatus='0'
+                
+            }else{
+                eventRuleStatus='1';
+            }
+           
+            postAction('/alarm/alarmEventRule/edit',{
+                eventRuleId:record.eventRuleId,
+                eventRuleStatus,
+            }).then(res=>{
+                console.log(res);
+                record.spin=false;
+                if(res.success){
+                    // this.getTableListHttp()                    
+                    if(text){
+                        record.status=false
+                        eventRuleStatus='0'                       
+                    }else{
+                        record.status=true
+                        eventRuleStatus='1';
+                    }
+                }else{
+                    this.$message.error('修改失败')
+                    // this.getTableListHttp()
+                }
+            })
         },
+
+        getTableListHttp(url){
+            this.data=[];
+            this.loading=true;
+            // let url='/alarm/alarmEventRule/list'
+            getAction(url,{
+                pageNo:this.ipagination.current,
+                pageSize:this.ipagination.pageSize
+            }).then(res=>{
+                console.log(res);
+                this.loading=false;
+                if(res.success){
+                    this.data=res.result.list.map(item=>{
+                        return {
+                            ...item,
+                            status:item.eventRuleStatus=='1'?true:false,
+                            spin:false,
+                        }
+                    })
+                    this.ipagination.total=res.result.total
+                }
+            })
+        }
+    },
+
+    mounted(){
+        this.getTableListHttp(this.url.existUrl)
     },
+    activated(){
+        this.getTableListHttp(this.url.existUrl)
+    }
 }
 
 

File diff suppressed because it is too large
+ 612 - 153
src/views/modules/autoRules/newBlankRule.vue


File diff suppressed because it is too large
+ 1180 - 0
src/views/modules/earlyWarningRules/configRules.vue


+ 394 - 0
src/views/modules/earlyWarningRules/index.vue

@@ -0,0 +1,394 @@
+<template>
+    <div class="ruleSetList">
+        <div class="toolbox-automate-rules-create-content_title"><h3> 新建空白模板</h3></div>
+        <div class="tabBody">
+            
+            
+            <div>
+                <span>模板名称:</span>
+                <a-input v-model="templateName" placeholder="模板名字" style="width:250px;margin-right:40px"/>
+            </div>
+            <div>
+                <span>模板id:</span>
+                <a-input v-model="templateId" placeholder="模板id" style="width:250px"/>
+            </div>
+            
+
+            <div class="opt">
+                <a-button type='primary' @click="search">查询</a-button>
+            </div>
+        </div>
+        <div class="tableBody">
+            <div class="opt" >
+                <a-button type='primary' @click='createNewRule'>新建模板</a-button>
+               
+            </div>
+            
+            <div class="table">
+                <a-table
+                    size="middle"
+                    :columns="columns"
+                    :dataSource="data"
+                    bordered
+                    id="outTable"
+                    :pagination="ipagination"
+                    :scroll="{ x: scrollX }"
+                    :loading="loading"
+                    @change="sort"
+                    style="word-break: break-all;"
+                    >
+                    <span slot="status" slot-scope="text,record">
+                        <a-spin :spinning="record.spin" size="small" >
+                            <div class="spin-content">
+                                <a-switch size="default" :checked=text  @change="switchChange(text,record)"/>
+                            </div>
+                        </a-spin>
+                        <!-- <a-switch size="default" :checked=text  @change="switchChange(text,record)"/> -->
+                    </span>
+                    <span slot="mediaType" slot-scope="text">
+                        {{text|handleMediaType}}
+                    </span>
+                    <span slot="processMethod" slot-scope="text">
+                        {{text=='SEND'?'仅发送通知':'发送并关停组'}}
+                    </span>
+                    <span slot="options" slot-scope="text,record">
+                        <a href="javascript:;" @click="editRule(record)">编辑</a>
+                        <a-divider type="vertical" />
+                        <a-popconfirm
+                            :title="`当前模板关联账户个数为${relationCount},确定删除吗?`"
+                            @confirm="deleteRule(record)"                            
+                        >
+                            <a href="javascript:;" @click.stop="showRelativeCount(record)">删除</a>
+                        </a-popconfirm>
+                        
+                    </span>
+
+                </a-table>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost ,deleteAction} from '@/api/manage';
+let existColumns=[
+    // {
+    //     title: '运行/暂停',
+    //     dataIndex: 'status',
+    //     align: 'center',
+    //     width:100,
+    //     key: 'status',
+    //     scopedSlots: { customRender: 'status' }
+    // },
+   {
+        title: '模板名称',
+        dataIndex: 'templateName',
+        align: 'center',
+        
+        key: 'templateName',
+        scopedSlots: { customRender: 'templateName' }
+    },
+    {
+        title: '模板ID',
+        dataIndex: 'id',
+        align: 'center',
+        key: 'id',
+        scopedSlots: { customRender: 'id' }
+    },
+    {
+        title: '应用媒体',
+        dataIndex: 'mediaType',
+        align: 'center',
+        key: 'mediaType',
+        scopedSlots: { customRender: 'mediaType' }
+    },
+    // {
+    //     title: '结果操作',
+    //     dataIndex: 'processMethod',
+    //     align: 'center',
+    //     key: 'processMethod',
+    //     scopedSlots: { customRender: 'processMethod' }
+    // },
+    // {
+    //     title: '创建者',
+    //     dataIndex: 'createrName',
+    //     align: 'center',      
+    //     key: 'createrName',
+    //     scopedSlots: { customRender: 'createrName' }
+    // },
+    {
+        title: '操作',
+        dataIndex: 'options',
+        align: 'center',
+       
+        key: 'options',
+        scopedSlots: { customRender: 'options' }
+    },
+]
+
+
+let recordsColumns=[
+   
+    {
+        title: '模板名称',
+        dataIndex: 'templateName',
+        align: 'center',
+        
+        key: 'templateName',
+        scopedSlots: { customRender: 'templateName' }
+    },
+    {
+        title: '应用媒体',
+        dataIndex: 'mediaType',
+        align: 'center',
+        key: 'mediaType',
+        scopedSlots: { customRender: 'mediaType' }
+    },
+    {
+        title: '运行对象',
+        dataIndex: 'accountName',
+        align: 'center',
+        key: 'accountName',
+        scopedSlots: { customRender: 'accountName' }
+    },
+    {
+        title: '满足条件',
+        dataIndex: 'alarmCondition',
+        align: 'center',      
+        key: 'alarmCondition',
+        scopedSlots: { customRender: 'alarmCondition' }
+    },
+    {
+        title: '运行结果',
+        dataIndex: 'processMethod',
+        align: 'center',       
+        key: 'processMethod',
+        scopedSlots: { customRender: 'processMethod' }
+    },
+]
+
+
+
+export default {
+    data() {
+        return {
+            templateId:'',
+            templateName:"",
+            relationCount:2,
+
+            tabKey:"1",
+            rulesId:undefined,
+            data:[],
+            columns:[...existColumns],
+            scrollX:0,
+            loading:false,
+            ipagination: {
+            current: 1,
+            pageSize: 10,
+                //   pageSizeOptions: ['10', '20', '30'],
+                showTotal: (total, range) => {
+                    return range[0] + "-" + range[1] + " 共" + total + "条"
+                },
+                showQuickJumper: true,
+                showSizeChanger:true,
+                pageSizeOptions: ['10', '30', '50'],
+                total: 0,
+                onChange: (current, pageSize) => {
+                    // 切换分页时的回调,
+                    // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+                    this.ipagination.current = current;
+                    this.ipagination.pageSize= pageSize;
+                }
+            },
+            url:{
+                
+                list:'/ruleTemplate/list',
+                delete:'/ruleTemplate/delete',
+                getRelationAccountById:'/ruleAccountTemplate/getRelationAccountById',
+                
+            },
+        }
+    },
+    methods: {
+        moment,
+        onSearch(value) {
+            console.log(value);
+        },
+        tabChange(key){
+            console.log(key);
+            let url=''
+            if(key=='1'){
+                this.columns=[...existColumns]
+                url=this.url.existUrl
+            }else{
+                 this.columns=[...recordsColumns]
+                 url=this.url.resultRecordUrl
+            }
+            this.getTableListHttp(url)
+        },
+        createNewRule(){
+            this.$router.push('/earlyWarningRules/configRules')
+        },
+        sort(pagination, filters, sorter, { currentDataSource }){
+        
+            this.ipagination.current=pagination.current;
+
+            this.ipagination.pageSize=pagination.pageSize;
+                      
+            this.getTableListHttp(this.url.list)
+        },
+        editRule(record){
+            console.log(record);
+            this.$router.push(`/earlyWarningRules/configRules?id=${record.id}`)
+        },
+        // recordsRule(record){
+        //     console.log(record);
+            
+        // },
+        showRelativeCount(record){
+             getAction(this.url.getRelationAccountById,{
+                id:record.id
+            }).then(res=>{
+                console.log(res)
+                if(res.success){
+                    this.relationCount=res.result.relationCount
+                }
+            })
+        },
+        deleteRule(record){
+            console.log(record);
+           
+            deleteAction(this.url.delete,{
+                id:record.id
+            }).then(res=>{
+                console.log(res);
+                if(res.success){
+                    this.getTableListHttp(this.url.list)
+                }else{
+                    this.$message.error('删除失败')
+                }
+            })
+                
+            
+            
+        },
+        
+        search(){
+            this.getTableListHttp(this.url.list)
+            this.ipagination.current=1;
+        },
+        getTableListHttp(url){
+            this.data=[];
+            this.loading=true;
+            getAction(url,{
+                id:this.templateId,
+                templateName:this.templateName,
+                pageNo:this.ipagination.current,
+                pageSize:this.ipagination.pageSize
+            }).then(res=>{
+                console.log(res);
+                this.loading=false;
+                if(res.success){
+                    this.data=res.result.records.map(item=>{
+                        return {
+                            ...item,
+                            status:item.eventRuleStatus=='1'?true:false,
+                            spin:false,
+                        }
+                    })
+                    this.ipagination.total=res.result.total
+                }
+            })
+        }
+    },
+
+    mounted(){
+        this.getTableListHttp(this.url.list)
+    },
+    activated(){
+        this.getTableListHttp(this.url.list)
+    },
+    filters:{
+        handleMediaType(val){
+            switch (val) {
+                case 1:
+                    return '头条'
+                    break;
+            
+                case 2:
+                    return '快手'
+                    break;
+            
+                case 3:
+                    return '头条内广'
+                    break;
+            
+                case 4:
+                    return '快手内广'
+                    break;
+            
+                default:
+                    break;
+            }
+        }
+    }
+}
+
+
+</script>
+
+<style lang="scss" scoped>
+.ruleSetList{
+    background: white;
+    padding: 20px;
+    .toolbox-automate-rules-create-content_title {
+        background-color: #fff;
+        display: flex;
+        flex-flow: row nowrap;
+        justify-content: flex-start;
+        align-items: center;
+        margin-bottom: 28px;
+        h3 {
+            font-size: 22px;
+            margin: 0;
+            font-weight: 400;
+            height: 30px;
+            line-height: 30px;
+        }
+    }
+    .tabBody{
+        margin-bottom: 28px;
+        display: flex;
+        position: relative;
+        font-size: 16px;
+        .opt{
+           position: absolute; 
+           right: 0;
+        }
+    }
+    .tableBody{
+        .opt{
+            margin-bottom: 28px;
+            .title{
+                margin: 15px 0;
+                height: 57px;
+                font-size: 16px;
+                color: #333;
+                line-height: 57px;
+                background: #ffffff;
+                padding-left: 15px;
+                border-radius: 4px 4px 0 0;
+                font-weight: 600;
+                border-bottom: 1px solid #DADFE3;
+            }
+        }
+        .opts{
+            margin-bottom: 28px;
+        }
+        .table{
+            // margin-top: 20px;
+        }
+    }
+}
+</style>

File diff suppressed because it is too large
+ 1487 - 0
src/views/modules/earlyWarningRules/ruleModule.vue


+ 594 - 0
src/views/modules/earlyWarningRules/switchConfig.vue

@@ -0,0 +1,594 @@
+<template>
+  <div class="configRules">
+    <a-spin :spinning="spinning">
+      <div class="toolbox-automate-rules-create-body">
+        <div class="toolbox-automate-rules-create-content_title"><h3>开关配置</h3></div>
+        <div class="toolbox-automate-rules-create-content">
+          <a-form-model ref="ruleForm" :model="form" :rules="rules">
+            <div class="moduler">
+              <!-- 应用对象 -->
+              <div class="row-item">
+                <div class="hint-item"></div>
+                <div class="label-item">
+                  <div class="text-item">落地页链接预警</div>
+                  <div class="required-item"></div>
+                </div>
+                <div class="input-item">
+                  <a-form-model-item ref="landingSwitch" prop="landingSwitch">
+                    <a-radio-group v-model="form.landingSwitch" @change="landingSwitchChange" :disabled='disabled'>
+                      <a-radio-button value="on">开启</a-radio-button>
+                      <a-radio-button value="off">关闭</a-radio-button>
+                    </a-radio-group>
+                  </a-form-model-item>
+                </div>
+              </div>
+              <div class="row-item">
+                <div class="hint-item"></div>
+                <div class="label-item">
+                  <div class="text-item">监测链接预警</div>
+                  <div class="required-item"></div>
+                </div>
+                <div class="input-item">
+                  <a-form-model-item ref="monitoringLinkSwitch" prop="monitoringLinkSwitch">
+                    <a-radio-group v-model="form.monitoringLinkSwitch" @change="monitoringLinkSwitchChange" :disabled='disabled'>
+                      <a-radio-button value="on">开启</a-radio-button>
+                      <a-radio-button value="off">关闭</a-radio-button>
+                    </a-radio-group>
+                  </a-form-model-item>
+                </div>
+              </div>
+            </div>
+          </a-form-model>
+        </div>
+      </div>
+    </a-spin>
+  </div>
+</template>
+
+<script>
+import moment from 'moment'
+import { getAction, postAction, downFile, downFilePost, deleteAction } from '@/api/manage'
+import { Switch } from 'ant-design-vue'
+import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
+import qs from 'qs'
+export default {
+  components: {
+    Treeselect,
+  },
+  props: {
+    disabled: {
+      type: Boolean,
+      default() {
+        return false
+      },
+    },
+  },
+  data() {
+    return {
+      ruleDetail:{},
+      url: {
+        onOrOffMonitoringLink: '/rule/switch/onOrOffMonitoringLink',
+        onOrOffLandingPage: '/rule/switch/onOrOffLandingPage',
+      },
+
+      currentRuleId: '',
+
+      spinning: false,
+
+      form: {
+        landingSwitch: 'off',
+        monitoringLinkSwitch: 'off',
+      },
+      rules: {
+        templateName: [
+          { required: true, message: '请填写规则的具体名称', trigger: 'blur' },
+          { min: 2, message: '长度不得小于2', trigger: 'blur' },
+        ],
+      },
+    }
+  },
+  watch: {},
+  methods: {
+    landingSwitchChange(e) {
+      console.log(e.target.value)
+      postAction(
+        this.url.onOrOffLandingPage,
+        qs.stringify({
+          accountId: this.ruleDetail.accountId,
+          switchType: e.target.value,
+        })
+      ).then((res) => {
+        console.log(res)
+
+        this.$message(res.message)
+      })
+    },
+    monitoringLinkSwitchChange(e) {
+      console.log(e.target.value)
+      postAction(
+        this.url.onOrOffMonitoringLink,
+        qs.stringify({
+          accountId: this.ruleDetail.accountId,
+          switchType: e.target.value,
+        })
+      ).then((res) => {
+        console.log(res)
+
+        this.$message(res.message)
+      })
+    },
+
+    // form-modal 自带方法
+    onSubmit() {
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          console.log('submit!', valid)
+        } else {
+          s
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    resetForm() {
+      this.$refs.ruleForm.resetFields()
+    },
+
+    displayRender({ labels }) {
+      return labels[labels.length - 1]
+    },
+
+    saveHandler() {
+      this.$router.replace('/earlyWarningRules/useRuleList')
+      this.$bus.$emit('remove', '/earlyWarningRules/ruleModule')
+    },
+
+    // goBack() {
+    //     this.$router.push('/earlyWarningRules/index')
+    //     this.$bus.$emit('remove', '/earlyWarningRules/configRules')
+
+    // },
+
+    // huixianzhi
+    getTempletDetail() {
+      if (this.$route.query.id) {
+        this.spinning = true
+        getAction(this.url.queryDetailById, {
+          id: this.$route.query.id,
+        }).then((res) => {
+          console.log(res)
+          if (res.success) {
+            this.spinning = false
+
+            res.result.ruleList.map((item, index) => {
+              item.ruleDetail.forEach((ele, ind) => {
+                ele.baseIndex = [ele.ruleDimension, ele.indicatorCode]
+                getAction(this.url.ruleCondition, {
+                  dataType: ele.dataType,
+                }).then((result) => {
+                  console.log(result)
+                  if (result.success) {
+                    ele.conditionList = result.result
+                    console.log(this.form)
+                    this.form = {}
+                    this.form = res.result
+                  }
+                })
+              })
+            })
+
+            this.form = res.result
+          }
+        })
+      } else {
+        this.spinning = false
+      }
+    },
+  },
+
+  filters: {},
+
+  mounted() {
+    // console.log(this.$route.query);
+     var data = JSON.parse(localStorage.getItem('getRuleDetail'))
+     this.ruleDetail=data;
+     this.spinning=true;
+     postAction('/rule/switch/echoSwitchStatus',qs.stringify({
+       accountId:this.ruleDetail.accountId
+     })).then(res=>{
+       console.log(res);
+       this.spinning=false;
+       if(res.success){
+         
+         this.form.landingSwitch=res.result.landing_page?'off':'on';
+         this.form.monitoringLinkSwitch=res.result.monitoring_link?'off':'on';
+       }
+     })
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.configRules {
+  .add-rule:hover {
+    color: #2F88FF;
+    border-color: #2F88FF;
+  }
+  .add-rule {
+    cursor: pointer;
+
+    height: 40px;
+    border-radius: 2px;
+    border: 1px dashed #dadfe3;
+    font-size: 12px;
+    display: flex;
+    flex-flow: row column;
+    justify-content: center;
+    align-items: center;
+    color: #666;
+    margin-top: 16px;
+    -moz-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    -khtml-user-select: none;
+    user-select: none;
+  }
+  .toolbox-automate-rules-create-body {
+    margin: 16px 12px 12px;
+    padding: 32px 32px 16px;
+    background-color: #fff;
+    border-radius: 4px;
+  }
+  .toolbox-automate-rules-create-content_title {
+    background-color: #fff;
+    display: flex;
+    flex-flow: row nowrap;
+    justify-content: flex-start;
+    align-items: center;
+    margin-bottom: 28px;
+    h3 {
+      font-size: 22px;
+      margin: 0;
+      font-weight: 400;
+      height: 30px;
+      line-height: 30px;
+    }
+  }
+  .toolbox-automate-rules-create-content {
+    padding-left: 28px;
+  }
+  .moduler {
+    .opt {
+      text-align: right;
+    }
+    width: 100%;
+    background: #fff;
+    margin-bottom: 16px;
+    position: relative;
+    padding: 32px 24px 48px 32px;
+    // border-radius: 4px;
+    // box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
+    .moduler-title {
+      display: flex;
+      align-items: center;
+      font-size: 22px;
+      margin-bottom: 20px;
+    }
+    .row-item {
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      margin-bottom: 32px;
+    }
+    .row-item:last-of-type {
+      margin-bottom: 0;
+    }
+    .row-item .hint-item {
+      width: 24px;
+      min-width: 24px;
+      align-self: flex-start;
+      line-height: 20px;
+      height: 20px;
+      margin-top: 9px;
+    }
+    .row-item .label-item {
+      position: relative;
+      align-items: flex-start;
+      align-self: flex-start;
+      line-height: 20px;
+      height: 20px;
+      margin-top: 10px;
+      width: 120px;
+
+      .text-item {
+        font-size: 14px;
+        width: 100px;
+      }
+    }
+    .row-item .required-item {
+      width: 4px;
+      height: 4px;
+      border-radius: 2px;
+      background: #f45858;
+      position: absolute;
+      right: 10px;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+    .row-item .input-item {
+      min-width: 480px;
+      position: relative;
+      // height: 35px;
+      .tip {
+        font-size: 12px;
+        color: tomato;
+      }
+    }
+    .adName {
+      display: flex;
+      .nameList {
+        width: 90%;
+      }
+      .item {
+        display: inline-block;
+        width: 30%;
+        margin-left: 15px;
+        margin-bottom: 10px;
+      }
+    }
+  }
+
+  .toolbox-automate-rules-create-content_rules-and-condition_rules {
+    margin-bottom: 24px;
+  }
+  .toolbox-automate-rules-create-content_rules-and-condition_rules,
+  .toolbox-automate-rules-create-content_rules-and-condition_condition {
+    width: 1138px;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #dadfe3;
+  }
+  .toolbox-automate-rules-create-content_rules-and-condition_rules,
+  .toolbox-automate-rules-create-content_rules-and-condition_condition {
+    .title {
+      font-size: 14px;
+      font-weight: 600;
+      color: #333;
+
+      border-bottom: 1px solid #E4E9ED;
+      padding-left: 24px;
+      padding: 12px;
+      // display: flex;
+      // justify-content: flex-start;
+      align-items: center;
+      .condition-title {
+        padding-right: 17px;
+      }
+    }
+    .title2 {
+      font-size: 14px;
+      font-weight: 600;
+      color: #333;
+      height: 56px;
+      border-bottom: 1px solid #E4E9ED;
+      padding-left: 24px;
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      .condition-title {
+        padding-right: 17px;
+      }
+    }
+    .content {
+      padding: 15px;
+
+      .add-rule {
+        cursor: pointer;
+
+        height: 40px;
+        border-radius: 2px;
+        border: 1px dashed #dadfe3;
+        font-size: 12px;
+        display: flex;
+        flex-flow: row column;
+        justify-content: center;
+        align-items: center;
+        color: #666;
+        margin-top: 16px;
+        -moz-user-select: none;
+        -webkit-user-select: none;
+        -ms-user-select: none;
+        -khtml-user-select: none;
+        user-select: none;
+      }
+      .add-rule:hover {
+        color: #2F88FF;
+        border-color: #2F88FF;
+      }
+      .rules-list-item {
+        box-sizing: border-box;
+        width: 100%;
+        padding: 15px;
+        background: #f8f9fa;
+        border-radius: 4px;
+        margin-bottom: 16px;
+        display: flex;
+        align-items: center;
+        position: relative;
+        .rules-list-item-delete {
+          position: absolute;
+          right: 24px;
+          height: 30px;
+          padding-left: 24px;
+          border-left: 1px solid #DADFE3;
+          cursor: pointer;
+        }
+        .rules-list-item-subject {
+          width: 120px;
+          margin-right: 16px;
+          display: flex;
+          .ruleName {
+            display: block;
+            width: 100%;
+            height: 32px;
+            line-height: 32px;
+            text-align: center;
+            background-color: #fff;
+            border: 1px solid #d9d9d9;
+            border-radius: 4px;
+          }
+        }
+      }
+      .rules—list_item:last-of-type {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  .selectedExist {
+    width: 500px;
+    padding-top: 5px;
+    .inventory-tags-lists-header {
+      background-color: #F8F9FA;
+      border: 1px solid #E4E9ED;
+      height: 36px;
+      line-height: 33px;
+      border-radius: 4px 4px 0 0;
+      font-weight: bold;
+      display: flex;
+    }
+
+    .inventory-tags-lists-container {
+      border: 1px solid #E4E9ED;
+      margin-top: -1px;
+      height: 100%;
+      padding: 4px 0px;
+      border-radius: 0 0 4px 4px;
+      height: 300px;
+      overflow: auto;
+    }
+
+    .inventory-tags-lists-item {
+      width: 100%;
+      height: 37px;
+      line-height: 37px;
+      padding-left: 12px;
+      padding-right: 12px;
+      display: flex;
+      font-size: 14px;
+      color: #333;
+    }
+
+    .input {
+      margin-bottom: 16px;
+    }
+    .campaign-have-list {
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333;
+      border: 1px solid #DADFE3;
+      border-radius: 4px;
+      margin-bottom: 16px;
+      height: 388px;
+      .campaign-have-header {
+        height: 38px;
+        width: 100%;
+        padding-left: 13px;
+        line-height: 38px;
+        background: #f8f9fa;
+        border-radius: 4px 4px 0px 0px;
+        border-bottom: 1px solid #DADFE3;
+      }
+      .campaign-have-list ul {
+        width: 100%;
+        height: 350px;
+        padding-top: 6px;
+      }
+      li {
+        padding: 6px 10px;
+        cursor: pointer;
+      }
+      li:hover {
+        background: #EDF1F5;
+      }
+      .ad-d-flex-between {
+        justify-content: space-between !important;
+      }
+
+      .ad-d-flex,
+      .ad-btn {
+        display: flex;
+        align-items: center;
+      }
+      .byted-loading-v {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 996;
+        background-color: hsla(0, 0%, 96%, 0.9);
+      }
+      .info {
+        width: 60%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .landing-type {
+        color: #999;
+        font-size: 12px;
+        white-space: nowrap;
+      }
+    }
+    .noAccountID {
+      font-size: 14px;
+      text-align: center;
+      color: #999;
+      line-height: 388px;
+    }
+    .fenye {
+      height: 60px;
+      padding-top: 12px;
+      text-align: right;
+    }
+  }
+}
+</style>
+<style lang="scss">
+.configRules {
+  .ant-collapse > .ant-collapse-item > .ant-collapse-header {
+    position: relative;
+    padding: 12px 16px;
+    padding-left: 40px;
+    color: rgba(0, 0, 0, 0.85);
+    line-height: 22px;
+    cursor: pointer;
+    -webkit-transition: all 0.3s;
+    height: 46px;
+    transition: all 0.3s;
+  }
+  .ant-form-item {
+    margin-bottom: 0;
+  }
+  .content {
+    .ant-form-item {
+      margin-bottom: 0;
+      width: 100%;
+    }
+  }
+  .ant-radio-button-wrapper {
+    min-width: 70px;
+    text-align: center;
+  }
+  .ant-checkbox-wrapper,
+  .ant-checkbox-group-item {
+    display: block;
+    padding: 5px 15px;
+  }
+
+  .ant-checkbox-wrapper:first-child {
+    padding: 0 15px 5px;
+  }
+}
+</style>

+ 468 - 0
src/views/modules/earlyWarningRules/useRuleList.vue

@@ -0,0 +1,468 @@
+<style>
+.rule-tree-select .ant-form-item-control {
+  line-height: inherit;
+}
+</style>
+<template>
+  <div class="ruleSetList">
+    <div class="tabBody">
+      <a-tabs v-model="tabKey" @change="tabChange">
+        <a-tab-pane key="1" tab="模板列表"></a-tab-pane>
+        <a-tab-pane key="2" tab="我的模板"></a-tab-pane>
+      </a-tabs>
+    </div>
+    <div class="tableBody">
+      <!-- <div class="opt" v-if="tabKey == '1'">
+        <a-button type="primary" @click="createNewRule">新建空白规则模板</a-button>
+        <p class="title">已创建的规则模板</p>
+      </div> -->
+      <!-- <div class="opts" v-else>
+        <a-input-search
+          placeholder="请输入规则id"
+          style="width: 350px"
+          v-model="rulesId"
+          enter-button
+          @search="onSearch"
+        />
+      </div> -->
+      <div class="table">
+        <a-table
+          size="middle"
+          :columns="columns"
+          :dataSource="data"
+          bordered
+          id="outTable"
+          :pagination="ipagination"
+          :scroll="{ x: scrollX }"
+          :loading="loading"
+          @change="sort"
+          style="word-break: break-all"
+        >
+          <span slot="status" slot-scope="text, record">
+            <a-spin :spinning="record.spin" size="small">
+              <div class="spin-content">
+                <a-switch size="default" :checked="text" @change="switchChange(text, record)" />
+              </div>
+            </a-spin>
+            <!-- <a-switch size="default" :checked=text  @change="switchChange(text,record)"/> -->
+          </span>
+          <span slot="mediaType" slot-scope="text">
+            {{ text | handleMediaType }}
+          </span>
+          <span slot="processMethod" slot-scope="text">
+            {{ text == 'SEND' ? '仅发送通知' : '发送并关停组' }}
+          </span>
+          <span slot="options" slot-scope="text, record">
+            <a href="javascript:;" @click="editRule(record)">预览模板</a>
+            <a-divider type="vertical" />
+            <a href="javascript:;" @click="pushRule(record)">推送模板</a>
+          </span>
+          <span slot="optionsTwo" slot-scope="text, record">
+            <a href="javascript:;" @click="editRule(record)">编辑模板</a>
+            <a-divider type="vertical" />
+            <a-popconfirm :title="`当前删除会解除此账户绑定模板,确定删除吗?`" @confirm="deleteRule(record)">
+              <a href="javascript:;">删除模板</a>
+            </a-popconfirm>
+          </span>
+        </a-table>
+      </div>
+    </div>
+    <!-- pushRuleVisible -->
+    <a-modal v-model="pushRuleVisible" title="推送账户选择" @ok="handleOk" :confirmLoading="confirmLoading">
+      <a-form layout="inline" class="rule-tree-select">
+        <a-form-item
+          label="请选择账户"
+          :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
+          :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
+        >
+          <Treeselect :appId.sync="accountId" :multiple="false" request="1,3" ref="treeSelect" style="width: 100%" />
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+import moment from 'moment'
+import { getAction, postAction, downFile, downFilePost, deleteAction } from '@/api/manage'
+let existColumns = [
+  // {
+  //     title: '运行/暂停',
+  //     dataIndex: 'status',
+  //     align: 'center',
+  //     width:100,
+  //     key: 'status',
+  //     scopedSlots: { customRender: 'status' }
+  // },
+  {
+    title: '模板id',
+    dataIndex: 'id',
+    align: 'center',
+    key: 'id',
+    scopedSlots: { customRender: 'id' },
+  },
+
+  {
+    title: '模板名称',
+    dataIndex: 'templateName',
+    align: 'center',
+
+    key: 'templateName',
+    scopedSlots: { customRender: 'templateName' },
+  },
+  {
+    title: '应用媒体',
+    dataIndex: 'mediaType',
+    align: 'center',
+    key: 'mediaType',
+    scopedSlots: { customRender: 'mediaType' },
+  },
+
+  {
+    title: '操作',
+    dataIndex: 'options',
+    align: 'center',
+
+    key: 'options',
+    scopedSlots: { customRender: 'options' },
+  },
+]
+
+let recordsColumns = [
+  {
+    title: '模板名称',
+    dataIndex: 'templateName',
+    align: 'center',
+
+    key: 'templateName',
+    scopedSlots: { customRender: 'templateName' },
+  },
+  {
+    title: '模板Id',
+    dataIndex: 'templateId',
+    align: 'center',
+
+    key: 'templateId',
+    scopedSlots: { customRender: 'templateId' },
+  },
+  {
+    title: '账户',
+    dataIndex: 'authName',
+    align: 'center',
+    key: 'authName',
+    scopedSlots: { customRender: 'authName' },
+  },
+  {
+    title: '账户Id',
+    dataIndex: 'accountId',
+    align: 'center',
+    key: 'accountId',
+    scopedSlots: { customRender: 'accountId' },
+  },
+  {
+    title: '运营',
+    dataIndex: 'userName',
+    align: 'center',
+    key: 'userName',
+    scopedSlots: { customRender: 'userName' },
+  },
+  {
+    title: '操作',
+    dataIndex: 'optionsTwo',
+    align: 'center',
+
+    key: 'optionsTwo',
+    scopedSlots: { customRender: 'optionsTwo' },
+  },
+]
+import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
+export default {
+  name: 'useRuleList',
+  data() {
+    return {
+      relationCount: 2,
+      pushRuleVisible: false,
+      confirmLoading: false,
+      accountId: '',
+      templateId: '',
+      tabKey: '1',
+      rulesId: undefined,
+      data: [],
+      columns: [...existColumns],
+      scrollX: 0,
+      loading: false,
+      ipagination: {
+        current: 1,
+        pageSize: 10,
+        //   pageSizeOptions: ['10', '20', '30'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' 共' + total + '条'
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        pageSizeOptions: ['10', '30', '50'],
+        total: 0,
+        onChange: (current, pageSize) => {
+          // 切换分页时的回调,
+          // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+          this.ipagination.current = current
+          this.ipagination.pageSize = pageSize
+        },
+      },
+      url: {
+        list: '/ruleTemplate/list',
+        delete: '/ruleTemplate/delete',
+        getRelationAccountById: '/ruleAccountTemplate/getRelationAccountById',
+        edit: '',
+      },
+    }
+  },
+  components: {
+    Treeselect,
+  },
+  methods: {
+    moment,
+    onSearch(value) {
+      console.log(value)
+    },
+    tabChange(key) {
+      console.log(key)
+      let url = ''
+      if (key == '1') {
+        this.columns = [...existColumns]
+        url = '/ruleTemplate/list'
+      } else {
+        this.columns = [...recordsColumns]
+        url = '/ruleAccountTemplate/getTemplateApplied'
+      }
+      this.getTableListHttp(url)
+    },
+    createNewRule() {
+      this.$router.push('/earlyWarningRules/configRules')
+    },
+    sort(pagination, filters, sorter, { currentDataSource }) {
+      this.ipagination.current = pagination.current
+
+      this.ipagination.pageSize = pagination.pageSize
+      let url = this.tabKey == '1' ? this.url.existUrl : this.url.resultRecordUrl
+
+      this.getTableListHttp(url)
+    },
+    editRule(record) {
+      console.log(record)
+      if (this.tabKey == '1') {
+        var data = { id: record.id, edit: false }
+      } else {
+        var data = { id: record.templateId, edit: true, accountId: record.accountId }
+      }
+
+      localStorage.setItem('getRuleDetail', JSON.stringify(data))
+      this.$router.push('/earlyWarningRules/ruleModule')
+    },
+    pushRule(item) {
+      // this.confirmLoading
+      this.accountId = ''
+      this.templateId = item.id
+      this.pushRuleVisible = true
+    },
+
+    handleOk() {
+      this.confirmLoading = true
+      getAction('/ruleAccountTemplate/checkAccountTemplate', { accountId: this.accountId }).then((res) => {
+        console.log(res)
+        if (res.success) {
+          if (!res.result.isApplication) {
+            postAction('/ruleAccountTemplate/pushTemplateToAccount', {
+              templateId: this.templateId,
+              accountId: this.accountId,
+            }).then((r) => {
+              var data = { id: this.templateId, edit: true, accountId: this.accountId }
+              localStorage.setItem('getRuleDetail', JSON.stringify(data))
+              this.$router.push('/earlyWarningRules/ruleModule')
+              this.confirmLoading = false
+            })
+          } else {
+            this.accountId = ''
+            this.$message.error(`此账户下已绑定模板${res.result.templateName},请重新选择账户`)
+            this.confirmLoading = false
+          }
+        } else {
+          this.accountId = ''
+          this.$message.error(res.message)
+          this.confirmLoading = false
+        }
+      })
+    },
+    // recordsRule(record){
+    //     console.log(record);
+
+    // },
+    showRelativeCount(record) {
+      getAction(this.url.getRelationAccountById, {
+        id: record.id,
+      }).then((res) => {
+        console.log(res)
+        if (res.success) {
+          this.relationCount = res.result.relationCount
+
+          // getAction(this.url.delete,{
+          //     id:record.id
+          // }).then(res=>{
+          //     console.log(res);
+          //     if(res.success){
+          //         this.getTableListHttp(this.url.list)
+          //     }else{
+          //         this.$message.error('删除失败')
+          //     }
+          // })
+        }
+      })
+    },
+    deleteRule(record) {
+      console.log(record)
+      deleteAction('/ruleAccountTemplate/delete', {
+        id: record.id,
+      }).then((res) => {
+        if (res.success) {
+          this.getTableListHttp('/ruleAccountTemplate/getTemplateApplied')
+          // getAction(this.url.delete,{
+          //     id:record.id
+          // }).then(res=>{
+          //     console.log(res);
+          //     if(res.success){
+          //         this.getTableListHttp(this.url.list)
+          //     }else{
+          //         this.$message.error('删除失败')
+          //     }
+          // })
+        }
+      })
+    },
+    switchChange(text, record) {
+      console.log(text, record)
+      record.spin = true
+      let eventRuleStatus = '1'
+      if (text) {
+        eventRuleStatus = '0'
+      } else {
+        eventRuleStatus = '1'
+      }
+
+      postAction('/alarm/alarmEventRule/edit', {
+        eventRuleId: record.eventRuleId,
+        eventRuleStatus,
+      }).then((res) => {
+        console.log(res)
+        record.spin = false
+        if (res.success) {
+          // this.getTableListHttp()
+          if (text) {
+            record.status = false
+            eventRuleStatus = '0'
+          } else {
+            record.status = true
+            eventRuleStatus = '1'
+          }
+        } else {
+          this.$message.error('修改失败')
+          // this.getTableListHttp()
+        }
+      })
+    },
+
+    getTableListHttp(url) {
+      this.data = []
+      this.loading = true
+      // let url='/alarm/alarmEventRule/list'
+      getAction(url, {
+        pageNo: this.ipagination.current,
+        pageSize: this.ipagination.pageSize,
+      }).then((res) => {
+        console.log(res)
+        this.loading = false
+        if (res.success) {
+          if (this.tabKey == '1') {
+            this.data = res.result.records.map((item) => {
+              return {
+                ...item,
+                status: item.eventRuleStatus == '1' ? true : false,
+                spin: false,
+              }
+            })
+          } else {
+            this.data = res.result.list.map((item) => {
+              return {
+                ...item,
+                status: item.eventRuleStatus == '1' ? true : false,
+                spin: false,
+              }
+            })
+          }
+
+          this.ipagination.total = res.result.total
+        }
+      })
+    },
+  },
+
+  mounted() {
+    this.getTableListHttp(this.url.list)
+  },
+  activated() {
+    this.getTableListHttp(this.url.list)
+  },
+  filters: {
+    handleMediaType(val) {
+      switch (val) {
+        case 1:
+          return '头条'
+          break
+
+        case 2:
+          return '快手'
+          break
+
+        case 3:
+          return '头条内广'
+          break
+
+        case 4:
+          return '快手内广'
+          break
+
+        default:
+          break
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.ruleSetList {
+  background: white;
+  padding: 20px;
+  .tabBody {
+    margin-bottom: 5px;
+  }
+  .tableBody {
+    .opt {
+      .title {
+        margin: 15px 0;
+        height: 57px;
+        font-size: 16px;
+        color: #333;
+        line-height: 57px;
+        background: #ffffff;
+        padding-left: 15px;
+        border-radius: 4px 4px 0 0;
+        font-weight: 600;
+        border-bottom: 1px solid #DADFE3;
+      }
+    }
+    .opts {
+      margin-bottom: 15px;
+    }
+  }
+}
+</style>

+ 2 - 1
src/views/modules/kuaishouapp/account/copyGroup.vue

@@ -649,7 +649,8 @@
               console.log(this.populationData.allForm, dataJson.agesRange)
               this.$nextTick(() => {
                 this.form.setFieldsValue(pick(dataJson, ['appId', 'urlType', 'url', 'dayBudget', 'speed',
-                  'showMode'
+                  'showMode',
+                'filterConvertedLevel'
                 ]))
               })
             }

+ 4 - 3
src/views/modules/kuaishouapp/account/editGroup.vue

@@ -726,7 +726,8 @@
             this.$nextTick(() => {
               console.log(dataJson)
               this.form.setFieldsValue(pick(dataJson, ['appId', 'urlType', 'url', 'dayBudget', 'speed',
-                'showMode'
+                'showMode',
+                'filterConvertedLevel'
               ]))
               //   this.form.setFieldsValue({
               //     appId: dataJson.appId
@@ -765,8 +766,8 @@
                 cpaBid: item.cpaBid != '' ? item.cpaBid * 1000 : '',
                 bid: item.bid != '' ? item.bid * 1000 : '',
                 deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
-                ocpxActionType: item.ocpxActionType,
-                bidType: item.bidType == 1 ? 2 : 10
+                ocpxActionType: item.bidType == 4?53:item.ocpxActionType,
+                bidType: item.bidType == 1 ? 2 :item.bidType == 4? item.bidType : 10
               }
             })[0]
             var json = {

+ 6 - 5
src/views/modules/kuaishouapp/account/editGroupNew.vue

@@ -737,7 +737,8 @@
               .appIds) : []
             this.$nextTick(() => {
               this.form.setFieldsValue(pick(dataJson, ['appId', 'urlType', 'url', 'dayBudget', 'speed',
-                'showMode'
+                'showMode',
+                'filterConvertedLevel'
               ]))
             })
           }
@@ -835,8 +836,8 @@
                   cpaBid: item.cpaBid != '' ? item.cpaBid * 1000 : '',
                   bid: item.bid != '' ? item.bid * 1000 : '',
                   deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
-                  ocpxActionType: item.ocpxActionType,
-                  bidType: item.bidType == 1 ? 2 : 10
+                  ocpxActionType: item.bidType == 4?53:item.ocpxActionType,
+                  bidType: item.bidType == 1 ? 2 :item.bidType == 4? item.bidType : 10
                 }
               })[0]
               var param = {
@@ -879,8 +880,8 @@
                   cpaBid: item.cpaBid != '' ? item.cpaBid * 1000 : '',
                   bid: item.bid != '' ? item.bid * 1000 : '',
                   deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
-                  ocpxActionType: item.ocpxActionType,
-                  bidType: item.bidType == 1 ? 2 : 10
+                  ocpxActionType: item.bidType == 4?53:item.ocpxActionType,
+                  bidType: item.bidType == 1 ? 2 :item.bidType == 4? item.bidType : 10
                 }
               })[0]
               console.log(groupArrTwo)

+ 305 - 61
src/views/modules/kuaishouapp/account/stepForm/Step3.vue

@@ -108,7 +108,6 @@ li.chouzhen.first:before {
     height: 250px;
     border: 1px solid #f2f2f2;
     list-style: none;
-
     img,
     video {
       width: 100%;
@@ -384,7 +383,7 @@ li.chouzhen.first:before {
                           </span>
                         </a-form-item>
                         <a-form-item label="广告语">
-                          <a @click="showTitle(index, bestIndex)">推荐广告语</a>
+                          <!-- <a @click="showTitle(index, bestIndex)">推荐广告语</a> -->
 
                           <a-textarea
                             class="rending"
@@ -394,7 +393,7 @@ li.chouzhen.first:before {
                           ></a-textarea>
                           <span v-if="item.description.length > 30" style="color: red">广告语长度不能超过30个字符</span>
                           <br />
-                          <a @click="cunTitle(index, bestIndex)">收藏</a>
+                          <!-- <a @click="cunTitle(index, bestIndex)">收藏</a>
                           <a @click="showCunTitle(index, bestIndex)" style="margin-left: 10px">收藏列表</a>
                           <br />
                           <a-tag
@@ -402,7 +401,7 @@ li.chouzhen.first:before {
                             :key="indexTag"
                             @click="getChange(item, itemTag, index)"
                             >{{ itemTag.name }}</a-tag
-                          >
+                          > -->
                         </a-form-item>
 
                         <a-form-item label="短广告语">
@@ -447,11 +446,13 @@ li.chouzhen.first:before {
               mode="tags"
               style="width: 100%"
               placeholder="按回车生成标签"
-              v-decorator="['creativeTag']"
+              v-decorator="['creativeTag', { validator: creativeTagValid }]"
               dropdownClassName="display-none-selset"
               :token-separators="[',', ' ', ',']"
             >
             </a-select>
+            <span v-if="getData('creativeTag')&&getData('creativeTag').length > 10" style="color:red">创意标签最多填写10个,请删减</span>
+            <br>
             <a-popconfirm @confirm="getInfo(record)">
               <div slot="title">
                 <div>
@@ -533,28 +534,23 @@ li.chouzhen.first:before {
       <a-button type="primary" @click="handleSubmit" :loading="loading">提交</a-button>
     </a-form-item>
     <checkMatemal ref="check" @showVideo="showData"></checkMatemal>
-    <a-modal :maskClosable="false" v-model="visible" title="广告创意创建情况">
-      <div>
-        创建成功:{{ allForm.success.length }}条
-        <div style="margin-top: 20px">
-          <p v-for="(item, index) of allForm.success" :key="index">
-            <span>名称:{{ item.creativeName }}</span>
-          </p>
+    <a-modal :maskClosable="false" v-model="visible" :footer="null" :width="520">
+      <div style="width: 100%; height: 329px; display: flex; flex-flow: column">
+        <main
+          class="container"
+          style="width: 100%; text-align: center; margin: 66px auto 24px; font-size: 30px; font-weight: 100"
+        >
+          <h2 data-splitting class="headline headline--yell" style="color: red">起量</h2>
+        </main>
+
+        <div style="width: 100%; text-align: center; font-size: 24px; margin-bottom: 65px">
+          <img src="@/assets/success.png" alt="" style="width: 24px; margin-right: 10px" />创建成功
         </div>
-        <br />
-        创建失败:{{ allForm.fail.length }}条
-        <div style="margin-top: 20px">
-          <p v-for="(item, index) of allForm.fail" :key="index">
-            <span>名称:{{ item.creativeName }}</span
-            ><br />
-            <span>错误信息:{{ item.failMessage }}</span>
-          </p>
+        <div style="width: 100%; margin-bottom: 43px; display: flex; justify-content: center">
+          <a-button key="submit" type="primary" @click="handleOk" style="margin-right: 8px"> 返回列表 </a-button>
+          <a-button key="back" @click="handleCancel">关闭</a-button>
         </div>
       </div>
-      <template slot="footer">
-        <a-button key="back" @click="handleCancel">关闭</a-button>
-        <a-button key="submit" type="primary" @click="handleOk"> 返回列表 </a-button>
-      </template>
     </a-modal>
     <a-modal
       :maskClosable="false"
@@ -667,15 +663,33 @@ li.chouzhen.first:before {
     <a-modal :maskClosable="false" title="选择素材" v-model="visibleMatemal" @ok="handleOkShow" :width="1000">
       <a-tabs type="card" @change="callback" v-model="active" class="check-video">
         <a-tab-pane :tab="item.label" v-for="item of tab" :key="item.value">
-          <a-range-picker name="buildTime" style="width: 400px; margin: 10px 0" v-model="time" />
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <a-form-item label="日期选择" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-range-picker name="buildTime" v-model="time" />
+              </a-form-item>
+            </a-col>
+            <!-- <a-col :span="12">
+              <a-form-item label="筛选条件" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-select v-model="orderBy" style="width: 100%">
+                  <a-select-option value="time"> 按时间排序 </a-select-option>
+                  <a-select-option value="cost"> 按消耗排序</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col> -->
+          </a-row>
+
           <ul v-if="dataSource.length > 0" style="overflow: auto; padding-left: 0">
             <a-checkbox-group v-model="checkVideo" @change="onChangeVideo" style="width: 100%">
-              <li v-for="(item, index) of dataSource" :key="index" class="chouzhen" style="height: 350px">
+              <li v-for="(item, index) of dataSource" :key="index" class="chouzhen" style="height: 400px">
                 <!-- <video class="video" :src="item.url" controls="controls" style="width:100%">
                   您的浏览器不支持 video 标签。
                 </video> -->
                 <a-checkbox :value="item" style="width: 100%; position: absolute; z-index: 100; right: 0; top: 0">
-                  <img :src="item.coverUrl" alt="" style="width: 100%; margin-bottom: 10px" />
+                  <img :src="item.coverUrl" alt="" style="width: 100%; margin-bottom: 30px" />
+                  <div style="width: 100%; text-align: center">
+                    {{ item.statDate ? '时间:' + item.statDate.split(' ')[0] : '消耗:' + item.charge }}
+                  </div>
                 </a-checkbox>
                 <a @click="matemalVideo(item, index)" style="position: absolute; z-index: 100; right: 56px; bottom: 5px"
                   >查看视频</a
@@ -900,6 +914,7 @@ export default {
       visibleVideo: false,
       videoUrlShow: '',
       time: [],
+      orderBy: 'time',
       channelType: 0,
       checkVideo: [],
       dataSource: [],
@@ -1186,7 +1201,7 @@ export default {
         }
       })
     },
-    
+
     okTag() {
       var data = this.$refs.tree.getCheckedKeys()
       if (data.length > 1) {
@@ -1203,13 +1218,17 @@ export default {
         getAction('/tag/kuaiShouCreativeTagCollection/list', params).then((res) => {
           if (res.success) {
             console.log(res.result)
-            this.form.setFieldsValue({
-              creativeTag: JSON.parse(res.result.records[0].tagArray).map((item) => {
-                return item
-              }),
+            this.$nextTick(() => {
+              this.form.setFieldsValue({
+                creativeTag: JSON.parse(res.result.records[0].tagArray).map((item) => {
+                  return item
+                }),
+              })
+              this.form.validateFields(['creativeTag'])
             })
+
             this.creativeTagVisible = false
-          }else{
+          } else {
             this.$message.error('选择出错,请稍后选择或自行手填')
           }
         })
@@ -1364,6 +1383,13 @@ export default {
         callback('链接不能为空且开头为http://或https://,并且长度小于10000')
       }
     },
+    creativeTagValid(rule, value, callback) {
+      if (value.length > 10) {
+        callback('创意标签最多填写10个,请删减')
+      } else {
+        callback()
+      }
+    },
     showData(item, type) {
       var index = this.pans.findIndex((item) => item.key === this.pansKey)
       // this.pans[index].list[item.key].imageList = []
@@ -1448,7 +1474,7 @@ export default {
       // params.materialType = this.getData('creativeMaterialType')
       // params.pageSize = this.ipagination.pageSize
       // params.pageNo = this.ipagination.current
-      // this.showVideoList('/kuaishou/batch/getVideoList', params)
+      // this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
     },
     getDataSource(page, pageSize) {
       this.ipagination.current = page
@@ -1459,20 +1485,22 @@ export default {
       params.pageNo = page
       params.channelType = this.channelType
       params.status = 0
+      params.orderBy = this.orderBy
       if (this.time.length > 0) {
         // params.startDate = moment(this.time[0]).format('YYYY-MM-DD')
         // params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
         params.startDate = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
         params.endDate = moment(this.time[1]).format('YYYY-MM-DD') + ' 23:59:59'
       }
-      this.showVideoList('/kuaishou/batch/getVideoList', params)
+      this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
     },
     showVideoList(url, params) {
       this.dataSource = []
       this.loadingVideoList = true
       getAction(url, params).then((res) => {
+        console.log(res)
         if (res.success) {
-          this.dataSource = res.result.records
+          this.dataSource = res.result.list
           this.ipagination.total = res.result.total
           this.loadingVideoList = false
         } else {
@@ -1484,6 +1512,7 @@ export default {
       if (type == 'video') {
         nowIndex = index
         bestIndex = bestIndex
+        this.orderBy = 'time'
         this.visibleMatemal = true
         this.checkVideo = []
         this.active = 0
@@ -1496,7 +1525,7 @@ export default {
         //   params.pageSize = this.ipagination.pageSize
         //   params.pageNo = this.ipagination.current
         //   params.params.channelType = 0 = 0
-        //   this.showVideoList('/kuaishou/batch/getVideoList', params)
+        //   this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
       } else {
         this.creativeMaterialType = item.creativeMaterialType
         this.$refs.check.showCheck(
@@ -1540,21 +1569,15 @@ export default {
       }
     },
     handleOk() {
-      if (this.allForm.fail.length == 0) {
-        this.remove(this.pansKey)
-        if (localStorage.getItem('originality')) {
-          this.$router.replace({
-            path: '/account/originality',
-          })
-        } else {
-          this.$router.replace({
-            path: '/account/accountIndex',
-          })
-        }
-
-        this.visible = false
+      this.remove(this.pansKey)
+      if (localStorage.getItem('originality')) {
+        this.$router.replace({
+          path: '/account/originality',
+        })
       } else {
-        this.visible = false
+        this.$router.replace({
+          path: '/account/accountIndex',
+        })
       }
     },
     handleCancel(e) {
@@ -1635,7 +1658,9 @@ export default {
           // var params = {
           params.dataJson = allJson.concat(dataAd)
           // ...values,
-          params.creativeCategory = params.creativeCategory ? params.creativeCategory.pop() : null
+          params.creativeCategory = params.creativeCategory
+            ? params.creativeCategory[params.creativeCategory.length - 1]
+            : null
           params.unitId = this.pansKey
           params.accountId = localStorage.getItem('accountId')
           params.content = this.content
@@ -1643,9 +1668,10 @@ export default {
           postAction('/kuaishou/batch/createCreative', params).then((res) => {
             if (res.success) {
               this.visible = true
-              this.allForm.fail = res.result.fail
-              this.allForm.success = res.result.success
               this.loading = false
+              this.$nextTick(() => {
+                Splitting()
+              })
             } else {
               this.loading = false
               this.$message.error(res.message)
@@ -1728,13 +1754,14 @@ export default {
           params.pageNo = 1
           params.status = 0
           params.channelType = this.channelType
+          params.orderBy = this.orderBy
           if (this.time.length > 0) {
             // params.startDate = moment(this.time[0]).format('YYYY-MM-DD')
             // params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
             params.startDate = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
             params.endDate = moment(this.time[1]).format('YYYY-MM-DD') + ' 23:59:59'
           }
-          this.showVideoList('/kuaishou/batch/getVideoList', params)
+          this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
         } else {
           this.$message.error(res.message)
           this.tongbuLoading = false
@@ -2143,7 +2170,8 @@ export default {
         params.channelType = this.channelType
         params.startDate = moment(n[0]).format('YYYY-MM-DD') + ' 00:00:00'
         params.endDate = moment(n[1]).format('YYYY-MM-DD') + ' 23:59:59'
-        this.showVideoList('/kuaishou/batch/getVideoList', params)
+        params.orderBy = this.orderBy
+        this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
       } else {
         var params = {}
         params.accountId = localStorage.getItem('accountId')
@@ -2152,9 +2180,26 @@ export default {
         params.pageNo = 1
         params.status = 0
         params.channelType = this.channelType
+        params.orderBy = this.orderBy
         this.ipagination.current = 1
-        this.showVideoList('/kuaishou/batch/getVideoList', params)
+        this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
+      }
+    },
+    orderBy(n, o) {
+      var params = {}
+      params.accountId = localStorage.getItem('accountId')
+      params.materialType = this.creativeMaterialType
+      params.pageSize = this.ipagination.pageSize
+      params.pageNo = 1
+      params.status = 0
+      params.channelType = this.channelType
+      if (this.time.length > 0) {
+        params.startDate = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
+        params.endDate = moment(this.time[1]).format('YYYY-MM-DD') + ' 23:59:59'
+      } else {
       }
+      params.orderBy = n
+      this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
     },
     visibleVideo(n, o) {
       if (!n) {
@@ -2169,6 +2214,7 @@ export default {
   },
   mounted: function () {
     this.$nextTick(() => {
+      Splitting()
       if (localStorage.getItem('pans')) {
         this.pans = JSON.parse(localStorage.getItem('pans')).map((item) => {
           return {
@@ -2181,9 +2227,16 @@ export default {
           }
         })
         this.pansKey = this.pans[0].key
-        setTimeout(() => {
-          this.addCreative(0)
-        }, 0)
+        // setTimeout(() => {
+        //   if (
+        //     this.pans.sceneId.indexOf(5) >= 0 ||
+        //     this.pans.sceneId.indexOf(1) >= 0 ||
+        //     this.pans.sceneId.indexOf(7) >= 0 ||
+        //     this.pans.sceneId.indexOf(6) >= 0
+        //   ) {
+        //     this.addCreative(0)
+        //   }
+        // }, 0)
 
         getAction('/kuaishou/batch/checkCreativeCount', {
           unitId: this.pansKey,
@@ -2263,5 +2316,196 @@ export default {
   },
 }
 </script>
-<style lang="scss">
+<style lang="scss" scope>
+$colors: #f9ca24, #3498db, #ff7979, #1abc9c, #e74c3c, #f8c291;
+
+/* Recommended styles for Splitting */
+.splitting .word,
+.splitting .char {
+  display: inline-block;
+}
+
+/* Psuedo-element chars */
+.splitting .char {
+  position: relative;
+}
+
+/**
+ * Populate the psuedo elements with the character to allow for expanded effects
+ * Set to `display: none` by default; just add `display: block` when you want
+ * to use the psuedo elements
+ */
+.splitting .char::before,
+.splitting .char::after {
+  content: attr(data-char);
+  position: absolute;
+  top: 0;
+  left: 0;
+  visibility: hidden;
+  transition: inherit;
+  user-select: none;
+}
+
+/* Expanded CSS Variables */
+
+.splitting {
+  /* The center word index */
+  --word-center: calc((var(--word-total) - 1) / 2);
+
+  /* The center character index */
+  --char-center: calc((var(--char-total) - 1) / 2);
+
+  /* The center character index */
+  --line-center: calc((var(--line-total) - 1) / 2);
+}
+
+.splitting .word {
+  /* Pecent (0-1) of the word's position */
+  --word-percent: calc(var(--word-index) / var(--word-total));
+
+  /* Pecent (0-1) of the line's position */
+  --line-percent: calc(var(--line-index) / var(--line-total));
+}
+
+.splitting .char {
+  /* Percent (0-1) of the char's position */
+  --char-percent: calc(var(--char-index) / var(--char-total));
+
+  /* Offset from center, positive & negative */
+  --char-offset: calc(var(--char-index) - var(--char-center));
+
+  /* Absolute distance from center, only positive */
+  --distance: calc((var(--char-offset) * var(--char-offset)) / var(--char-center));
+
+  /* Distance from center where -1 is the far left, 0 is center, 1 is far right */
+  --distance-sine: calc(var(--char-offset) / var(--char-center));
+
+  /* Distance from center where 1 is far left/far right, 0 is center */
+  --distance-percent: calc((var(--distance) / var(--char-center)));
+}
+
+* {
+  box-sizing: border-box;
+}
+* {
+  margin: 0;
+  padding: 0;
+}
+
+// html, body {
+//   height: 100%;
+// }
+
+.headline {
+  align-items: center;
+  // background-color: var(--color);
+  display: flex;
+  font-family: 'Lexend Deca', sans-serif;
+  font-weight: 400;
+  // font-size: calc(1rem + 15vmin);
+  height: 72px;
+  justify-content: center;
+  // overflow: hidden;
+  perspective: 1000px;
+  scroll-snap-align: start;
+  width: 100%;
+}
+
+.word,
+.char {
+  animation-delay: var(--del);
+  animation-direction: var(--dir, normal);
+  animation-duration: var(--dur);
+  animation-iteration-count: infinite;
+  animation-name: var(--name);
+  animation-timing-function: var(--tf);
+  display: inline-block;
+  position: relative;
+  transform-origin: 50% 100%;
+  z-index: 1;
+}
+
+// =========================
+// Headline animations
+// =========================
+
+.headline--yell .char {
+  --name: yell;
+  --dur: 2s;
+  --tf: ease;
+  -webkit-transform-origin: 50% 100%;
+  transform-origin: 50% 100%;
+}
+@-webkit-keyframes yell {
+  3% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  6% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  12% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  18% {
+    -webkit-transform: scaleY(1) translateY(-2%);
+    transform: scaleY(1) translateY(-2%);
+  }
+  25% {
+    -webkit-transform: scaleY(0.98);
+    transform: scaleY(0.98);
+  }
+  50% {
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+  }
+  75% {
+    -webkit-transform: scale(0.98);
+    transform: scale(0.98);
+  }
+}
+@keyframes yell {
+  3% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  6% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  12% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  18% {
+    -webkit-transform: scaleY(1) translateY(-2%);
+    transform: scaleY(1) translateY(-2%);
+  }
+  25% {
+    -webkit-transform: scaleY(0.98);
+    transform: scaleY(0.98);
+  }
+  50% {
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+  }
+  75% {
+    -webkit-transform: scale(0.98);
+    transform: scale(0.98);
+  }
+}
 </style>

+ 230 - 19
src/views/modules/kuaishouapp/account/stepForm/Step4.vue

@@ -394,11 +394,13 @@ li.chouzhen.first:before {
               mode="tags"
               style="width: 100%"
               placeholder="按回车生成标签"
-              v-decorator="['creativeTag']"
+              v-decorator="['creativeTag', { validator: creativeTagValid }]"
               dropdownClassName="display-none-selset"
               :token-separators="[',',' ',',']"
             >
             </a-select>
+            <span v-if="getData('creativeTag')&&getData('creativeTag').length > 10" style="color:red">创意标签最多填写10个,请删减</span>
+            <br>
             <a-popconfirm @confirm="getInfo(record)">
               <div slot="title">
                 <div>
@@ -474,7 +476,7 @@ li.chouzhen.first:before {
       <a-button type="primary" @click="handleSubmit" :loading="loading">提交</a-button>
     </a-form-item>
     <checkMatemal ref="check" @showVideo="showData"></checkMatemal>
-    <a-modal :maskClosable="false" v-model="visible" title="广告创意创建情况">
+    <!-- <a-modal :maskClosable="false" v-model="visible" title="广告创意创建情况">
       <div style="font-size: 24px">
         {{ allForm.success }}
       </div>
@@ -483,6 +485,24 @@ li.chouzhen.first:before {
         <a-button key="back" @click="handleCancel">关闭</a-button>
         <a-button key="submit" type="primary" @click="handleOk">返回列表</a-button>
       </template>
+    </a-modal> -->
+     <a-modal :maskClosable="false" v-model="visible" :footer="null" :width="520">
+      <div style="width: 100%; height: 329px; display: flex; flex-flow: column">
+        <main
+          class="container"
+          style="width: 100%; text-align: center; margin: 66px auto 24px; font-size: 30px; font-weight: 100"
+        >
+          <h2 data-splitting class="headline headline--yell" style="color: red">起量</h2>
+        </main>
+
+        <div style="width: 100%; text-align: center; font-size: 24px; margin-bottom: 65px">
+          <img src="@/assets/success.png" alt="" style="width: 24px; margin-right: 10px" />创建成功
+        </div>
+        <div style="width: 100%; margin-bottom: 43px; display: flex; justify-content: center">
+          <a-button key="submit" type="primary" @click="handleOk" style="margin-right: 8px"> 返回列表 </a-button>
+          <a-button key="back" @click="handleCancel">关闭</a-button>
+        </div>
+      </div>
     </a-modal>
     <a-modal
       :maskClosable="false"
@@ -573,6 +593,7 @@ li.chouzhen.first:before {
             <a-checkbox
               :value="item.signature"
               style="position: absolute; z-index: 100; width: 100%; height: 100%; right: 0; top: 0; float: right"
+               :disabled="checkList.filter(i=>i==item.signature).length==0&&checkList.length>=4"
             >
               <img :src="item.url" alt style="width: 100%" />
             </a-checkbox>
@@ -1304,6 +1325,13 @@ export default {
       //   }
       // })
     },
+    creativeTagValid(rule, value, callback) {
+      if (value.length > 10) {
+        callback('创意标签最多填写10个,请删减')
+      } else {
+        callback()
+      }
+    },
     okTag() {
       var data = this.$refs.tree.getCheckedKeys()
       if (data.length > 1) {
@@ -1325,8 +1353,9 @@ export default {
                 return item
               }),
             })
+            this.form.validateFields(['creativeTag'])
             this.creativeTagVisible = false
-          }else{
+          } else {
             this.$message.error('选择出错,请稍后选择或自行手填')
           }
         })
@@ -1671,7 +1700,9 @@ export default {
           var params = {
             // dataJson: allJson,
             ...values,
-            creativeCategory: values.creativeCategory ? values.creativeCategory.pop() : null,
+            creativeCategory: values.creativeCategory
+              ? values.creativeCategory[values.creativeCategory.length - 1]
+              : null,
             unitId: this.pansKey,
             accountId: localStorage.getItem('accountId'),
             content: this.content,
@@ -1700,23 +1731,12 @@ export default {
             if (res.success) {
               this.loading = false
               this.visible = true
-              this.allForm.success = '创建成功'
-              // if (localStorage.getItem('originality')) {
-              //   this.$router.replace({
-              //     path: '/account/originality',
-              //   })
-              // } else {
-              //   this.$router.replace({
-              //     path: '/account/accountIndex',
-              //   })
-              // }
+              this.$nextTick(() => {
+                Splitting()
+              })
             } else {
               this.loading = false
               this.$message.error(res.message)
-              this.loading = false
-              this.visible = true
-              this.allForm.fail = res.message
-              this.allForm.success = '创建失败'
             }
           })
         }
@@ -2365,5 +2385,196 @@ export default {
   },
 }
 </script>
-<style lang="scss">
+<style lang="scss" scope>
+$colors: #f9ca24, #3498db, #ff7979, #1abc9c, #e74c3c, #f8c291;
+
+/* Recommended styles for Splitting */
+.splitting .word,
+.splitting .char {
+  display: inline-block;
+}
+
+/* Psuedo-element chars */
+.splitting .char {
+  position: relative;
+}
+
+/**
+ * Populate the psuedo elements with the character to allow for expanded effects
+ * Set to `display: none` by default; just add `display: block` when you want
+ * to use the psuedo elements
+ */
+.splitting .char::before,
+.splitting .char::after {
+  content: attr(data-char);
+  position: absolute;
+  top: 0;
+  left: 0;
+  visibility: hidden;
+  transition: inherit;
+  user-select: none;
+}
+
+/* Expanded CSS Variables */
+
+.splitting {
+  /* The center word index */
+  --word-center: calc((var(--word-total) - 1) / 2);
+
+  /* The center character index */
+  --char-center: calc((var(--char-total) - 1) / 2);
+
+  /* The center character index */
+  --line-center: calc((var(--line-total) - 1) / 2);
+}
+
+.splitting .word {
+  /* Pecent (0-1) of the word's position */
+  --word-percent: calc(var(--word-index) / var(--word-total));
+
+  /* Pecent (0-1) of the line's position */
+  --line-percent: calc(var(--line-index) / var(--line-total));
+}
+
+.splitting .char {
+  /* Percent (0-1) of the char's position */
+  --char-percent: calc(var(--char-index) / var(--char-total));
+
+  /* Offset from center, positive & negative */
+  --char-offset: calc(var(--char-index) - var(--char-center));
+
+  /* Absolute distance from center, only positive */
+  --distance: calc((var(--char-offset) * var(--char-offset)) / var(--char-center));
+
+  /* Distance from center where -1 is the far left, 0 is center, 1 is far right */
+  --distance-sine: calc(var(--char-offset) / var(--char-center));
+
+  /* Distance from center where 1 is far left/far right, 0 is center */
+  --distance-percent: calc((var(--distance) / var(--char-center)));
+}
+
+* {
+  box-sizing: border-box;
+}
+* {
+  margin: 0;
+  padding: 0;
+}
+
+// html, body {
+//   height: 100%;
+// }
+
+.headline {
+  align-items: center;
+  // background-color: var(--color);
+  display: flex;
+  font-family: 'Lexend Deca', sans-serif;
+  font-weight: 400;
+  // font-size: calc(1rem + 15vmin);
+  height: 72px;
+  justify-content: center;
+  // overflow: hidden;
+  perspective: 1000px;
+  scroll-snap-align: start;
+  width: 100%;
+}
+
+.word,
+.char {
+  animation-delay: var(--del);
+  animation-direction: var(--dir, normal);
+  animation-duration: var(--dur);
+  animation-iteration-count: infinite;
+  animation-name: var(--name);
+  animation-timing-function: var(--tf);
+  display: inline-block;
+  position: relative;
+  transform-origin: 50% 100%;
+  z-index: 1;
+}
+
+// =========================
+// Headline animations
+// =========================
+
+.headline--yell .char {
+  --name: yell;
+  --dur: 2s;
+  --tf: ease;
+  -webkit-transform-origin: 50% 100%;
+  transform-origin: 50% 100%;
+}
+@-webkit-keyframes yell {
+  3% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  6% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  12% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  18% {
+    -webkit-transform: scaleY(1) translateY(-2%);
+    transform: scaleY(1) translateY(-2%);
+  }
+  25% {
+    -webkit-transform: scaleY(0.98);
+    transform: scaleY(0.98);
+  }
+  50% {
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+  }
+  75% {
+    -webkit-transform: scale(0.98);
+    transform: scale(0.98);
+  }
+}
+@keyframes yell {
+  3% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  6% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.2)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  12% {
+    -webkit-transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+    transform: scale(calc(1 * var(--distance-percent) + 1.5)) rotate(calc(15deg * var(--distance-sine)))
+      translateY(-10%);
+  }
+  18% {
+    -webkit-transform: scaleY(1) translateY(-2%);
+    transform: scaleY(1) translateY(-2%);
+  }
+  25% {
+    -webkit-transform: scaleY(0.98);
+    transform: scaleY(0.98);
+  }
+  50% {
+    -webkit-transform: scaleY(1);
+    transform: scaleY(1);
+  }
+  75% {
+    -webkit-transform: scale(0.98);
+    transform: scale(0.98);
+  }
+}
 </style>

+ 73 - 0
src/views/modules/kuaishouapp/account/stepForm/stepModule/animate.css

@@ -0,0 +1,73 @@
+
+
+
+
+/* Recommended styles for Splitting */
+.splitting .word,
+.splitting .char {
+  display: inline-block;
+}
+
+/* Psuedo-element chars */
+.splitting .char {
+  position: relative;
+}
+
+/**
+ * Populate the psuedo elements with the character to allow for expanded effects
+ * Set to `display: none` by default; just add `display: block` when you want
+ * to use the psuedo elements
+ */
+.splitting .char::before,
+.splitting .char::after {
+  content: attr(data-char);
+  position: absolute;
+  top: 0;
+  left: 0;
+  visibility: hidden;
+  transition: inherit;
+  user-select: none;
+}
+
+/* Expanded CSS Variables */
+
+.splitting {
+  /* The center word index */
+  --word-center: calc((var(--word-total) - 1) / 2);
+
+  /* The center character index */
+  --char-center: calc((var(--char-total) - 1) / 2);
+
+  /* The center character index */
+  --line-center: calc((var(--line-total) - 1) / 2);
+}
+
+.splitting .word {
+  /* Pecent (0-1) of the word's position */
+  --word-percent: calc(var(--word-index) / var(--word-total));
+
+  /* Pecent (0-1) of the line's position */
+  --line-percent: calc(var(--line-index) / var(--line-total));
+}
+
+.splitting .char {
+  /* Percent (0-1) of the char's position */
+  --char-percent: calc(var(--char-index) / var(--char-total));
+
+  /* Offset from center, positive & negative */
+  --char-offset: calc(var(--char-index) - var(--char-center));
+
+  /* Absolute distance from center, only positive */
+  --distance: calc(
+     (var(--char-offset) * var(--char-offset)) / var(--char-center)
+  );
+
+  /* Distance from center where -1 is the far left, 0 is center, 1 is far right */
+  --distance-sine: calc(var(--char-offset) / var(--char-center));
+
+  /* Distance from center where 1 is far left/far right, 0 is center */
+  --distance-percent: calc((var(--distance) / var(--char-center)));
+}
+
+
+

+ 21 - 1
src/views/modules/kuaishouapp/account/stepForm/stepModule/newModulePop.vue

@@ -544,7 +544,26 @@ li:hover {
         </a-select-option>
       </a-select>
     </a-form-item>
-
+<a-form-item
+      label="过滤已转化用户"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+    >
+      <!-- v-decorator="[
+          'isOpen',
+          {
+            initialValue: '0'
+          }
+        ]" -->
+     <a-radio-group buttonStyle="solid" v-decorator="['filterConvertedLevel',{initialValue: 0}]">
+        <a-radio-button :value="0">不限</a-radio-button>
+        <a-radio-button :value="1">广告组</a-radio-button>
+        <a-radio-button :value="2">广告计划</a-radio-button>
+        <a-radio-button :value="3">本账户</a-radio-button>
+        <a-radio-button :value="4">公司主体</a-radio-button>
+        <a-radio-button :value="5">APP</a-radio-button>
+      </a-radio-group>
+    </a-form-item>
     <a-form-item
       label="智能扩量"
       :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
@@ -797,6 +816,7 @@ export default {
                 'deviceBrand',
                 'devicePrice',
                 'businessInterest',
+                'filterConvertedLevel'
               ])
             )
           })

+ 22 - 2
src/views/modules/kuaishouapp/account/stepForm/stepModule/targetedPopulation.vue

@@ -522,7 +522,26 @@ li:hover {
         }}</a-select-option>
       </a-select>
     </a-form-item>
-
+    <a-form-item
+      label="过滤已转化用户"
+      :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+      :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+    >
+      <!-- v-decorator="[
+          'isOpen',
+          {
+            initialValue: '0'
+          }
+        ]" -->
+     <a-radio-group buttonStyle="solid" v-decorator="['filterConvertedLevel',{initialValue: 0}]">
+        <a-radio-button :value="0">不限</a-radio-button>
+        <a-radio-button :value="1">广告组</a-radio-button>
+        <a-radio-button :value="2">广告计划</a-radio-button>
+        <a-radio-button :value="3">本账户</a-radio-button>
+        <a-radio-button :value="4">公司主体</a-radio-button>
+        <a-radio-button :value="5">APP</a-radio-button>
+      </a-radio-group>
+    </a-form-item>
     <a-form-item
       label="智能扩量"
       :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
@@ -780,7 +799,8 @@ export default {
                 'iosOsv',
                 'deviceBrand',
                 'devicePrice',
-                'businessInterest'
+                'businessInterest',
+                'filterConvertedLevel'
               ])
             )
           })

+ 462 - 0
src/views/modules/kuaishouapp/crossAccount/createCampaign.vue

@@ -0,0 +1,462 @@
+<style>
+.create-campaign .ant-form-item-control {
+  line-height: inherit;
+}
+</style>
+<template>
+  <a-card :body-style="{ padding: '24px 32px' }" :bordered="false" class="create-campaign">
+    <a-form @submit="handleSubmit" :form="form">
+      <a-form-item
+        label="选择账户"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <Treeselect :appId.sync="accountIds" request="2,4" ref="treeSelect" style="width: 100%" />
+      </a-form-item>
+      <a-form-item
+        label="推广目的"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-radio-group v-decorator="['type', { initialValue: 2 }]" buttonStyle="solid">
+          <!-- <a-radio-button
+            v-for="purpose in typeList"
+            :key="purpose.itemText"
+            :value="purpose.itemValue"
+          >{{purpose.itemText}}</a-radio-button> -->
+          <a-radio-button :value="2">提升应用安装</a-radio-button>
+          <a-radio-button :value="3">获取电商下单</a-radio-button>
+          <a-radio-button :value="4">推广品牌活动</a-radio-button>
+          <a-radio-button :value="5">收集销售线索</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+
+      <a-form-item
+        label="创建数量"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <!-- {{ createTotal }} -->
+        <a-input-number
+          v-decorator="['createTotal', { initialValue: 1 }]"
+          :min="1"
+          :max="10"
+          @change="changeCreateTotal"
+        />
+      </a-form-item>
+      <a-form-item
+        label="命名方式"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-radio-group v-decorator="['nameType', { initialValue: 0 }]" buttonStyle="solid" @change="nameTypeChange">
+          <a-radio-button :value="0">统一命名</a-radio-button>
+          <a-radio-button :value="1">分别命名</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        label="计划名称"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        v-if="getData('nameType') == 0"
+      >
+        <!-- campaignName -->
+
+        <a-input
+          class="rending"
+          placeholder="请输入计划名称"
+          v-model="campaignName"
+          style="margin-bottom: 20px"
+        ></a-input>
+        <br />
+        <a-tag color="#2db7f5" @click="getChange('项目名称', 0)">项目名称</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('计划类型', 0)">计划类型</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('日期', 0)">日期</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('数值', 0)">数值</a-tag>
+      </a-form-item>
+      <a-form-item
+        label="计划名称"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+        v-if="getData('nameType') == 1"
+      >
+        <!-- campaignName -->
+        <!-- @change="callback" -->
+        <!-- {{ tabs }} -->
+        <a-tabs v-model="active" type="card">
+          <a-tab-pane :key="item.accountId" :tab="item.authName" v-for="(item, index) of tabs">
+            <div v-for="(items, indexBest) of item.campaignNames" :key="indexBest" style="margin-bottom: 10px">
+              <a-input
+                class="rending"
+                placeholder="请输入计划名称"
+                v-model="items.campaignName"
+                style="margin-bottom: 10px"
+              ></a-input>
+              <br />
+              <a-tag color="#2db7f5" @click="getChangeAll('项目名称', indexBest, index, items)">项目名称</a-tag>
+              <a-tag color="#2db7f5" @click="getChangeAll('计划类型', indexBest, index, items)">计划类型</a-tag>
+              <a-tag color="#2db7f5" @click="getChangeAll('日期', indexBest, index, items)">日期</a-tag>
+              <a-tag color="#2db7f5" @click="getChangeAll('数值', indexBest, index, items)">数值</a-tag>
+            </div>
+          </a-tab-pane>
+        </a-tabs>
+        <!-- <a-input
+          class="rending"
+          placeholder="请输入计划名称"
+          v-model="campaignName"
+          style="margin-bottom: 20px"
+        ></a-input>
+        <br />
+        <a-tag color="#2db7f5" @click="getChange('项目名称')">项目名称</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('计划类型')">计划类型</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('日期')">日期</a-tag>
+        <a-tag color="#2db7f5" @click="getChange('数值')">数值</a-tag> -->
+      </a-form-item>
+      <a-form-item
+        label="单日预算"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-radio-group @change="showBudgetStatusChange" v-model="campaignBudget" buttonStyle="solid">
+          <a-radio-button value="UNLIMITED">不限</a-radio-button>
+          <a-radio-button value="AS_BUDGET">统一预算</a-radio-button>
+          <a-radio-button value="DAY_BUDGET">分日预算</a-radio-button>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item
+        label="预算金额"
+        v-if="campaignBudget == 'AS_BUDGET'"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
+      >
+        <a-input
+          v-decorator="[
+            'dayBudget',
+            { rules: [{ required: true, message: 'error:' }, { validator: handleConfirmValue }] },
+          ]"
+          placeholder="不小于500,不超过100000000,仅支持输入自然数"
+          type="number"
+          style="width: 70%"
+        ></a-input
+        >元
+      </a-form-item>
+      <a-form-item
+        label="分日预算"
+        v-if="campaignBudget == 'DAY_BUDGET'"
+        :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
+        :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"
+      >
+        <!-- <a-input
+          v-decorator="[
+            'dayBudget',
+            { rules: [{ required: true, message: 'error:' }, { validator: handleConfirmValue }] },
+          ]"
+          placeholder="不小于500,不超过100000000,仅支持输入自然数"
+          type="number"
+          style="width: 70%"
+        ></a-input
+        >元 -->
+        <a-row>
+          <a-col :span="3" v-for="(item, index) of dayBudgetSchedule" :key="index">
+            <a-card :title="'周' + numberReturn(index)">
+              <a-input-number :min="500" :max="100000000" v-model="item.one" :precision="1" />
+            </a-card>
+          </a-col>
+        </a-row>
+      </a-form-item>
+      <a-form-item :wrapperCol="{ span: 24 }" style="text-align: center">
+        <a-button htmlType="submit" type="primary" :loading="loading">下一步</a-button>
+        <!-- <a-button style="margin-left: 8px">保存</a-button> -->
+      </a-form-item>
+    </a-form>
+  </a-card>
+</template>
+
+<script>
+import { deleteAction, postAction, getAction } from '@/api/manage'
+import moment from 'moment'
+import { mapActions, mapGetters } from 'vuex'
+import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
+export default {
+  name: 'create-campaign',
+  components: {
+    Treeselect,
+  },
+  data() {
+    return {
+      accountIds: [],
+      active: null,
+      promotionName: '',
+      tabs: [],
+      dayBudgetSchedule: [{ one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }],
+      type: '2',
+      typeList: {},
+      appList: {},
+      showBudgetDaily: false,
+      campaignName: '',
+      campaignBudget: 'UNLIMITED',
+      dayBudget: 0,
+      appId: '0', //应用目标
+      showApp: true,
+      redirectUrl: '', // 链接地址
+      showRedirect: false,
+      urlType: '1',
+      showUrlType: false,
+      channelType: '1',
+      showChannelType: false,
+      loading: false,
+      form: this.$form.createForm(this),
+      url: {
+        dictListUrl: 'toutiao/dictitem/list',
+        appListUrl: '/kuaishou/kuaiShouCreateAppTemplate/list',
+        insertTemplateUrl: '/kuaishou/batch/campaignCreate',
+      },
+      createTotal: [],
+    }
+  },
+  methods: {
+    ...mapGetters(['nickname', 'avatar', 'userInfo']),
+    numberReturn(num) {
+      var arr = ['一', '二', '三', '四', '五', '六', '天']
+      return arr[num]
+    },
+    getCampaignId(campaignId) {
+      alert(1)
+    },
+    changeCreateTotal() {
+      this.$nextTick(() => {
+        this.createTotal = []
+        for (let i = 0; i < this.getData('createTotal'); i++) {
+          this.createTotal.push({ campaignName: '' })
+        }
+      })
+    },
+    nameTypeChange(e) {
+      console.log(e.target.value)
+      if (e.target.value == 1) {
+        if (this.accountIds.length > 0) {
+          postAction('/kuaishou/crossAccount/getAuthName', { accountArr: this.accountIds }).then((res) => {
+            if (res.success) {
+              this.tabs = res.result.map((item) => {
+                return {
+                  ...item,
+                  campaignNames: JSON.parse(JSON.stringify(this.createTotal)),
+                }
+              })
+              this.active = res.result[0].accountId
+            } else {
+              this.tabs = []
+            }
+          })
+        }
+      } else {
+      }
+    },
+    getChangeAll(name, indexBest, index, items) {
+      var node = document.getElementsByClassName('rending')[indexBest + this.getData('createTotal') * index]
+      var v = '{{' + name + '}}-'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+        items.campaignName = v
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        items.campaignName = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+        // this.campaignName = node.value
+      } else {
+        //OTHER
+        node.value += v
+        console.log(node.value)
+        items.campaignName = node.value
+        node.focus()
+        // this.campaignName = node.value
+      }
+    },
+    getChange(name, index) {
+      console.log(index, document.getElementsByClassName('rending'))
+      var node = document.getElementsByClassName('rending')[index]
+      var v = '{{' + name + '}}-'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+        this.campaignName = v
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        this.campaignName = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+        // this.campaignName = node.value
+      } else {
+        //OTHER
+        node.value += v
+        this.campaignName = node.value
+        node.focus()
+        // this.campaignName = node.value
+      }
+    },
+    handleConfirmValue(rule, value, callback) {
+      if (value == '' || value < 500 || value >= 100000000) {
+        callback('请输入正确预算金额')
+      }
+      callback()
+    },
+
+    handleConfirmAppId(rule, value, callback) {
+      if (this.type == 2 && (this.appId == '0' || this.appId == '')) {
+        callback('请选择目标应用')
+      }
+      callback()
+    },
+
+    handleSubmit(e) {
+      e.preventDefault()
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.loading = true
+
+          let params = {}
+          params.type = values.type
+          //   params.campaignBudget = this.campaignBudget
+          if (this.campaignBudget == 'UNLIMITED') {
+            params.dayBudget = 0
+          } else if (this.campaignBudget == 'AS_BUDGET') {
+            params.dayBudget = values.dayBudget * 1000
+          } else {
+            params.dayBudgetSchedule = this.dayBudgetSchedule.map((item) => {
+              if (item.one == '') {
+                return 0
+              } else {
+                return item.one * 1000
+              }
+            })
+          }
+          if (this.getData('nameType') == 0) {
+            var dataArr = this.campaignName.split('-')
+            if (dataArr[dataArr.length - 1] == '') {
+              dataArr.pop()
+            }
+            params.campaignName = dataArr.join('-')
+          } else {
+            params.nameArr = this.tabs.map((item) => {
+              return {
+                accountId: item.accountId,
+                campaignNames: item.campaignNames.map((i) => {
+                  return i.campaignName
+                }),
+              }
+            })
+          }
+
+          params.accountArr = this.accountIds
+          params.nameType = values.nameType
+          params.createTotal = values.createTotal
+          console.log(params)
+
+          postAction('/kuaishou/crossAccount/batchCampaignCreate', params).then((res) => {
+            console.log(res)
+            if (res.success) {
+              this.$message.success('创建成功')
+              localStorage.setItem('campaignId', res.result)
+              this.loading = false
+              this.nextStep(res.result)
+            } else {
+              this.$message.error(res.message)
+              this.loading = false
+            }
+          })
+        }
+      })
+    },
+    onChange(value) {
+      console.log(value)
+    },
+    showBudgetStatusChange() {
+      if (this.campaignBudget == 'UNLIMITED') {
+        this.showBudgetDaily = false
+        this.dayBudget = 0
+      } else {
+        this.showBudgetDaily = true
+        this.dayBudget = ''
+      }
+    },
+    typeChange() {
+      if (this.type == 2) {
+        this.promotionName = '提升应用安装'
+        this.showApp = true
+        this.showRedirect = false
+        this.showUrlType = false
+        this.showChannelType = false
+      }
+      if (this.type == 3) {
+        this.promotionName = '获取电商下单'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = true
+        this.showChannelType = false
+      }
+      if (this.type == 4) {
+        this.promotionName = '推广品牌活动'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = false
+        this.showChannelType = false
+      }
+      if (this.type == 5) {
+        this.promotionName = '收集销售线索'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = false
+        this.showChannelType = true
+      }
+      this.campaignName = this.promotionName + '_' + moment(new Date())
+    },
+    handleChange(value) {
+      console.log(`selected ${value}`)
+    },
+    handleBlur() {
+      console.log('blur')
+    },
+    handleFocus() {
+      console.log('focus')
+    },
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    nextStep() {
+      this.$emit('nextStep')
+    },
+    getData(className) {
+      return this.form.getFieldValue(className)
+    },
+  },
+  mounted: function () {
+    this.$nextTick(() => {
+      this.changeCreateTotal()
+    })
+  },
+}
+</script>

+ 564 - 0
src/views/modules/kuaishouapp/crossAccount/createUnit.vue

@@ -0,0 +1,564 @@
+<style>
+.create-unit .ant-form-item-control {
+  line-height: inherit;
+}
+.create-unit .ant-tabs-bar {
+  width: 50%;
+  margin: auto;
+  margin-bottom: 16px;
+  border-bottom: 1px solid #e8e8e8;
+  outline: none;
+  -webkit-transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.create-unit .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
+  color: #fff;
+  background: #1890ff !important;
+  border-color: #1890ff !important;
+  border-bottom: 1px solid #1890ff !important;
+}
+.create-unit .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab {
+  height: 40px;
+  margin: 0;
+  margin-right: 2px;
+  padding: 0 16px;
+  line-height: 38px;
+  background: #fafafa;
+  border: 1px solid #e8e8e8 !important;
+  border-radius: 4px 4px 0 0 !important;
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+</style>
+<template>
+  <div class="create-unit">
+    <a-card :body-style="{ padding: '24px 32px' }" :bordered="false">
+      <a-form-model ref="unitCreate" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
+        <a-tabs type="card" :label-col="labelCol" :wrapper-col="wrapperCol">
+          <a-tab-pane
+            :key="item.account.accountId"
+            :tab="'账户:' + item.account.accountName"
+            v-for="(item, index) of form.accountArr"
+          >
+            <a-form-model-item label="计划下组是否相同" prop="campaignAgreement">
+              <a-radio-group v-model="item.account.campaignAgreement" buttonStyle="solid" @change="nameTypeChange">
+                <a-radio-button :value="0">是</a-radio-button>
+                <a-radio-button :value="1">否</a-radio-button>
+              </a-radio-group>
+            </a-form-model-item>
+            <a-form-model-item label="计划下组数量" prop="unitCount">
+              <a-input-number v-model="item.account.unitCount" :min="1" :max="10" @change="changeCreateTotal(item)" />
+            </a-form-model-item>
+            <!-- <a-form-model-item label="计划名称" prop="campaign"> -->
+            <a-tabs type="card" v-if="item.account.campaignAgreement == 1">
+              <a-tab-pane
+                :key="campaign.campaignId"
+                :tab="'计划:' + campaign.campaignName"
+                v-for="(campaign, campaignIndex) of item.account.campaignList"
+              >
+                <a-form-model-item
+                  ref="unitName"
+                  v-for="(unitName, indexUnit) of campaign.unitNames"
+                  :key="indexUnit"
+                  :label="indexUnit == 0 ? '组名称' : ''"
+                  v-bind="indexUnit !== 0 ? formItemLayout : {}"
+                  :prop="
+                    'accountArr.' +
+                    index +
+                    '.account.campaignList.' +
+                    campaignIndex +
+                    '.unitNames.' +
+                    indexUnit +
+                    '.value'
+                  "
+                  :rules="{
+                    required: true,
+                    message: '组名称必填',
+                    trigger: 'blur',
+                  }"
+                  ><a-input v-model="unitName.value" placeholder="请输入组名称" style="width: 60%; margin-right: 8px" />
+                </a-form-model-item>
+                <a-form-model-item label="投放范围" v-if="item.account.allianceAccount">
+                  <a-radio-group buttonStyle="solid" v-model="campaign.allianceAccount">
+                    <a-radio-button value="1">默认</a-radio-button>
+                    <a-radio-button value="2">联盟广告</a-radio-button>
+                  </a-radio-group>
+                </a-form-model-item>
+              </a-tab-pane>
+            </a-tabs>
+            <div v-else>
+              <a-form-model-item
+                ref="unitName"
+                v-for="(unitName, indexUnit) of item.account.campaignOne.unitNames"
+                :key="indexUnit"
+                :label="indexUnit == 0 ? '组名称' : ''"
+                v-bind="indexUnit !== 0 ? formItemLayout : {}"
+                :prop="'accountArr.' + index + '.account.campaignOne.unitNames.' + indexUnit + '.value'"
+                :rules="{
+                  required: true,
+                  message: '组名称必填',
+                  trigger: 'blur',
+                }"
+                ><a-input v-model="unitName.value" placeholder="请输入组名称" style="width: 60%; margin-right: 8px" />
+              </a-form-model-item>
+              <a-form-model-item label="投放范围" v-if="item.account.allianceAccount">
+                <a-radio-group buttonStyle="solid" v-model="item.account.campaignOne.allianceAccount">
+                  <a-radio-button value="1">默认</a-radio-button>
+                  <a-radio-button value="2">联盟广告</a-radio-button>
+                </a-radio-group>
+              </a-form-model-item>
+            </div>
+
+            <!-- </a-form-model-item> -->
+          </a-tab-pane>
+          <!-- <a-tab-pane key="2" tab="Tab 2"> Content of Tab Pane 2 </a-tab-pane>
+          <a-tab-pane key="3" tab="Tab 3"> Content of Tab Pane 3 </a-tab-pane> -->
+        </a-tabs>
+        <a-form-model-item
+          :wrapperCol="{
+            xs: { span: 24, offset: 0 },
+            sm: { span: 20, offset: 7 },
+          }"
+        >
+          <a-button type="primary" html-type="submit" @click="submitForm('unitCreate')"> 提交 </a-button>
+          <a-button style="margin-left: 10px" @click="resetForm('unitCreate')"> 重置 </a-button>
+        </a-form-model-item>
+        <!-- <a-form-model-item
+          ref="unitName"
+          prop="unitName"
+          v-for="(domain, index) in tabList[activeIndex].form.unitName"
+          :key="index"
+          :label="index === 0 ? '组名称' : ''"
+          :prop="'unitName.' + index + '.value'"
+          :rules="{
+            required: true,
+            message: '组名称必填',
+            trigger: 'blur',
+          }"
+          ><a-input v-model="domain.value" placeholder="请输入组名称" style="width: 60%; margin-right: 8px" />
+        </a-form-model-item> -->
+      </a-form-model>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { deleteAction, postAction, getAction } from '@/api/manage'
+import moment from 'moment'
+import { mapActions, mapGetters } from 'vuex'
+import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
+export default {
+  name: 'create-unit',
+  components: {
+    Treeselect,
+  },
+  data() {
+    return {
+      labelCol: { span: 7 },
+      wrapperCol: { span: 17 },
+      formItemLayout: {
+        labelCol: {
+          xs: { span: 7 },
+          sm: { span: 7 },
+        },
+        wrapperCol: {
+          xs: { span: 17, offset: 0 },
+          sm: { span: 17, offset: 7 },
+        },
+      },
+      form: {
+        accountArr: [
+          {
+            account: {
+              accountId: 23212,
+              accountName: '环球黑卡',
+              campaignAgreement: 0,
+              unitCount: 1,
+              allianceAccount: true,
+              campaignType: 2,
+              campaignList: [
+                { campaignId: 1231231, campaignName: '测试', unitNames: [{ value: '' }], allianceAccount: '1' },
+                { campaignId: 12331, campaignName: '测`试', unitNames: [{ value: '' }], allianceAccount: '1' },
+                { campaignId: 123311, campaignName: '测1试', unitNames: [{ value: '' }], allianceAccount: '1' },
+                { campaignId: 123312, campaignName: '测3试', unitNames: [{ value: '' }], allianceAccount: '1' },
+              ],
+              campaignOne: { unitNames: [{ value: '' }], allianceAccount: '1' },
+            },
+          },
+          {
+            account: {
+              accountId: 232121,
+              accountName: '环球黑卡2',
+              campaignAgreement: 0,
+              campaignType: 3,
+              allianceAccount: false,
+              unitCount: 1,
+              campaignList: [
+                { campaignId: 1231231, campaignName: '测试', unitNames: [{ value: '' }], allianceAccount: '1' },
+              ],
+              campaignOne: { unitNames: [{ value: '' }], allianceAccount: '1' },
+            },
+          },
+          {
+            account: {
+              accountId: 232,
+              accountName: '环球黑卡`2',
+              campaignAgreement: 0,
+              campaignType: 4,
+              allianceAccount: false,
+              unitCount: 1,
+              campaignList: [
+                { campaignId: 1231231, campaignName: '测试', unitNames: [{ value: '' }], allianceAccount: '1' },
+              ],
+              campaignOne: { unitNames: [{ value: '' }], allianceAccount: '1' },
+            },
+          },
+        ],
+      },
+      tabList: [
+        {
+          key: 'article',
+          tab: '账户1',
+          form: {
+            campaignAgreement: 0,
+            unitName: [{ value: '' }],
+          },
+        },
+        {
+          key: 'app',
+          tab: '账户2',
+          form: {
+            campaignAgreement: 0,
+            unitName: [{ value: '' }],
+          },
+        },
+        {
+          key: 'project',
+          tab: '账户3',
+          form: {
+            campaignAgreement: 1,
+            unitName: [{ value: '' }],
+          },
+        },
+      ],
+      key: 'article',
+      activeIndex: 0,
+      accountIds: [],
+      active: null,
+      promotionName: '',
+      tabs: [],
+      dayBudgetSchedule: [{ one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }],
+      type: '2',
+      typeList: {},
+      appList: {},
+      showBudgetDaily: false,
+      campaignName: '',
+      campaignBudget: 'UNLIMITED',
+      dayBudget: 0,
+      appId: '0', //应用目标
+      showApp: true,
+      redirectUrl: '', // 链接地址
+      showRedirect: false,
+      urlType: '1',
+      showUrlType: false,
+      channelType: '1',
+      showChannelType: false,
+      loading: false,
+
+      url: {
+        dictListUrl: 'toutiao/dictitem/list',
+        appListUrl: '/kuaishou/kuaiShouCreateAppTemplate/list',
+        insertTemplateUrl: '/kuaishou/batch/campaignCreate',
+      },
+      createTotal: [],
+    }
+  },
+  methods: {
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          alert('submit!')
+          console.log(this.tabList)
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields()
+    },
+    onTabChange(key, type) {
+      console.log(key, type)
+      this[type] = key
+      this.activeIndex = this.tabList.findIndex((item) => this.key == item.key)
+    },
+    ...mapGetters(['nickname', 'avatar', 'userInfo']),
+    numberReturn(num) {
+      var arr = ['一', '二', '三', '四', '五', '六', '天']
+      return arr[num]
+    },
+    getCampaignId(campaignId) {
+      alert(1)
+    },
+    changeCreateTotal(item) {
+      this.$nextTick(() => {
+        // if()
+        console.log(item)
+        var arr = []
+        for (let i = 0; i < item.account.unitCount; i++) {
+          arr.push({ value: '' })
+        }
+        item.account.campaignOne.unitNames = JSON.parse(JSON.stringify(arr))
+        item.account.campaignList.forEach((element) => {
+          element.unitNames = JSON.parse(JSON.stringify(arr))
+        })
+      })
+    },
+    nameTypeChange(e) {
+      console.log(e.target.value)
+      if (e.target.value == 1) {
+        if (this.accountIds.length > 0) {
+          postAction('/kuaishou/crossAccount/getAuthName', { accountArr: this.accountIds }).then((res) => {
+            if (res.success) {
+              this.tabs = res.result.map((item) => {
+                return {
+                  ...item,
+                  campaignNames: JSON.parse(JSON.stringify(this.createTotal)),
+                }
+              })
+              this.active = res.result[0].accountId
+            } else {
+              this.tabs = []
+            }
+          })
+        }
+      } else {
+      }
+    },
+    getChangeAll(name, indexBest, index, items) {
+      var node = document.getElementsByClassName('rending')[indexBest]
+      var v = '{{' + name + '}}-'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+        items.campaignName = v
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        items.campaignName = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+        // this.campaignName = node.value
+      } else {
+        //OTHER
+        node.value += v
+        items.campaignName = node.value
+        node.focus()
+        // this.campaignName = node.value
+      }
+    },
+    getChange(name, index) {
+      console.log(index, document.getElementsByClassName('rending'))
+      var node = document.getElementsByClassName('rending')[index]
+      var v = '{{' + name + '}}-'
+      if (document.selection) {
+        //IE
+        node.focus()
+        var sel = document.selection.createRange()
+        sel.text = v
+        sel.select()
+        this.campaignName = v
+      } else if (node.selectionStart || node.selectionStart == '0') {
+        //MOZILLA/GOOGLE
+        var startPos = node.selectionStart
+        var endPos = node.selectionEnd
+        var restoreTop = node.scrollTop
+        node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
+        if (restoreTop > 0) {
+          node.scrollTop = restoreTop
+        }
+        this.campaignName = node.value
+        node.focus()
+        node.selectionStart = startPos + v.length
+        node.selectionEnd = startPos + v.length
+        // this.campaignName = node.value
+      } else {
+        //OTHER
+        node.value += v
+        this.campaignName = node.value
+        node.focus()
+        // this.campaignName = node.value
+      }
+    },
+    handleConfirmValue(rule, value, callback) {
+      if (value == '' || value < 500 || value >= 100000000) {
+        callback('请输入正确预算金额')
+      }
+      callback()
+    },
+
+    handleConfirmAppId(rule, value, callback) {
+      if (this.type == 2 && (this.appId == '0' || this.appId == '')) {
+        callback('请选择目标应用')
+      }
+      callback()
+    },
+
+    handleSubmit(e) {
+      e.preventDefault()
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.loading = true
+
+          let params = {}
+          params.type = values.type
+          //   params.campaignBudget = this.campaignBudget
+          if (this.campaignBudget == 'UNLIMITED') {
+            params.dayBudget = 0
+          } else if (this.campaignBudget == 'AS_BUDGET') {
+            params.dayBudget = values.dayBudget * 1000
+          } else {
+            params.dayBudgetSchedule = this.dayBudgetSchedule.map((item) => {
+              if (item.one == '') {
+                return 0
+              } else {
+                return item.one * 1000
+              }
+            })
+          }
+          // if (this.getData('nameType') == 0) {
+          //   var dataArr = this.campaignName.split('-')
+          //   if (dataArr[dataArr.length - 1] == '') {
+          //     dataArr.pop()
+          //   }
+          //   params.campaignName = dataArr.join('-')
+          // } else {
+          //   params.nameArr = this.tabs.map((item) => {
+          //     return {
+          //       accountId: item.accountId,
+          //       campaignNames: item.campaignNames.map((i) => {
+          //         return i.campaignName
+          //       }),
+          //     }
+          //   })
+          // }
+
+          params.accountArr = this.accountIds
+          params.nameType = values.nameType
+          params.createTotal = values.createTotal
+          console.log(params)
+
+          postAction('/kuaishou/crossAccount/batchCampaignCreate', params).then((res) => {
+            console.log(res)
+            if (res.success) {
+              this.$message.success('创建成功')
+              localStorage.setItem('campaignId', res.result)
+              this.loading = false
+              this.nextStep(res.result)
+            } else {
+              this.$message.error(res.message)
+              this.loading = false
+            }
+          })
+        }
+      })
+    },
+    onChange(value) {
+      console.log(value)
+    },
+    showBudgetStatusChange() {
+      if (this.campaignBudget == 'UNLIMITED') {
+        this.showBudgetDaily = false
+        this.dayBudget = 0
+      } else {
+        this.showBudgetDaily = true
+        this.dayBudget = ''
+      }
+    },
+    typeChange() {
+      if (this.type == 2) {
+        this.promotionName = '提升应用安装'
+        this.showApp = true
+        this.showRedirect = false
+        this.showUrlType = false
+        this.showChannelType = false
+      }
+      if (this.type == 3) {
+        this.promotionName = '获取电商下单'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = true
+        this.showChannelType = false
+      }
+      if (this.type == 4) {
+        this.promotionName = '推广品牌活动'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = false
+        this.showChannelType = false
+      }
+      if (this.type == 5) {
+        this.promotionName = '收集销售线索'
+        this.showApp = false
+        this.showRedirect = true
+        this.showUrlType = false
+        this.showChannelType = true
+      }
+      this.campaignName = this.promotionName + '_' + moment(new Date())
+    },
+    handleChange(value) {
+      console.log(`selected ${value}`)
+    },
+    handleBlur() {
+      console.log('blur')
+    },
+    handleFocus() {
+      console.log('focus')
+    },
+    filterOption(input, option) {
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    nextStep() {
+      this.$emit('nextStep')
+    },
+    // getData(className) {
+    //   return this.form.getFieldValue(className)
+    // },
+    getLOLTrue(accountId) {
+      getAction('/kuaishou/batch/getWhiteList', {
+        accountId: accountId,
+      }).then((res) => {
+        if (res.success) {
+          console.log(res)
+          if (res.result) {
+            if (res.result.alliance_account == 1) {
+              return true
+            } else {
+              return false
+            }
+          } else {
+            return false
+          }
+        }
+      })
+    },
+  },
+  mounted: function () {
+    this.$nextTick(() => {
+      // this.changeCreateTotal()
+      this.activeIndex = this.tabList.findIndex((item) => this.key == item.key)
+    })
+  },
+}
+</script>

File diff suppressed because it is too large
+ 888 - 0
src/views/modules/material/musicBytedance.vue


+ 17 - 12
src/views/modules/material/musicTab.vue

@@ -67,13 +67,13 @@
 }
 </style>
 <template>
-  <div class="music-tab" style="background:white;padding:20px">
-    <a-tabs default-active-key="1">
+  <div class="music-tab" style="background: white; padding: 20px">
+    <a-tabs v-model="active" @change="callBack">
       <a-tab-pane key="1" tab="网易云">
         <wyyMusic />
       </a-tab-pane>
       <a-tab-pane key="2" tab="抖音">
-          
+        <dyMusic v-if="active == '2'" />
       </a-tab-pane>
     </a-tabs>
   </div>
@@ -81,17 +81,19 @@
 
 <script>
 import wyyMusic from './musicMaterial.vue'
+import dyMusic from './musicBytedance.vue'
+import { mapActions } from 'vuex'
 export default {
   name: 'music-tab',
   components: {
-   wyyMusic
+    wyyMusic,
+    dyMusic,
   },
   data() {
     return {
+      active: '1',
       loading: true,
       center: null,
-      rankList,
-      barData,
       loginfo: {},
       visitFields: ['ip', 'visit'],
       visitInfo: [],
@@ -102,15 +104,18 @@ export default {
       versionId: 0, //存储版本号 判断通知什么时候显示
     }
   },
-  created() {
-
-  },
+  created() {},
   methods: {
-   
-  },
-  mounted() {
+    ...mapActions(['clearPlayList']),
+    callBack() {
+      if(this.active=='1'){
 
+      }else{
+        this.clearPlayList()
+      }
+    },
   },
+  mounted() {},
 }
 </script>
 

+ 5 - 16
src/views/modules/material/scriptFile.vue

@@ -19,7 +19,6 @@
           </a-col>
           <a-col :md="6" :sm="8">
             <a-form-item label="创建人">
-              <!-- <a-input placeholder="请输入创建人" v-model="queryParam.creator_dictText"></a-input> -->
               <a-select
                 v-model="queryParam.creator"
                 showSearch
@@ -57,7 +56,7 @@
       </a-form>
     </div>
     <div style="float:right;margin:0 0 20px 20px">
-      <a-upload
+      <!-- <a-upload
         name="file"
         :multiple="false"
         :action="uploadAction"
@@ -71,7 +70,7 @@
           <a-icon type="upload" />
           {{loadingElse?'上传中,请稍后':'文件上传'}}
         </a-button>
-      </a-upload>
+      </a-upload> -->
       <a-dropdown placement="bottomRight">
         <a-button>新增</a-button>
         <a-menu slot="overlay">
@@ -87,16 +86,6 @@
             <a-icon type="file-ppt" />
             <span style="text-align: center" @click="creatWps('ppt')">演示文档</span>
           </a-menu-item>
-
-          <!-- <a-menu-item>
-            <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">1st menu item</a>
-          </a-menu-item>
-          <a-menu-item>
-            <a target="_blank" rel="noopener noreferrer" href="http://www.taobao.com/">2nd menu item</a>
-          </a-menu-item>
-          <a-menu-item>
-            <a target="_blank" rel="noopener noreferrer" href="http://www.tmall.com/">3rd menu item</a>
-          </a-menu-item>-->
         </a-menu>
       </a-dropdown>
     </div>
@@ -122,14 +111,14 @@
           <a @click="bindProject(record)">项目绑定</a>
           <a-divider type="vertical" />
           <a @click="downLoad(record)">下载</a>
-          <a-divider type="vertical" />
+          <a-divider type="vertical" /> 
           <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
             <a>删除</a>
           </a-popconfirm>
         </span>
       </a-table>
     </div>
-    <!-- <div id="show"></div> -->
+    <div id="show"></div>
     <a-modal
       :maskClosable="false"
       :title="type=='add'?'脚本新建':'脚本编辑'"
@@ -219,7 +208,7 @@ export default {
       uploadAction: 'http://api.tjyourong.com.cn/jeecg-boot/ctop/wpsFile/uploadFile',
       columns: [
         {
-          title: '脚本名称',
+          title: '文件名称',
           align: 'center',
           dataIndex: 'name',
         },

+ 6 - 3
src/views/modules/material/videoMaterial.vue

@@ -3006,7 +3006,8 @@ export default {
               item.roleCode == 'plan' ||
               item.roleCode == 'designTeamLeader' ||
               item.roleCode == 'shot' ||
-              item.roleCode == 'plane'
+              item.roleCode == 'plane'||
+              item.roleCode == 'planeLeader'
             ) {
               return {
                 userId: item.userId,
@@ -3020,7 +3021,8 @@ export default {
               item.roleCode == 'shot' ||
               item.roleCode == 'plan' ||
               item.roleCode == 'designTeamLeader' ||
-              item.roleCode == 'plane'
+              item.roleCode == 'plane'||
+              item.roleCode == 'planeLeader'
             ) {
               return {
                 userId: item.userId,
@@ -3034,7 +3036,8 @@ export default {
               item.roleCode == 'plan' ||
               item.roleCode == 'designTeamLeader' ||
               item.roleCode == 'clip' ||
-              item.roleCode == 'plane'
+              item.roleCode == 'plane'||
+              item.roleCode == 'planeLeader'
             ) {
               return {
                 userId: item.userId,

File diff suppressed because it is too large
+ 639 - 503
src/views/modules/onlineTraining/onlineTrainingList.vue


+ 1 - 1
src/views/modules/prop/modules/ActorModal.vue

@@ -10,7 +10,7 @@
         </a-form-item>
         <a-form-item label="照片" :labelCol="labelCol" :wrapperCol="wrapperCol">
           <uploadFile  v-if="visible" :value.sync="imageUrl" :fileCount="10"
-            uploadType="image" />
+            uploadType="image"  :sizeCheck="false"/>
           <!-- <upload-to-ali v-model="imageUrl" :customDomain="customDomain" multiple preview :region="region"
             :bucket="bucket" :accept="acceptImage" :max="10" :size="1024000" :accessKeyId="accessKeyId"
             :accessKeySecret="accessKeySecret"></upload-to-ali> -->

+ 1 - 0
src/views/modules/prop/modules/vm-image-list.vue

@@ -81,6 +81,7 @@
           :record="item"
           @delete-ok="deleteOk(item)"
           @updateList="updateList"
+          
         ></vm-card>
       </a-col>
     </a-row>

+ 19 - 6
src/views/modules/prop/prop.vue

@@ -4,9 +4,10 @@
 </template>
 
 <script>
-  import VmImageList from './modules/vm-image-list'
+  import VmImageList from '@/components/ctop/vm-image-list'
   import {
-    propList
+    propList,
+    propListDelete
   } from '@/api/actor'
   export default {
     name: 'ImageList',
@@ -20,11 +21,23 @@
     },
     methods: {
       deletefn: function (data) {
-        for (let i = 0; i < this.dataImageList.length; i++) {
-          if (this.dataImageList[i].id === data.id) {
-            this.dataImageList.splice(i, 1)
+        console.log('最外层deleteFn执行',data)
+        propListDelete({
+          id:data.id
+        }).then(res=>{
+          if(res.success){
+            this.$message.success('删除成功')
+            // for (let i = 0; i < this.dataImageList.length; i++) {
+            //   if (this.dataImageList[i].id === data.id) {
+            //     this.dataImageList.splice(i, 1)
+            //   }
+            // }
+            this.getActorList(data.page)
+          }else{
+            this.$message.error('删除失败,稍后再试')
           }
-        }
+          
+        })
       },
       getActorList(page, name) {
         this.dataImageList = []

+ 33 - 0
src/views/modules/workBench/designLeader/index.vue

@@ -0,0 +1,33 @@
+<template>
+    <keep-alive>
+        <component v-bind:is="currentTabComponent"></component>
+    </keep-alive>
+    
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+
+export default {
+    components:{
+        designleaderPlatform: () => import('./platForm'),
+        orderList: () => import('../orderList'), 
+        orderDetail: () => import('../orderDetail'), 
+        materialList: () => import('../materialList'), 
+
+    },
+
+    data() {
+        return {
+            currentTabComponent:'designleaderPlatform',
+            orderStatus:undefined,//跳转到订单详情时需要里面的参数  status订单参数 role 当前角色
+            role:'designLeader',
+            materialStatus:undefined,
+            orderId:undefined,
+        }
+    },
+   
+}
+
+</script>

+ 518 - 0
src/views/modules/workBench/designLeader/platForm.vue

@@ -0,0 +1,518 @@
+<template>
+    <div class="workBench">
+        <div class="topBody">
+            <p class="breadcrumb">工作台</p>
+            <div class="bottom">
+                <div class="touxiang">
+                    <img src="@/assets/touxiang.png"  alt="">
+                </div>  
+                <div class='tip'>
+                    <p class="greet">早安,{{userInfo.username}},祝你开心每一天!</p>
+                    <p class="descPosition">
+                        <span>运营经理</span>
+                        <a-divider type="vertical" />
+                        <span>华北地区-头条事业部</span>
+                    </p>
+                </div>
+            </div>
+        </div>
+        <div class="section">
+            <div class="sectionBody">
+                <div class="sectionLeftBox">
+                    <div class="leftTop">
+                        <div class="sectionHead">
+                            我的工作内容
+                        </div>
+                        <div class="zhanshiBox">
+                            <div class="item" @click="goOrderList(1)">                                
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>待确定的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                               
+                            </div>
+                            <div class="item" @click="goOrderList(2)">                               
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>待指派的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                               
+                            </div>
+                            
+                            <div class="item" @click="goMaterialList(1)">                                
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>我参与的物料</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                               
+                            </div>
+                            
+                            <div class="item" @click="goMaterialList(2)">                                
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>被驳回的物料</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                                
+                            </div>
+                            <div class="item" @click="goOrderList(3)">                               
+                                <div class="title">                                   
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>已完成的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                              
+                            </div>
+                           
+                            <div class="item" @click="goOrderList(4)">                               
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>全部订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                               
+                            </div>
+                            
+                            
+                        </div>  
+                    </div>
+                    <div class="leftBottom">
+                        <div class="sectionHead">
+                            订单进度
+                             <a-button type="link" class="allOrder" @click="goOrderList(4)">全部订单</a-button>
+                        </div>
+                        <div class="orderProgress">
+                            <ul class="orderProgress-list">
+                                <li v-for="(item,index) in orderProgressList" :key="index"  >
+                                    
+                                    <div style="display:flex;align-items: center;" class="orderProgress-list-item" @click="orderDetail(item)">
+                                        <div style="display:flex;width:80%; align-items: center;" >
+                                            <span class="item-icon"></span>
+                                            <div class="content">
+                                                <p class="name">我是一个任务名称嗷嗷嗷啊</p>
+                                                <p class="desc">这是对这个任务的简介,所以得好好寻…</p>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="progress">
+                                            <a-progress type="circle" :percent="75" :width='30' :showInfo='false'  :strokeWidth='10' />
+                                            <span style="margin-left:15px">75%</span>
+                                        </div>
+                                    </div>
+                                    
+                                </li>
+                            </ul>
+                            <!-- hideOnSinglePage -->
+                            <a-pagination size="small" :total="totalPage" :current='currentPage' class="fenye" :change='pageChange'  show-size-changer show-quick-jumper hideOnSinglePage />
+                        </div>
+                    </div>
+                </div>
+                <div class="sectionRightBox">
+                    <div class="rightTop">
+                        <div class="sectionHead">
+                            操作记录
+                        </div>
+                        <div class="optionRecordList">
+                            <a-timeline>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                
+                            </a-timeline>
+                        </div>
+                    </div>
+                    <div class="rightBottom">
+                        <div class="sectionHead">
+                            本周项目燃尽图
+                        </div>
+                        <div class="burnDown">
+                             <a-progress type="circle" :percent="75"  :width='150' :strokeWidth='6' />
+                             <div class="tip">
+                                <p class="done">
+                                    <span class="item-icon"></span>
+                                    <span>已完成订单:{{}}个</span>
+                                </p>
+                                <p class="all">
+                                    <span class="item-icon"></span>
+                                    <span>未完成订单:{{}}个</span>
+                                </p>
+                             </div>
+                        </div>
+                    </div>
+                </div>
+                
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+
+export default {
+    name:'designlearder-platform',
+    data() {
+        return {
+            touxiang:'@/assets/touxiang.png',
+            // 订单进度
+            orderProgressList:[
+                {},
+                {},
+                {}
+            ],
+
+            // 操作记录
+            optionRecord:[],
+
+            // 本周项目燃尽图
+            burnDownChart:[],
+
+            // 分页参数
+            totalPage:0,
+            currentPage:1,
+            userInfo:{},
+            roleCode:''
+        }
+    },
+    methods: {
+        orderDetail(item){
+            console.log(item)
+            this.$parent.currentTabComponent='orderDetail';
+            this.$parent.orderId=item.id
+        },
+        goOrderList(val){
+            console.log(val);
+            // console.log(this.$parent)
+            this.$parent.currentTabComponent='orderList';
+            this.$parent.orderStatus=val
+            
+        },
+        goMaterialList(val){
+            this.$parent.currentTabComponent='materialList';
+            this.$parent.materialStatus=val
+        },
+        // 分页页码改变
+        pageChange(page, pageSize){
+
+        },
+        // 全部订单
+        allOrder() {
+            this.$router.push('/workBench/orderList')
+        },
+        
+    },
+    mounted(){
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        
+        
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.workBench{
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+    width: 100%;
+    .topBody{
+        width: 100%;
+        height: 146px;
+        background: #FFFFFF;
+        margin-bottom: 12px;
+        padding: 20px;
+        box-sizing: border-box;
+        .breadcrumb{
+            width: 42px;
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .bottom{
+            display: flex;
+            position: relative;
+            // padding: 20px;
+            .touxiang{
+                width: 72px;
+                height: 72px;
+                margin-right: 20px;
+                border-radius: 50%;
+                overflow: hidden;
+                img{
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 50%;
+                }
+            }
+            .tip{
+                .greet{
+                    height: 28px;
+                    font-size: 20px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 28px;
+                }
+                .descPosition{
+                    height: 22px;
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.45);
+                    line-height: 22px;
+                }
+
+            }
+            .mybtn{
+                position: absolute;
+                // top: 50%;
+                // margin-left: -18px;
+                right: 0;
+            }
+        }
+
+    }
+    .section{
+        .sectionBody{
+            display: flex;
+            .sectionHead{
+                padding: 15px 20px;
+                // height: 24px;
+                font-size: 16px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: rgba(0, 0, 0, 0.85);
+                line-height: 24px;
+                border-bottom: 1px solid  #E9E9E9;;
+                position: relative;
+                .allOrder{
+                    position: absolute;
+                    right: 5px;
+                }
+            }
+            .sectionLeftBox{
+                width: 70%;
+               
+                .leftTop{
+                    overflow: hidden;
+                    background: white;
+                }
+                .zhanshiBox{
+                    display: flex;
+                    flex-wrap: wrap;
+                    .item{
+                        width: 33.33%;
+                        // background: brown;
+                        padding: 20px ;
+                        border-right: 1px solid #E9E9E9;
+                        border-bottom: 1px solid #E9E9E9;
+                        .title{
+                            padding-bottom: 34px;
+                            color: #000000;
+                            .iconImg{
+                                width: 24px;
+                                margin-right: 8px;
+                            }
+                        }
+                        .itemBody{
+                            text-align: center;
+                            .count{
+                                
+                                font-size: 24px;
+                                font-family: PingFangSC-Medium, PingFang SC;
+                                font-weight: 500;
+                                color: #000000;
+                                line-height: 32px;
+                                cursor: pointer;
+                                span{
+                                    font-size: 16px;
+                                    cursor: pointer;
+                                }
+                            }
+                            .count:hover{                                
+                                color: #1890FF;
+                            }
+                        }
+                    }
+                    .item:nth-child(3n){
+                        border-right: 0;
+                    }
+                }
+                .leftBottom{
+                    margin-top: 12px;
+                    background: white;
+                    .orderProgress{
+                        padding: 0 20px;
+                        .orderProgress-list-item{
+                            padding: 10px 0;
+                            display: flex;
+                            align-items: center;
+                            border-bottom: 1px solid  #E9E9E9;;
+                            justify-content:space-between;
+                            cursor: pointer;
+                            .item-icon{
+                                width: 8px;
+                                height: 8px;
+                                background: #3BA0FF;
+                                margin-right: 15px;
+                                display: inline-block;
+                                border-radius: 50%;
+                            }
+                            .content{
+                                width: 70%;
+                                overflow: hidden;
+                                font-size: 14px;
+                                font-family: PingFangSC-Regular, PingFang SC;
+                                font-weight: 400;
+                                .name{
+                                    height: 22px;                                    
+                                    color: rgba(0, 0, 0, 0.65);
+                                    line-height: 22px;
+                                    text-overflow: ellipsis;
+                                    white-space: nowrap;
+                                    overflow: hidden;
+                                    margin-bottom: 0px;
+                                }
+                                .desc{
+                                    height: 22px;
+                                    color: rgba(0, 0, 0, 0.25);
+                                    line-height: 22px;
+                                    text-overflow: ellipsis;
+                                    white-space: nowrap;
+                                    overflow: hidden;
+                                     margin-bottom: 0px;
+                                }
+                            }
+                            .progress{
+                                float: right;
+                            }
+                        }
+                        .fenye{
+                            padding: 20px 0;
+                            text-align: right;
+                        }
+                    }
+                }
+            }
+            .sectionRightBox{
+                width: 29.5%;
+                // background: white;
+                margin-left: 12px;
+                .rightTop{
+                    height: 370px;
+                     background: white;
+                     .optionRecordList{
+                         padding: 20px;
+                         p{
+                             width: 100%;
+                         }
+                        .content-item{
+                            width: 80%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                        .time{
+                            width: 20%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                     }
+                }
+                .rightBottom{
+                    margin-top: 12px;
+                     background: white;
+                    .burnDown{
+                         padding: 30px 20px;
+                         text-align: center;
+                         .tip{
+                            margin-top: 40px;
+                            display: flex;
+                            justify-content: space-around;
+                             
+                            height: 22px;
+                            font-size: 14px;
+                            font-family: PingFangSC-Regular, PingFang SC;
+                            font-weight: 400;
+                            color: rgba(0, 0, 0, 0.65);
+                            line-height: 22px;
+                             .done{
+                                .item-icon{
+                                     width: 8px;
+                                    height: 8px;
+                                    background: #3BA0FF;
+                                    margin-right: 15px;
+                                    display: inline-block;
+                                    border-radius: 50%;
+                                }
+                             }
+                             .all{
+                                .item-icon{
+                                    width: 8px;
+                                    height: 8px;
+                                    background: #F0F2F5;
+                                    margin-right: 15px;
+                                    display: inline-block;
+                                    border-radius: 50%;
+                                } 
+                             }
+                         }
+                    }
+
+                }
+            }
+        }
+    }
+}
+</style>
+
+<style lang="less">
+    .workBench{
+        .ant-timeline-item-head{
+            background: rgb(240,242,245);
+        }
+    }
+</style>

+ 32 - 0
src/views/modules/workBench/designPeople/index.vue

@@ -0,0 +1,32 @@
+<template>
+    <keep-alive>
+        <component v-bind:is="currentTabComponent"></component>
+    </keep-alive>
+    
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+
+export default {
+    components:{
+        designrPlatform: () => import('./platForm'), 
+        orderList: () => import('../orderList'), 
+        orderDetail: () => import('../orderDetail'), 
+        materialList: () => import('../materialList'), 
+    },
+
+    data() {
+        return {
+            currentTabComponent:'designrPlatform',
+            orderStatus:undefined,//跳转到订单详情时需要里面的参数  status订单参数 role 当前角色
+            role:'design',
+            materialStatus:undefined,
+            orderId:undefined,
+        }
+    },
+   
+}
+
+</script>

+ 84 - 53
src/views/modules/workBench/index.vue

@@ -4,20 +4,16 @@
             <p class="breadcrumb">工作台</p>
             <div class="bottom">
                 <div class="touxiang">
-                    <img src="" alt="">
+                    <img src="@/assets/touxiang.png"  alt="">
                 </div>  
                 <div class='tip'>
-                    <p class="greet">早安,吴永前,祝你开心每一天!</p>
+                    <p class="greet">早安,{{userInfo.username}},祝你开心每一天!</p>
                     <p class="descPosition">
                         <span>运营经理</span>
                         <a-divider type="vertical" />
                         <span>华北地区-头条事业部</span>
                     </p>
                 </div>
-                <a-button type='primary' class="mybtn" @click="sendOrder">
-                    <a-icon type="plus" />
-                    发起订单
-                </a-button>
             </div>
         </div>
         <div class="section">
@@ -28,59 +24,43 @@
                             我的工作内容
                         </div>
                         <div class="zhanshiBox">
-                            <div class="item">
+                            <div class="item" @click="goMaterialList(1)">
                                 <div class="title">
                                     <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
-                                </div>
-                                <div class="itemBody">
-                                    <p class="count">60 <span>个</span></p>
-                                </div>
-                            </div>
-                            <div class="item">
-                                <div class="title">
-                                    <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
+                                    <span>指派给我的物料</span>
                                 </div>
                                 <div class="itemBody">
                                     <p class="count">60 <span>个</span></p>
                                 </div>
+                                
                             </div>
-                            <div class="item">
+                            <div class="item" @click="goMaterialList(2)">                               
                                 <div class="title">
                                     <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
+                                    <span>被驳回的物料</span>
                                 </div>
                                 <div class="itemBody">
                                     <p class="count">60 <span>个</span></p>
-                                </div>
+                                </div>                                
                             </div>
-                            <div class="item">
+                            
+                            <div class="item" @click="goMaterialList(3)">                                
                                 <div class="title">
                                     <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
+                                    <span>已完成的物料</span>
                                 </div>
                                 <div class="itemBody">
                                     <p class="count">60 <span>个</span></p>
-                                </div>
+                                </div>                              
                             </div>
-                            <div class="item">
+                            <div class="item" @click="goMaterialList(4)">                                
                                 <div class="title">
                                     <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
-                                </div>
-                                <div class="itemBody">
-                                    <p class="count">60 <span>个</span></p>
-                                </div>
-                            </div>
-                            <div class="item">
-                                <div class="title">
-                                    <img src="@/assets/work.png" alt="" class="iconImg">
-                                    <span>我发起的</span>
+                                    <span>全部物料</span>
                                 </div>
                                 <div class="itemBody">
                                     <p class="count" >60 <span>个</span></p>
-                                </div>
+                                </div>                                
                             </div>
                         </div>  
                     </div>
@@ -124,26 +104,26 @@
                             <a-timeline>
                                 <a-timeline-item color='#F0F2F5' style="height:30px">
                                    <p style="margin-bottom:0px">
-                                       Create a services site 2015-09-01
-                                    <span style="float:right">1分钟前</span>
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
                                    </p>
                                 </a-timeline-item>
                                 <a-timeline-item color='#F0F2F5' style="height:30px">
                                    <p style="margin-bottom:0px">
-                                       Create a services site 2015-09-01
-                                    <span style="float:right">1分钟前</span>
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
                                    </p>
                                 </a-timeline-item>
                                 <a-timeline-item color='#F0F2F5' style="height:30px">
                                    <p style="margin-bottom:0px">
-                                       Create a services site 2015-09-01
-                                    <span style="float:right">1分钟前</span>
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
                                    </p>
                                 </a-timeline-item>
                                 <a-timeline-item color='#F0F2F5' style="height:30px">
                                    <p style="margin-bottom:0px">
-                                       Create a services site 2015-09-01
-                                    <span style="float:right">1分钟前</span>
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
                                    </p>
                                 </a-timeline-item>
                                 
@@ -180,8 +160,10 @@ import moment from 'moment';
 import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
 
 export default {
+    name:'design-platform',
     data() {
         return {
+            touxiang:'@/assets/touxiang.png',
             // 订单进度
             orderProgressList:[
                 {},
@@ -198,24 +180,46 @@ export default {
             // 分页参数
             totalPage:0,
             currentPage:1,
-
+            userInfo:{},
+            roleCode:''
         }
     },
     methods: {
+         goOrderList(val){
+            console.log(val);
+            // console.log(this.$parent)
+            this.$parent.currentTabComponent='orderList';
+            this.$parent.orderStatus=val
+            
+        },
+        goMaterialList(val){
+            this.$parent.currentTabComponent='materialList';
+            this.$parent.materialStatus=val
+        },
         // 分页页码改变
         pageChange(page, pageSize){
 
         },
         // 全部订单
         allOrder() {
-            
+            this.$router.push('/workBench/orderList')
         },
         // 发起订单
         sendOrder(){
             this.$router.push('/workBench/placeOrder')
         },
     },
+    mounted(){
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        
+        
+    }
 }
+
 </script>
 
 <style lang="scss" scoped>
@@ -229,7 +233,7 @@ export default {
         width: 100%;
         height: 146px;
         background: #FFFFFF;
-        margin-bottom: 24px;
+        margin-bottom: 12px;
         padding: 20px;
         box-sizing: border-box;
         .breadcrumb{
@@ -248,10 +252,17 @@ export default {
             .touxiang{
                 width: 72px;
                 height: 72px;
+                margin-right: 20px;
+                border-radius: 50%;
+                overflow: hidden;
+                img{
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 50%;
+                }
             }
             .tip{
                 .greet{
-                    width: 300px;
                     height: 28px;
                     font-size: 20px;
                     font-family: PingFangSC-Medium, PingFang SC;
@@ -290,15 +301,17 @@ export default {
                 color: rgba(0, 0, 0, 0.85);
                 line-height: 24px;
                 border-bottom: 1px solid  #E9E9E9;;
+                position: relative;
                 .allOrder{
-                    float: right;
+                    position: absolute;
+                    right: 5px;
                 }
             }
             .sectionLeftBox{
                 width: 70%;
                
                 .leftTop{
-                    height: 370px;
+                    overflow: hidden;
                     background: white;
                 }
                 .zhanshiBox{
@@ -312,6 +325,7 @@ export default {
                         border-bottom: 1px solid #E9E9E9;
                         .title{
                             padding-bottom: 34px;
+                            color: #000000;
                             .iconImg{
                                 width: 24px;
                                 margin-right: 8px;
@@ -342,7 +356,7 @@ export default {
                     }
                 }
                 .leftBottom{
-                    margin-top: 20px;
+                    margin-top: 12px;
                     background: white;
                     .orderProgress{
                         padding: 0 20px;
@@ -398,18 +412,35 @@ export default {
                 }
             }
             .sectionRightBox{
-                width: 29%;
+                width: 29.5%;
                 // background: white;
-                margin-left: 20px;
+                margin-left: 12px;
                 .rightTop{
                     height: 370px;
                      background: white;
                      .optionRecordList{
                          padding: 20px;
+                         p{
+                             width: 100%;
+                         }
+                        .content-item{
+                            width: 80%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                        .time{
+                            width: 20%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
                      }
                 }
                 .rightBottom{
-                    margin-top: 20px;
+                    margin-top: 12px;
                      background: white;
                     .burnDown{
                          padding: 30px 20px;

+ 773 - 0
src/views/modules/workBench/materialList.vue

@@ -0,0 +1,773 @@
+
+<style lang="scss" scoped>
+.orderDetail{
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+   
+    width: 100%;
+    .topBody{
+        width: 100%;
+        background: #FFFFFF;
+        margin-bottom: 12px;
+        padding: 20px;
+        box-sizing: border-box;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .bottom{
+            display: flex;
+            position: relative;
+            justify-content: space-between;
+            // padding: 20px;
+            .orderIcon{
+                width: 28px;
+                height: 28px;
+                margin-right: 15px;
+                img{
+                    width: 100%;
+                }
+            }
+            .tip{
+                .greet{
+                    width: 300px;
+                    height: 28px;
+                    font-size: 20px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 28px;
+                    margin-bottom: 5px;
+                }
+                .descPosition{
+                    
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.45);
+                    overflow: hidden;
+                    margin-bottom: 0;
+                    li{
+                        height: 22px;
+                        line-height: 22px;
+                        margin-top:3px ;
+                    }
+                    span{
+                        width: 250px;
+                        display: inline-block;
+                    }
+                }
+
+            }
+            .optBody{
+                width: 200px;
+                flex-shrink:0;
+                // justify-content: flex-end;
+                text-align: right;
+                .btnBody{
+                    margin-bottom: 10px;
+                }
+                .orderInfo{
+                    display: flex;
+                    justify-content: space-between;
+                    text-align: right;
+                    p{
+                        margin-bottom: 0;
+                    }
+                    
+                    .markName{                        
+                        height: 22px;
+                        font-size: 14px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.45);
+                        line-height: 22px;
+                    }
+                    .big{                                               
+                        height: 28px;
+                        font-size: 20px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.85);
+                        line-height: 28px;
+                    }
+                }
+
+            }
+        }
+
+    }
+    .section{
+        background: white;
+        padding:20px ;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .sectionBody{
+            
+            p{
+                margin-bottom: 0;
+            }
+            .section-item{
+                background: white;
+                margin-bottom: 20px;
+            }
+            .tabBox{
+                padding: 15px 20px 0;
+                display: flex;
+                flex-wrap: wrap;
+                position: relative;
+                .search-item{
+                    margin-bottom: 12px;
+                    width: 30%;
+                }
+                .opt-item{
+                    position: absolute;
+                    right: 20px;
+                    top: 16px;
+                }
+            }
+            .sectionHead{
+                padding: 15px 20px;
+                // height: 24px;
+                font-size: 16px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: rgba(0, 0, 0, 0.85);
+                line-height: 24px;
+                border-bottom: 1px solid  #E9E9E9;;
+                .allOrder{
+                    float: right;
+                }
+            }
+            .section-box{
+                margin-top: 30px;
+                padding: 20px 20px;
+                border: 1px solid #E9E9E9;
+                .description{
+                    margin-top: 10px;
+                    .time{
+                        height: 32px;
+                        line-height: 32px;
+                    }
+                }
+                ul{
+                    display: flex;
+                    flex-wrap: wrap;
+                    // justify-content: space-around;
+                }
+                li{
+                    
+                    width: 30%;
+                    height: 22px;
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 22px;
+                    text-align: left;
+                    margin-bottom: 15px;
+                }
+                .top{
+                    margin-bottom: 25px;
+                }
+                .bottom{
+                    h4{
+                        
+                        font-size: 15px;
+                        font-family: PingFangSC-Medium, PingFang SC;
+                        font-weight: 600;
+                        color: rgba(0, 0, 0, 0.85);
+                        margin-bottom: 25px;
+                    }
+                }
+                .shenhe{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #52C41A;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+
+                }
+                .wancheng{
+                    width: 6px;
+                    height: 6px;
+                     display: inline-block;
+                    background: #1890FF;
+                    border-radius: 50%;
+                    // margin-right: 3px;
+                    position: relative;
+                    top: -2px;
+                }
+                .bohui{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #F5222D;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+                }
+            }
+            
+        }
+    }
+}
+.videoBox{
+    width: 320px;
+    height: 180px;
+}
+.imgBox{
+    width: 100%;
+    height: 180px;
+}
+.marterialInfo{
+    
+    p{margin-bottom: 0;}
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+    .info-item{
+        margin-bottom: 20px;
+        display: flex;
+        // justify-content: center;
+        align-items: center;
+        span{
+            display: inline-block;
+            width: 70px;
+            text-align: left;
+        }
+        .ant-tag{
+            width: auto;
+            min-width: 50px;
+            text-align: center;
+        }
+    }
+    .info{
+        ul{
+            display: flex;
+            justify-content: space-between;
+            flex-wrap: wrap;
+        }
+        li{
+            width: 33.3%;
+            margin-bottom: 20px;
+        }
+        margin-bottom: 0;
+    }
+    .bottom-btn{
+        width: 100%;
+        text-align: center;
+        position: absolute;
+        bottom: 20px;
+        left: 0;
+
+    }
+}
+</style>
+
+<style lang="less">
+    .orderDetail{
+        .ant-timeline-item-head{
+            background: rgb(240,242,245);
+        }
+        .muen{
+            cursor: pointer;
+        }
+        .muen:hover{
+            color: #1890ff;
+        }
+    }
+    
+    
+</style>
+<template>
+    <div class="orderDetail ">
+        
+        <div class="section">
+             <p class="breadcrumb">
+                <a-breadcrumb style="display:block;width:100%">
+                    <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
+                    <a-breadcrumb-item>订单列表</a-breadcrumb-item>
+                    <a-breadcrumb-item>物料列表</a-breadcrumb-item>
+                </a-breadcrumb>
+            </p>
+            <div class="sectionBody">
+                <div class="tabBody">
+                    <a-tabs v-model="activeKey" @change='tabChange'>
+                        <a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title"  >
+                            <!-- {{ pane.content }}{{pane.role+'-'+roleCode}} -->
+                        </a-tab-pane>
+                    </a-tabs>
+                </div>
+                <!-- 素材列表 -->
+                <div class="section-item">
+                    <div class="tabBox">
+                        
+                        <div class="search-item">
+                            <span>订单名称:</span>
+                            <a-input placeholder="请输入订单名称" allow-clear v-model="orderName" style="width:300px" />
+                        </div>
+                        <div class="search-item">
+                            <span>订单编号:</span>
+                            <a-input placeholder="请输入订单编号" allow-clear v-model="orderId" style="width:300px" />
+                        </div>
+                        
+
+                        <div class="search-item">
+                            <span>发起的人:</span>
+                            <a-input placeholder="请输入订单发起人" allow-clear v-model="orderSponsor" style="width:300px" />
+                        </div>
+                        <div class="opt-item">
+                            <a-button type='primary' @click="search" style="margin-right:20px">查询</a-button>
+                            <a-button type='default' @click="reset">查询</a-button>
+                        </div>
+                    </div>
+                        
+                    
+                    <div class="section-box">
+                         <a-table
+                            size="middle"
+                            :columns="columns"
+                            :dataSource="data"
+                            id="outTable"
+                            :pagination="ipagination"
+                            :loading="loading"
+                            @change="sort"
+                            style="word-break: break-all;"
+                            >
+                            <div slot="orderStatus" slot-scope="text" >
+                                <span class="wancheng" v-if="text==3"> </span>
+                                <span class="bohui" v-else-if="text==2||text==-1"> </span>
+                                <span class="shenhe" v-else> </span>
+                                {{text | handleMaterialStatus}}
+                            </div>
+                            <span slot="options" slot-scope="text,record">
+                                <a href="javascript:;" @click="viewDetails(record)">详情</a>
+                            </span>
+
+                        </a-table>
+                    </div>
+                    <a-drawer
+                    title="素材详情"
+                    width="640"
+                    :placement="placement"
+                    :closable="false"
+                    :visible="visible"
+                    @close="onClose"
+                    >
+                        <div class="videoBody">
+                            <div class="videoBox">
+                                <video :src="currentMaterial.src" ></video>
+                            </div>
+                            
+                            <div class="imgBox">
+                                <img src="" alt="">
+                                <img src="" alt="">
+                            </div>
+                        </div>
+                        <div class="marterialInfo">
+                            <div class="info-item">
+                                <span>素材状态:</span>
+                                <p>未审核</p>
+                            </div>
+                            <div class="info-item">
+                                <span>生成水印:</span>
+                                <a-select :defaultValue="4" v-model="size" style="width:70%;">
+                                    <a-select-option :value="item.id" :key="item.id" v-for="item of sizeType">{{
+                                        item.name
+                                    }}</a-select-option>
+                                </a-select>
+                                
+                            </div>
+                            <div class="info-item">
+                                <span>视频标签:</span>
+                                <a-tag>Tag 1</a-tag>
+                                <a-tag>Tag 1</a-tag>
+                            </div>
+                            <div class="info-item info">
+                                <ul>
+                                    <li><span>视频时长:</span> 17秒 </li>
+                                    <li><span>视频尺寸:</span> 1080*1920 </li>
+                                    <li><span>视频大小:</span> 31.42M </li>
+                                    <li><span>策划:</span> 吴永前 </li>
+                                    <li><span>拍摄:</span> 吴永前 </li>
+                                    <li><span>剪辑:</span> 吴永前 </li>                                    
+                                </ul>
+                            </div>
+                            <div class="info-item">
+                                <span>广告语:</span>
+                                <p>14354534324454354水电费水电费方式手动</p>
+                            </div>
+                            <div class="bottom-btn">
+                                <a-button type='primary' @click="approved" style="margin-right:20px">通过审核</a-button>
+                                <a-button type='default' @click="reject">驳回</a-button>
+                            </div>
+                        </div>
+                    </a-drawer>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+import qs from 'qs'
+
+let listColumns=[
+    {
+        title: '订单名称',
+        dataIndex: 'orderTitle',
+        align: 'center',        
+        key: 'orderTitle',
+        scopedSlots: { customRender: 'orderTitle' }
+    },
+    {
+        title: '订单编号',
+        dataIndex: 'id',
+        align: 'center',        
+        key: 'tag',
+        scopedSlots: { customRender: 'id' }
+    },
+    {
+        title: '订单发起人',
+        dataIndex: 'status',
+        align: 'center',        
+        key: 'status',
+        scopedSlots: { customRender: 'status' }
+    },
+    {
+        title: '订单状态',
+        dataIndex: 'orderStatus',
+        align: 'center',        
+        key: 'orderStatus',
+        scopedSlots: { customRender: 'orderStatus' }
+    },
+    {
+        title: '更新时间',
+        dataIndex: 'materialFinishTime',
+        align: 'center',        
+        key: 'materialFinishTime',
+        scopedSlots: { customRender: 'materialFinishTime' }
+    },
+    {
+        title: '操作',
+        dataIndex: 'options',
+        align: 'center',        
+        key: 'options',
+        width:250,
+        scopedSlots: { customRender: 'options' }
+    },
+]
+
+
+export default {
+    name:'order-list',
+    data() {
+        const operatorPanes = [           
+            { title: '待审核的', content: '', key: 1 , },           
+            { title: '已完成的', content: '', key: 2 ,},
+        ];
+        const designLeaderPanes=[           
+            { title: '我参与的', content: '', key: 1 , },
+            { title: '被驳回的', content: '', key: 2 , },
+            { title: '已完成的', content: '', key: 3 ,},
+            { title: '全部物料', content: '', key: 3 ,},
+            
+        ]
+        const designPanes=[           
+            { title: '指派给我', content: '', key: 1 , },
+            { title: '被驳回的', content: '', key: 2 , },
+            { title: '已完成的', content: '', key: 3 ,},
+            { title: '全部物料', content: '', key: 3 ,},
+            
+        ]
+        return {
+            operatorPanes,
+            designLeaderPanes,
+            designPanes,
+            userInfo:{},
+            roleCode:'',
+
+            panes:[],
+            activeKey: '4',
+            orderInfo:{ },
+
+            columns:[...listColumns],
+            data:[],
+            loading:false,
+            ipagination: {
+                current: 1,
+                pageSize: 10,
+                //   pageSizeOptions: ['10', '20', '30'],
+                showTotal: (total, range) => {
+                    return range[0] + "-" + range[1] + " 共" + total + "条"
+                },
+                showQuickJumper: true,
+                showSizeChanger:true,
+                pageSizeOptions: ['10', '30', '50'],
+                total: 0,
+                onChange: (current, pageSize) => {
+                    // 切换分页时的回调,
+                    // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+                    this.ipagination.current = current;
+                    this.ipagination.pageSize= pageSize;
+                }
+            },
+            // 订单进度
+            orderName:'',
+            orderId:'',
+            orderStatus:'',
+            orderParticipants:"",
+            orderSponsor:'',
+
+            visible: false,
+            placement: 'right',
+            currentMaterial:{},
+
+
+            sizeType:[],
+            size: "4",
+        }
+    },
+    methods: {
+        goPlantForm(){
+            if(this.$parent.role=='operator'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }else if(this.$parent.role=='designLeader'){
+                this.$parent.currentTabComponent='designleaderPlatform'
+            }else if(this.$parent.role=='design'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }
+        },
+        tabChange(key){
+            console.log(key)
+            this.tableHttp(key)
+        },
+        handleChange(value) {
+            console.log(`selected ${value}`);
+        },
+        
+        filterOption(input, option) {
+            return (
+                option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            );
+        },
+
+        // 查看详情
+        viewDetails(record){
+            console.log(record)
+            this.$router.push(`/workBench/orderDetail?orderId=${record.id}`)
+        },
+        
+        
+        // 撤回订单
+        withdrawOrder(){
+
+        },
+        // 更多操作
+        handleMenuClick(e) {
+            console.log('click', e);
+        },
+
+        // 催一下
+        hurryUp(record){
+            console.log(record)
+        },
+
+        // 验收
+        checkAccept(record){
+            console.log(record)
+        },
+        onClose() {
+            this.visible = false;
+        },
+        // 上传素材
+        uploadMaterial(){
+
+        },
+
+        sort(pagination, filters, sorter, { currentDataSource }){
+        
+            this.ipagination.current=pagination.current;
+
+            this.ipagination.pageSize=pagination.pageSize;
+            this.materialHttp()
+        },
+        // 请求素材
+        materialHttp(){
+            // this.loading=true;           
+            this.data=[];
+        },
+
+        
+
+        
+
+        // 素材通过审核
+        approved(){
+
+        },
+        // 素材驳回
+        reject(){
+
+        },
+        
+        search(){
+
+        },
+        reset(){
+            this.orderName='';
+            this.orderId='';
+            this.orderStatus='';
+            this.orderParticipants="";
+            this.orderSponsor='';
+        },
+
+        tableHttp(type){
+            let  params=this.handlerParams(type)
+            params={
+                ...params,
+                pageNo:this.ipagination.current,
+                pageSize:this.ipagination.pageSize
+            }
+            getAction('/platform/order/listByCreatorOrDesignLeader',params).then(res=>{
+                console.log(res);
+                if(res.success){
+                    this.data=res.result.records;
+                    this.ipagination.total=res.result.total;
+
+                }
+            })
+        },
+
+        handlerParams(status){
+            if(this.$parent.role=='operator'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        createBy:this.userInfo.id
+                    }
+                }
+            }else if(this.$parent.role=='designLeader'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        design:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        materialStatus:1,
+                        design:this.userInfo.id
+                    }
+                }
+            }else if(this.$parent.role=='design'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        design:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        materialStatus:1,
+                        design:this.userInfo.id
+                    }
+                }else if(status==3){
+                    return {
+                        materialStatus:3,
+                        design:this.userInfo.id
+                    }
+                }else if(status==4){
+                    return {
+                        design:this.userInfo.id
+                    }
+                }
+            }
+           
+        },
+        handlerParamsRole(role){
+            if(this.$parent.role=='operator'){
+                this.panes=this.operatorPanes
+            }else if(this.$parent.role=='designLeader'){
+                this.panes=this.designLeaderPanes
+            }
+        }
+    },
+    mounted(){
+        
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        console.log(this.$parent.materialStatus)
+    },
+    activated() {
+        if(this.$parent.role=='operator'){
+            this.panes=this.operatorPanes
+        }else if(this.$parent.role=='designLeader'){
+            this.panes=this.designLeaderPanes
+        }else if(this.$parent.role=='design'){
+            this.panes=this.designPanes
+        }
+        this.activeKey=this.$parent.materialStatus
+        this.tableHttp(this.$parent.materialStatus)
+    },
+    filters:{
+        handleMaterialStatus(val){
+            let text
+            switch (val) {
+                case 0:
+                    text='待指派'
+                    break;
+                case 1:
+                    text='脚本已上传'
+                    break;
+                case 2:
+                    text='脚本待审核'
+                    break;
+                case 3:
+                    text='视频待上传'
+                    break;
+                case 4:
+                    text='脚本被驳回'
+                    break;
+                case 5:
+                    text='视频待审核'
+                    break;
+                case 6:
+                    text='视频被驳回'
+                    break;
+                case 7:
+                    text='物料已完成'
+                    break;
+                case -1:
+                    text='已作废'
+                    break;
+            
+                default:
+                    text='出错'
+                    break;
+            }
+            return text
+        }
+    },
+
+}
+</script>

+ 41 - 0
src/views/modules/workBench/operator/index.vue

@@ -0,0 +1,41 @@
+<template>
+
+        <component v-bind:is="currentTabComponent">
+
+        </component>
+    
+    
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+export default {
+    name:'index',
+    data() {
+        return {
+            currentTabComponent:'operatorPlatform',
+            orderStatus:undefined,//跳转到订单详情时需要里面的参数  status订单参数 role 当前角色
+            role:'operator',
+            materialStatus:undefined,
+            orderId:undefined,
+        }
+    },
+    components:{   
+        operatorPlatform: () => import('./platForm'), 
+        orderList: () => import('../orderList'), 
+        materialList: () => import('./materialList'), 
+        orderDetail: () => import('../orderDetail'), 
+        placeOrder: () => import('../placeOrder'), 
+    },
+
+    mounted(){
+       this.currentTabComponent='operatorPlatform' 
+    },
+    beforeDestroy() {
+        this.currentTabComponent='operatorPlatform' 
+    },
+   
+}
+
+</script>

+ 834 - 0
src/views/modules/workBench/operator/materialList.vue

@@ -0,0 +1,834 @@
+
+<style lang="scss" scoped>
+.orderDetail{
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+   
+    width: 100%;
+    .topBody{
+        width: 100%;
+        background: #FFFFFF;
+        margin-bottom: 12px;
+        padding: 20px;
+        box-sizing: border-box;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .bottom{
+            display: flex;
+            position: relative;
+            justify-content: space-between;
+            // padding: 20px;
+            .orderIcon{
+                width: 28px;
+                height: 28px;
+                margin-right: 15px;
+                img{
+                    width: 100%;
+                }
+            }
+            .tip{
+                .greet{
+                    width: 300px;
+                    height: 28px;
+                    font-size: 20px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 28px;
+                    margin-bottom: 5px;
+                }
+                .descPosition{
+                    
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.45);
+                    overflow: hidden;
+                    margin-bottom: 0;
+                    li{
+                        height: 22px;
+                        line-height: 22px;
+                        margin-top:3px ;
+                    }
+                    span{
+                        width: 250px;
+                        display: inline-block;
+                    }
+                }
+
+            }
+            .optBody{
+                width: 200px;
+                flex-shrink:0;
+                // justify-content: flex-end;
+                text-align: right;
+                .btnBody{
+                    margin-bottom: 10px;
+                }
+                .orderInfo{
+                    display: flex;
+                    justify-content: space-between;
+                    text-align: right;
+                    p{
+                        margin-bottom: 0;
+                    }
+                    
+                    .markName{                        
+                        height: 22px;
+                        font-size: 14px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.45);
+                        line-height: 22px;
+                    }
+                    .big{                                               
+                        height: 28px;
+                        font-size: 20px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.85);
+                        line-height: 28px;
+                    }
+                }
+
+            }
+        }
+
+    }
+    .section{
+        background: white;
+        padding:20px ;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .sectionBody{
+            
+            p{
+                margin-bottom: 0;
+            }
+            .section-item{
+                background: white;
+                margin-bottom: 20px;
+            }
+            .tabBox{
+                padding: 15px 20px 0;
+                display: flex;
+                flex-wrap: wrap;
+                position: relative;
+                .search-item{
+                    margin-bottom: 12px;
+                    width: 30%;
+                }
+                .opt-item{
+                    position: absolute;
+                    right: 20px;
+                    top: 16px;
+                }
+            }
+            .sectionHead{
+                padding: 15px 20px;
+                // height: 24px;
+                font-size: 16px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: rgba(0, 0, 0, 0.85);
+                line-height: 24px;
+                border-bottom: 1px solid  #E9E9E9;;
+                .allOrder{
+                    float: right;
+                }
+            }
+            .section-box{
+                margin-top: 30px;
+                padding: 20px 20px;
+                border: 1px solid #E9E9E9;
+                .description{
+                    margin-top: 10px;
+                    .time{
+                        height: 32px;
+                        line-height: 32px;
+                    }
+                }
+                ul{
+                    display: flex;
+                    flex-wrap: wrap;
+                    // justify-content: space-around;
+                }
+                li{
+                    
+                    width: 30%;
+                    height: 22px;
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 22px;
+                    text-align: left;
+                    margin-bottom: 15px;
+                }
+                .top{
+                    margin-bottom: 25px;
+                }
+                .bottom{
+                    h4{
+                        
+                        font-size: 15px;
+                        font-family: PingFangSC-Medium, PingFang SC;
+                        font-weight: 600;
+                        color: rgba(0, 0, 0, 0.85);
+                        margin-bottom: 25px;
+                    }
+                }
+                .shenhe{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #52C41A;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+
+                }
+                .wancheng{
+                    width: 6px;
+                    height: 6px;
+                     display: inline-block;
+                    background: #1890FF;
+                    border-radius: 50%;
+                    // margin-right: 3px;
+                    position: relative;
+                    top: -2px;
+                }
+                .bohui{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #F5222D;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+                }
+            }
+            
+        }
+    }
+}
+.videoBox{
+    width: 320px;
+    height: 180px;
+}
+.imgBox{
+    width: 100%;
+    height: 180px;
+}
+.marterialInfo{
+    
+    p{margin-bottom: 0;}
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+    .info-item{
+        margin-bottom: 20px;
+        display: flex;
+        // justify-content: center;
+        align-items: center;
+        span{
+            display: inline-block;
+            width: 70px;
+            text-align: left;
+        }
+        .ant-tag{
+            width: auto;
+            min-width: 50px;
+            text-align: center;
+        }
+    }
+    .info{
+        ul{
+            display: flex;
+            justify-content: space-between;
+            flex-wrap: wrap;
+        }
+        li{
+            width: 33.3%;
+            margin-bottom: 20px;
+        }
+        margin-bottom: 0;
+    }
+    .bottom-btn{
+        width: 100%;
+        text-align: center;
+        position: absolute;
+        bottom: 20px;
+        left: 0;
+
+    }
+}
+</style>
+
+<style lang="less">
+    .orderDetail{
+        .ant-timeline-item-head{
+            background: rgb(240,242,245);
+        }
+        .muen{
+            cursor: pointer;
+        }
+        .muen:hover{
+            color: #1890ff;
+        }
+    }   
+    
+</style>
+<template>
+    <div class="orderDetail ">
+        
+        <div class="section">
+             <p class="breadcrumb">
+                <a-breadcrumb style="display:block;width:100%">
+                    <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
+                    <a-breadcrumb-item>物料列表</a-breadcrumb-item>
+                </a-breadcrumb>
+            </p>
+            <div class="sectionBody">
+                <!-- <div class="tabBody">
+                    <a-tabs v-model="activeKey" @change='tabChange'>
+                        <a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title"  >
+                            
+                        </a-tab-pane>
+                    </a-tabs>
+                </div> -->
+                <!-- 素材列表 -->
+                <div class="section-item">
+                    <div class="tabBox">
+                        
+                        <div class="search-item">
+                            <span>名称:</span>
+                            <a-input placeholder="请输入订单名称" allow-clear v-model="materialName" style="width:300px" />
+                        </div>
+                        <div class="search-item">
+                            <span>编号:</span>
+                            <a-input placeholder="请输入订单编号" allow-clear v-model="materialId" style="width:300px" />
+                        </div>
+                        
+
+                        <div class="search-item">
+                            <span>所属订单:</span>
+                            <a-input placeholder="所属订单" allow-clear v-model="orderSponsor" style="width:300px" />
+                        </div>
+                        <div class="opt-item">
+                            <a-button type='primary' @click="search" style="margin-right:20px">查询</a-button>
+                            <a-button type='default' @click="reset">查询</a-button>
+                        </div>
+                    </div>
+                        
+                    
+                    <div class="section-box">
+                         <a-table
+                            size="middle"
+                            :columns="columns"
+                            :dataSource="data"
+                            id="outTable"
+                            :pagination="ipagination"
+                            :loading="loading"
+                            @change="sort"
+                            style="word-break: break-all;"
+                            >
+                            <div slot="materialStatus" slot-scope="text" >
+                                <span class="wancheng" v-if="text==7"> </span>
+                                <span class="bohui" v-else-if="text==6||text==4"> </span>
+                                <span class="shenhe" v-else> </span>
+                                {{text | handleMaterialStatus}}
+                            </div>
+                            <div slot="scriptStatus" slot-scope="text,record">
+                                <div v-if="text==0||text==2">脚本未上传</div>
+                                <div v-if="text==1">
+                                    <a href="javascript:;" @click="scriptViewDetails(record)">预览</a>
+                                    <a-divider type="vertical" />
+                                    <a href="javascript:;" @click="scriptApproved(record)">通过</a>
+                                    <a-divider type="vertical" />
+                                    <a href="javascript:;" @click="scriptReject(record)">驳回</a>
+                                </div>
+                                <div v-if="text==3">
+                                     <a href="javascript:;" @click="scriptViewDetails(record)">预览</a>
+                                </div>
+                            </div>
+                            <div slot="videoStatus" slot-scope="text,record">
+                                <div v-if="text==0||text==2">视频未上传</div>
+                                <div v-if="text==1">
+                                    <a href="javascript:;" @click="viewDetails(record)">预览</a>
+                                    <a-divider type="vertical" />
+                                    <a href="javascript:;" @click="approved(record)">通过</a>
+                                    <a-divider type="vertical" />
+                                    <a href="javascript:;" @click="reject(record)">驳回</a>
+                                </div>
+                                <div v-if="text==3">
+                                     <a href="javascript:;" @click="viewDetails(record)">预览</a>
+                                </div>
+                            </div>
+                           
+
+                        </a-table>
+                    </div>
+                    <a-drawer
+                    title="视频详情"
+                    width="640"
+                    :placement="placement"
+                    :closable="false"
+                    :visible="visible"
+                    @close="onClose"
+                    >
+                        <div class="videoBody">
+                            <div class="videoBox">
+                                <video :src="currentMaterial.src" ></video>
+                            </div>
+                            
+                            <div class="imgBox">
+                                <img src="" alt="">
+                                <img src="" alt="">
+                            </div>
+                        </div>
+                        <div class="marterialInfo">
+                            <div class="info-item">
+                                <span>素材状态:</span>
+                                <p>未审核</p>
+                            </div>
+                            <div class="info-item">
+                                <span>生成水印:</span>
+                                <a-select :defaultValue="4" v-model="size" style="width:70%;">
+                                    <a-select-option :value="item.id" :key="item.id" v-for="item of sizeType">{{
+                                        item.name
+                                    }}</a-select-option>
+                                </a-select>
+                                
+                            </div>
+                            <div class="info-item">
+                                <span>视频标签:</span>
+                                <a-tag>Tag 1</a-tag>
+                                <a-tag>Tag 1</a-tag>
+                            </div>
+                            <div class="info-item info">
+                                <ul>
+                                    <li><span>视频时长:</span> 17秒 </li>
+                                    <li><span>视频尺寸:</span> 1080*1920 </li>
+                                    <li><span>视频大小:</span> 31.42M </li>
+                                    <li><span>策划:</span> 吴永前 </li>
+                                    <li><span>拍摄:</span> 吴永前 </li>
+                                    <li><span>剪辑:</span> 吴永前 </li>                                    
+                                </ul>
+                            </div>
+                            <div class="info-item">
+                                <span>广告语:</span>
+                                <p>14354534324454354水电费水电费方式手动</p>
+                            </div>
+                            <div class="bottom-btn">
+                                <a-button type='primary' @click="approved" style="margin-right:20px">通过审核</a-button>
+                                <a-button type='default' @click="reject">驳回</a-button>
+                            </div>
+                        </div>
+                    </a-drawer>
+                    <a-drawer
+                    title="脚本详情"
+                    width="640"
+                    :placement="placement"
+                    :closable="false"
+                    :visible="scriptVisible"
+                    @close="scriptClose"
+                    >
+                        <div class="videoBody">
+                            <div class="videoBox">
+                                <video :src="currentMaterial.src" ></video>
+                            </div>
+                            
+                            <div class="imgBox">
+                                <img src="" alt="">
+                                <img src="" alt="">
+                            </div>
+                        </div>
+                        <div class="marterialInfo">
+                            <div class="info-item">
+                                <span>脚本状态:</span>
+                                <p>未审核</p>
+                            </div>
+                            <div class="info-item">
+                                <span>所属项目:</span>
+                                <p>所属项目:充电得宝 快手 北京汇创思拓有限公司</p>
+                                
+                            </div>
+                            <div class="info-item">
+                                <span>所属物料:</span>
+                                <p>所属项目:充电得宝 快手 北京汇创思拓有限公司</p>
+                            </div>
+                            <div class="info-item">
+                                <span>编导:</span>
+                                <p>吴永前</p>
+                            </div>
+                            <div class="info-item">
+                                <span>脚本:</span>
+                                <p></p>
+                            </div>
+                                                       
+                            <div class="bottom-btn">
+                                <a-button type='primary' @click="approved" style="margin-right:20px">通过审核</a-button>
+                                <a-button type='default' @click="reject">驳回</a-button>
+                                <a-button type='default' @click="dowmLoadScript">下载脚本</a-button>
+                                <a-button type='default' @click="scriptClose">关闭</a-button>
+                            </div>
+                        </div>
+                    </a-drawer>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+import qs from 'qs'
+
+let columns=[
+    {
+        title: '物料名称',
+        dataIndex: 'orderTitle',
+        align: 'center',        
+        key: 'orderTitle',
+        scopedSlots: { customRender: 'orderTitle' }
+    },
+    {
+        title: '物料编号',
+        dataIndex: 'id',
+        align: 'center',        
+        key: 'tag',
+        scopedSlots: { customRender: 'id' }
+    },
+    {
+        title: '物料状态',
+        dataIndex: 'materialStatus',
+        align: 'center',        
+        key: 'materialStatus',
+        scopedSlots: { customRender: 'materialStatus' }
+    },
+    {
+        title: '脚本',
+        dataIndex: 'scriptStatus',
+        align: 'center',        
+        key: 'scriptStatus',
+        scopedSlots: { customRender: 'scriptStatus' }
+    },
+     {
+        title: '视频',
+        dataIndex: 'videoStatus',
+        align: 'center',        
+        key: 'videoStatus',
+        width:250,
+        scopedSlots: { customRender: 'videoStatus' }
+    },
+    {
+        title: '所属订单',
+        dataIndex: 'materialFinishTime',
+        align: 'center',        
+        key: 'materialFinishTime',
+        scopedSlots: { customRender: 'materialFinishTime' }
+    },
+   
+]
+
+
+
+export default {
+    name:'material-list',
+    data() {
+        const panes = [
+            { title: '脚本列表', content: '', key: 1 , },
+            { title: '视频列表', content: '', key: 2 , },           
+        ];
+        return {
+            
+            userInfo:{},
+            roleCode:'',
+
+            panes,
+            activeKey: 1,
+            orderInfo:{ },
+
+            columns,
+            data:[],
+            loading:false,
+            ipagination: {
+                current: 1,
+                pageSize: 10,
+                //   pageSizeOptions: ['10', '20', '30'],
+                showTotal: (total, range) => {
+                    return range[0] + "-" + range[1] + " 共" + total + "条"
+                },
+                showQuickJumper: true,
+                showSizeChanger:true,
+                pageSizeOptions: ['10', '30', '50'],
+                total: 0,
+                onChange: (current, pageSize) => {
+                    // 切换分页时的回调,
+                    // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+                    this.ipagination.current = current;
+                    this.ipagination.pageSize= pageSize;
+                }
+            },
+            // 订单进度
+            materialName:'',
+            materialId:'',
+            orderStatus:'',
+            orderParticipants:"",
+            orderSponsor:'',
+
+            visible: false,
+            scriptVisible:false,
+            placement: 'right',
+            currentMaterial:{},
+
+
+            sizeType:[],
+            size: "4",
+        }
+    },
+    methods: {
+        closeBox(){
+
+        },
+        dowmLoadScript(){
+            
+        },
+        goPlantForm(){
+            if(this.$parent.role=='operator'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }else if(this.$parent.role=='designLeader'){
+                this.$parent.currentTabComponent='designleaderPlatform'
+            }else if(this.$parent.role=='design'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }
+        },
+        tabChange(key){
+            console.log(key)
+           
+            this.tableHttp(key)
+        },
+        handleChange(value) {
+            console.log(`selected ${value}`);
+        },
+        
+        filterOption(input, option) {
+            return (
+                option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            );
+        },
+
+        // 查看详情
+        viewDetails(record){
+            console.log(record)
+           this.visible=true;
+        },
+        // 查看详情
+        scriptViewDetails(record){
+            console.log(record)
+            this.scriptVisible=true;
+            // this.$router.push(`/workBench/orderDetail?orderId=${record.id}`)
+        },
+        
+        
+        // 撤回订单
+        withdrawOrder(){
+
+        },
+        // 更多操作
+        handleMenuClick(e) {
+            console.log('click', e);
+        },
+
+        
+
+        // 验收
+        checkAccept(record){
+            console.log(record)
+        },
+        onClose() {
+            this.visible = false;
+        },
+        scriptClose() {
+            this.scriptVisible = false;
+        },
+        // 上传素材
+        uploadMaterial(){
+
+        },
+
+        sort(pagination, filters, sorter, { currentDataSource }){
+        
+            this.ipagination.current=pagination.current;
+
+            this.ipagination.pageSize=pagination.pageSize;
+            this.materialHttp()
+        },
+        // 请求素材
+        materialHttp(){
+            // this.loading=true;           
+            this.data=[];
+        },
+
+        
+
+        
+
+        // 视频通过审核
+        approved(){
+
+        },
+        // 视频驳回
+        reject(){
+
+        },
+        
+        search(){
+
+        },
+        reset(){
+            this.materialName='';
+            this.materialId='';
+            this.orderStatus='';
+            this.orderParticipants="";
+            this.orderSponsor='';
+        },
+
+        tableHttp(type){
+            let  params=this.handlerParams(type)
+            params={
+                ...params,
+                pageNo:this.ipagination.current,
+                pageSize:this.ipagination.pageSize
+            }
+            console.log(params)
+            getAction('/platform/designer/listByOperatorUserId',params).then(res=>{
+                console.log(res);
+                if(res.success){
+                    this.data=res.result.records;
+                    this.ipagination.total=res.result.total;
+
+                }
+            })
+        },
+
+        handlerParams(status){
+            if(this.$parent.role=='operator'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        createBy:this.userInfo.id
+                    }
+                }
+            }else if(this.$parent.role=='designLeader'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        design:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        materialStatus:1,
+                        design:this.userInfo.id
+                    }
+                }
+            }else if(this.$parent.role=='design'){
+                if(status==1){
+                    return {
+                        materialStatus:0,
+                        design:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        materialStatus:1,
+                        design:this.userInfo.id
+                    }
+                }else if(status==3){
+                    return {
+                        materialStatus:3,
+                        design:this.userInfo.id
+                    }
+                }else if(status==4){
+                    return {
+                        design:this.userInfo.id
+                    }
+                }
+            }
+           
+        },
+        
+    },
+    mounted(){
+        
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        console.log(this.$parent.materialStatus)
+    },
+    activated() {
+        
+        this.activeKey=this.$parent.materialStatus
+        this.tableHttp(this.$parent.materialStatus)
+    },
+    filters:{
+        handleMaterialStatus(val){
+            let text
+            switch (val) {
+                case 0:
+                    text='待指派'
+                    break;
+                case 1:
+                    text='脚本已上传'
+                    break;
+                case 2:
+                    text='脚本待审核'
+                    break;
+                case 3:
+                    text='视频待上传'
+                    break;
+                case 4:
+                    text='脚本被驳回'
+                    break;
+                case 5:
+                    text='视频待审核'
+                    break;
+                case 6:
+                    text='视频被驳回'
+                    break;
+                case 7:
+                    text='物料已完成'
+                    break;
+                case -1:
+                    text='已作废'
+                    break;
+            
+                default:
+                    text='出错'
+                    break;
+            }
+            return text
+        }
+    },
+
+}
+</script>

+ 511 - 0
src/views/modules/workBench/operator/platForm.vue

@@ -0,0 +1,511 @@
+<template>
+    <div class="workBench">
+        <div class="topBody">
+            <p class="breadcrumb">工作台</p>
+            <div class="bottom">
+                <div class="touxiang">
+                    <img src="@/assets/touxiang.png"  alt="">
+                </div>  
+                <div class='tip'>
+                    <p class="greet">早安,{{userInfo.username}},祝你开心每一天!</p>
+                    <p class="descPosition">
+                        <span>运营经理</span>
+                        <a-divider type="vertical" />
+                        <span>华北地区-头条事业部</span>
+                    </p>
+                </div>
+                <a-button type='primary' class="mybtn" @click="sendOrder">
+                    <a-icon type="plus" />
+                    发起订单
+                </a-button>
+            </div>
+        </div>
+        <div class="section">
+            <div class="sectionBody">
+                <div class="sectionLeftBox">
+                    <div class="leftTop">
+                        <div class="sectionHead">
+                            我的工作内容
+                        </div>
+                        <div class="zhanshiBox">
+                           
+                            <div class="item" @click="goOrderList(1)">                               
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>我发起的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>
+                            </div>
+                            <div class="item" @click="goMaterialList(1)">                                
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>待审核的物料</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                              
+                            </div>
+                           
+                            <div class="item" @click="goOrderList(2)">                               
+                                <div class="title">                                   
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>已完成的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>
+                            </div>
+                            <div class="item" @click="goOrderList(3)">                                
+                                <div class="title">                                   
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>被驳回的订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>
+                            </div>
+                            <div class="item" @click="goOrderList(4)">                                
+                                <div class="title">
+                                    <img src="@/assets/work.png" alt="" class="iconImg">
+                                    <span>全部订单</span>
+                                </div>
+                                <div class="itemBody">
+                                    <p class="count">60 <span>个</span></p>
+                                </div>                                
+                            </div>
+                        </div>  
+                    </div>
+                    <div class="leftBottom">
+                        <div class="sectionHead">
+                            订单进度
+                             <a-button type="link" class="allOrder" @click="goOrderList(4)">全部订单</a-button>
+                        </div>
+                        <div class="orderProgress">
+                            <ul class="orderProgress-list">
+                                <li v-for="(item,index) in orderProgressList" :key="index"  >
+                                    <!-- <span  style="display:block;width:100%"> -->
+                                    <div style="display:flex;align-items: center;" class="orderProgress-list-item" @click="orderDetail(item)">
+                                        <div style="display:flex;width:80%; align-items: center;" >
+                                            <span class="item-icon"></span>
+                                            <div class="content">
+                                                <p class="name">我是一个任务名称嗷嗷嗷啊</p>
+                                                <p class="desc">这是对这个任务的简介,所以得好好寻…</p>
+                                            </div>
+                                        </div>
+                                        
+                                        <div class="progress">
+                                            <a-progress type="circle" :percent="75" :width='30' :showInfo='false'  :strokeWidth='10' />
+                                            <span style="margin-left:15px">75%</span>
+                                        </div>
+                                    </div>
+                                    <!-- </span> -->
+                                </li>
+                            </ul>
+                            <!-- hideOnSinglePage -->
+                            <a-pagination size="small" :total="totalPage" :current='currentPage' class="fenye" :change='pageChange'  show-size-changer show-quick-jumper hideOnSinglePage />
+                        </div>
+                    </div>
+                </div>
+                <div class="sectionRightBox">
+                    <div class="rightTop">
+                        <div class="sectionHead">
+                            操作记录
+                        </div>
+                        <div class="optionRecordList">
+                            <a-timeline>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                <a-timeline-item color='#F0F2F5' style="height:30px">
+                                   <p style="margin-bottom:0px">
+                                    <span class="content-item">Create a services site 2015-09-01</span> 
+                                    <span class="time">1分钟前</span>
+                                   </p>
+                                </a-timeline-item>
+                                
+                            </a-timeline>
+                        </div>
+                    </div>
+                    <div class="rightBottom">
+                        <div class="sectionHead">
+                            本周项目燃尽图
+                        </div>
+                        <div class="burnDown">
+                             <a-progress type="circle" :percent="75"  :width='150' :strokeWidth='6' />
+                             <div class="tip">
+                                <p class="done">
+                                    <span class="item-icon"></span>
+                                    <span>已完成订单:{{}}个</span>
+                                </p>
+                                <p class="all">
+                                    <span class="item-icon"></span>
+                                    <span>未完成订单:{{}}个</span>
+                                </p>
+                             </div>
+                        </div>
+                    </div>
+                </div>
+                
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+
+export default {
+    name:'operator-platform',
+    data() {
+        return {
+            touxiang:'@/assets/touxiang.png',
+            // 订单进度
+            orderProgressList:[
+                {},
+                {},
+                {}
+            ],
+
+            // 操作记录
+            optionRecord:[],
+
+            // 本周项目燃尽图
+            burnDownChart:[],
+
+            // 分页参数
+            totalPage:0,
+            currentPage:1,
+            userInfo:{},
+            roleCode:''
+        }
+    },
+    methods: {
+        goOrderList(val){
+            console.log(val);
+            // console.log(this.$parent)
+            this.$parent.currentTabComponent='orderList';
+            this.$parent.orderStatus=val
+            
+        },
+        goMaterialList(val){
+            this.$parent.currentTabComponent='materialList';
+            this.$parent.materialStatus=val
+        },
+        orderDetail(item){
+            console.log(item)
+            this.$parent.currentTabComponent='orderDetail';
+            this.$parent.orderId=item.id
+        },
+        // 分页页码改变
+        pageChange(page, pageSize){
+
+        },
+        
+        // 发起订单
+        sendOrder(){
+            this.$parent.currentTabComponent='placeOrder';
+            
+        },
+    },
+    mounted(){
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        
+        
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+.workBench{
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+    width: 100%;
+    .topBody{
+        width: 100%;
+        height: 146px;
+        background: #FFFFFF;
+        margin-bottom: 12px;
+        padding: 20px;
+        box-sizing: border-box;
+        .breadcrumb{
+            width: 42px;
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .bottom{
+            display: flex;
+            position: relative;
+            // padding: 20px;
+            .touxiang{
+                width: 72px;
+                height: 72px;
+                margin-right: 20px;
+                border-radius: 50%;
+                overflow: hidden;
+                img{
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 50%;
+                }
+            }
+            .tip{
+                .greet{
+                    height: 28px;
+                    font-size: 20px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 28px;
+                }
+                .descPosition{
+                    height: 22px;
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.45);
+                    line-height: 22px;
+                }
+
+            }
+            .mybtn{
+                position: absolute;
+                // top: 50%;
+                // margin-left: -18px;
+                right: 0;
+            }
+        }
+
+    }
+    .section{
+        .sectionBody{
+            display: flex;
+            .sectionHead{
+                padding: 15px 20px;
+                // height: 24px;
+                font-size: 16px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: rgba(0, 0, 0, 0.85);
+                line-height: 24px;
+                border-bottom: 1px solid  #E9E9E9;;
+                position: relative;
+                .allOrder{
+                    position: absolute;
+                    right: 5px;
+                }
+            }
+            .sectionLeftBox{
+                width: 70%;
+               
+                .leftTop{
+                    overflow: hidden;
+                    background: white;
+                }
+                .zhanshiBox{
+                    display: flex;
+                    flex-wrap: wrap;
+                    .item{
+                        width: 33.33%;
+                        // background: brown;
+                        padding: 20px ;
+                        border-right: 1px solid #E9E9E9;
+                        border-bottom: 1px solid #E9E9E9;
+                        .title{
+                            padding-bottom: 34px;
+                            color: #000000;
+                            .iconImg{
+                                width: 24px;
+                                margin-right: 8px;
+                            }
+                        }
+                        .itemBody{
+                            text-align: center;
+                            .count{
+                                
+                                font-size: 24px;
+                                font-family: PingFangSC-Medium, PingFang SC;
+                                font-weight: 500;
+                                color: #000000;
+                                line-height: 32px;
+                                cursor: pointer;
+                                span{
+                                    font-size: 16px;
+                                    cursor: pointer;
+                                }
+                            }
+                            .count:hover{                                
+                                color: #1890FF;
+                            }
+                        }
+                    }
+                    .item:nth-child(3n){
+                        border-right: 0;
+                    }
+                }
+                .leftBottom{
+                    margin-top: 12px;
+                    background: white;
+                    .orderProgress{
+                        padding: 0 20px;
+                        .orderProgress-list-item{
+                            padding: 10px 0;
+                            display: flex;
+                            align-items: center;
+                            border-bottom: 1px solid  #E9E9E9;;
+                            justify-content:space-between;
+                            cursor: pointer;
+                            .item-icon{
+                                width: 8px;
+                                height: 8px;
+                                background: #3BA0FF;
+                                margin-right: 15px;
+                                display: inline-block;
+                                border-radius: 50%;
+                            }
+                            .content{
+                                width: 70%;
+                                overflow: hidden;
+                                font-size: 14px;
+                                font-family: PingFangSC-Regular, PingFang SC;
+                                font-weight: 400;
+                                .name{
+                                    height: 22px;                                    
+                                    color: rgba(0, 0, 0, 0.65);
+                                    line-height: 22px;
+                                    text-overflow: ellipsis;
+                                    white-space: nowrap;
+                                    overflow: hidden;
+                                    margin-bottom: 0px;
+                                }
+                                .desc{
+                                    height: 22px;
+                                    color: rgba(0, 0, 0, 0.25);
+                                    line-height: 22px;
+                                    text-overflow: ellipsis;
+                                    white-space: nowrap;
+                                    overflow: hidden;
+                                     margin-bottom: 0px;
+                                }
+                            }
+                            .progress{
+                                float: right;
+                            }
+                        }
+                        .fenye{
+                            padding: 20px 0;
+                            text-align: right;
+                        }
+                    }
+                }
+            }
+            .sectionRightBox{
+                width: 29.5%;
+                // background: white;
+                margin-left: 12px;
+                .rightTop{
+                    height: 370px;
+                     background: white;
+                     .optionRecordList{
+                         padding: 20px;
+                         p{
+                             width: 100%;
+                         }
+                        .content-item{
+                            width: 80%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                        .time{
+                            width: 20%;
+                            display: inline-block;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                     }
+                }
+                .rightBottom{
+                    margin-top: 12px;
+                     background: white;
+                    .burnDown{
+                         padding: 30px 20px;
+                         text-align: center;
+                         .tip{
+                            margin-top: 40px;
+                            display: flex;
+                            justify-content: space-around;
+                             
+                            height: 22px;
+                            font-size: 14px;
+                            font-family: PingFangSC-Regular, PingFang SC;
+                            font-weight: 400;
+                            color: rgba(0, 0, 0, 0.65);
+                            line-height: 22px;
+                             .done{
+                                .item-icon{
+                                     width: 8px;
+                                    height: 8px;
+                                    background: #3BA0FF;
+                                    margin-right: 15px;
+                                    display: inline-block;
+                                    border-radius: 50%;
+                                }
+                             }
+                             .all{
+                                .item-icon{
+                                    width: 8px;
+                                    height: 8px;
+                                    background: #F0F2F5;
+                                    margin-right: 15px;
+                                    display: inline-block;
+                                    border-radius: 50%;
+                                } 
+                             }
+                         }
+                    }
+
+                }
+            }
+        }
+    }
+}
+</style>
+
+<style lang="less">
+    .workBench{
+        .ant-timeline-item-head{
+            background: rgb(240,242,245);
+        }
+    }
+</style>

+ 271 - 114
src/views/modules/workBench/orderDetail.vue

@@ -10,7 +10,7 @@
     .topBody{
         width: 100%;
         background: #FFFFFF;
-        margin-bottom: 24px;
+        margin-bottom: 12px;
         padding: 20px;
         box-sizing: border-box;
         .breadcrumb{
@@ -72,6 +72,8 @@
                 text-align: right;
                 .btnBody{
                     margin-bottom: 10px;
+                    display: flex;
+                    justify-content: space-between;
                 }
                 .orderInfo{
                     display: flex;
@@ -167,6 +169,25 @@
                         color: rgba(0, 0, 0, 0.85);
                         margin-bottom: 25px;
                     }
+                    ul{
+                        width: 850px;
+                        display: flex;
+                        justify-content: space-between;
+                        padding: 0 15px;
+                        li{
+                            width: 400px;
+                            height: 32px;
+                            line-height: 32px;
+                            padding: 0 10px;
+                            box-sizing: border-box;
+                            cursor: pointer;
+                            text-overflow: ellipsis;
+                            overflow: hidden;
+                            white-space: nowrap;
+                            background: rgba(245, 245, 245, 0.5);
+                            border-radius: 5px;;
+                        }
+                    }
                 }
                 .shenhe{
                     width: 6px;
@@ -261,14 +282,21 @@
         .ant-timeline-item-head{
             background: rgb(240,242,245);
         }
+        .muen{
+            cursor: pointer;
+        }
+        .muen:hover{
+            color: #1890ff;
+        }
     }
 </style>
 <template>
     <div class="orderDetail ">
+        <a-spin :spinning="pageSpinning">
         <div class="topBody">
             <p class="breadcrumb">
                 <a-breadcrumb style="display:block;width:100%">
-                    <a-breadcrumb-item><router-link to="/workBench">工作台</router-link></a-breadcrumb-item>
+                    <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
                     <a-breadcrumb-item>订单详情</a-breadcrumb-item>
                 </a-breadcrumb>
             </p>
@@ -298,16 +326,39 @@
                 </div>
                
                 <div class="optBody">
-                    <div class="btnBody">
-                        <a-button type='default' style="margin-right:15px" @click="withdrawOrder">撤回订单</a-button>
-                        <a-dropdown>
-                            <a-menu slot="overlay" @click="handleMenuClick">
-                                <a-menu-item key="1">1</a-menu-item>
-                                <a-menu-item key="2">2</a-menu-item>
-                                <a-menu-item key="3">3</a-menu-item>
-                            </a-menu>
-                            <a-button> 更多 <a-icon type="down" /> </a-button>
-                        </a-dropdown>
+                    <div class="btnBody" v-if="role=='designLeader'">
+                        <a-button type='primary' @click="confirmOrder" :loading='confirmOrderBtnLoading' v-if="currentOrderInfo.orderStatus==1">确认订单</a-button>
+                        <a-popover
+                            title="Click title"
+                            trigger="click"
+                            :visible="clicked"
+                            @visibleChange="handleClickChange"
+                            >
+                            <div slot="content">
+                               <a-textarea
+                                v-model="orderAdvice"
+                                placeholder="请填写驳回理由"
+                                :auto-size="{ minRows: 3, maxRows: 5 }"
+                                />
+                                <a @click="rejectOrder">确定驳回</a>
+                            </div>
+                             <a-button type='default'   :loading='rejectOrderBtnLoading' v-if="currentOrderInfo.orderStatus==1">驳回订单</a-button>
+                        </a-popover>
+                       
+                    </div>
+                    <div class="btnBody" v-if="role=='operator'">
+                        <a-popconfirm
+                            title="确定要撤回订单吗?"
+                            ok-text="撤回"
+                            cancel-text="取消"
+                            @confirm="withdrawOrderConfirm"
+                            @cancel="withdrawOrderCancel"
+                        >
+                            <a-button type='default' :loading='withdrawOrderBtnLoading' v-if="currentOrderInfo.orderStatus==0">撤回订单</a-button>
+                        </a-popconfirm>
+                        
+                        
+                        <a-button type='default'  @click="editOrder" :loading='editOrderBtnLoading' v-if="currentOrderInfo.orderStatus==0||currentOrderInfo.orderStatus==2">修改订单</a-button>
                     </div>
                     <div class="orderInfo">
                         <div>
@@ -378,33 +429,42 @@
                         <div class="top">
                             <ul>
                                 <li>
-                                    订单发起人:<span>吴永前</span>
+                                    订单所含物料总数:<span>20</span>
+                                </li>
+                                <li>
+                                    真人物料数<span>10</span>
                                 </li>
                                 <li>
-                                    订单所含素材总数:<span>20</span>
+                                    投放系统<span>安卓</span>
                                 </li>
                                 <li>
-                                    订单状态:<span>设计中</span>
+                                    要求日更物料数:<span>4</span>
                                 </li>
                                 <li>
-                                    订单所属项目:<span>北京聚划算</span>
+                                    剪辑物料数:<span>10</span>
                                 </li>
                                 <li>
-                                    要求日更素材:<span>4</span>
+                                    APK包<span>https://down.xmiles.cn/down/18205/1873295</span>
                                 </li>
+                               
                             </ul>
                         </div>
                         <div class="bottom">
-                            <h4>素材负责人</h4>
+                            <h4>附件</h4>
                             <ul>
-                                <li> 设计组长:<span>毕洁泉</span></li>
-                                <li> 摄像:<span>王垒</span></li>
-                                <li> </li>
-                                <li> 编导:<span>毕洁泉</span></li>
-                                <li> 剪辑:<span>毕洁泉</span></li>
-                                <li> </li>
+                                <li> 附件名</li>
+                                <li> 附件名</li>
+                                <li> 附件名</li>
+                                <li> 附件名</li>
+                                <li> 附件名</li>
+                                <li> 附件名</li>
+                                
                             </ul>
                         </div>
+                        <div class="bottom">
+                            <h4>备注</h4>
+                            <p>我是北方的方式发送到发送到发送到地方个梵蒂冈地方滚滚滚的方法滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答滴滴答答</p>
+                        </div>
                     </div>
 
                 </div>
@@ -412,9 +472,8 @@
                 <div class="section-item">
                     <div class="tabBox">
                         <a-tabs v-model="tabKey" @change="tabChange">
-                            <a-tab-pane :key='1' tab="素材"></a-tab-pane>
-                            <a-tab-pane :key='2' tab="脚本"></a-tab-pane>
-                            <a-button type='primary' slot="tabBarExtraContent">上传素材</a-button>
+                            <a-tab-pane :key='1' tab="真人物料"></a-tab-pane>
+                            <a-tab-pane :key='2' tab="剪辑物料"></a-tab-pane>
                         </a-tabs>
                     </div>
                         
@@ -424,7 +483,6 @@
                             size="middle"
                             :columns="columns"
                             :dataSource="data"
-                            bordered
                             id="outTable"
                             :pagination="ipagination"
                             :loading="loading"
@@ -465,6 +523,12 @@
                                     <a href="javascript:;" >删除</a>
                                 </a-popconfirm> -->                                
                             </span>
+                            <span slot="scriptOptions" slot-scope="text,record">
+                                <a href="javascript:;" @click="viewDetails(record)">预览脚本</a>                                   
+                            </span>
+                            <span slot="scriptOptions" slot-scope="text,record">
+                                <a href="javascript:;" @click="viewDetails(record)">预览视频</a>                                            
+                            </span>
 
                         </a-table>
                     </div>
@@ -528,6 +592,7 @@
                 </div>
             </div>
         </div>
+        </a-spin>
     </div>
 </template>
 
@@ -535,95 +600,47 @@
 import moment from 'moment';
 import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
 
-let materialColumns=[
+let realColumns=[
     {
-        title: '素材名称',
+        title: '物料标题',
         dataIndex: 'name',
         align: 'center',        
         key: 'name',
         scopedSlots: { customRender: 'name' }
     },
     {
-        title: '素材类型',
+        title: '物料编号',
         dataIndex: 'type',
         align: 'center',        
         key: 'type',
         scopedSlots: { customRender: 'type' }
     },
     {
-        title: '素材状态',
+        title: '物料进度',
         dataIndex: 'status',
         align: 'center',        
         key: 'status',
         scopedSlots: { customRender: 'status' }
     },
     {
-        title: '完结时间',
-        dataIndex: 'time',
-        align: 'center',        
-        key: 'time',
-        scopedSlots: { customRender: 'time' }
-    },
-    {
-        title: '备注',
-        dataIndex: 'remarks',
-        align: 'center',        
-        key: 'remarks',
-        scopedSlots: { customRender: 'remarks' }
-    },
-    {
-        title: '操作',
-        dataIndex: 'options',
+        title: '脚本',
+        dataIndex: 'scriptOptions',
         align: 'center',        
         key: 'options',
-        scopedSlots: { customRender: 'options' }
-    },
-]
-let scriptColumns=[
-    {
-        title: '素材名称',
-        dataIndex: 'name',
-        align: 'center',        
-        key: 'name',
-        scopedSlots: { customRender: 'name' }
-    },
-    {
-        title: '素材标签',
-        dataIndex: 'tag',
-        align: 'center',        
-        key: 'tag',
-        scopedSlots: { customRender: 'tag' }
-    },
-    {
-        title: '素材状态',
-        dataIndex: 'status',
-        align: 'center',        
-        key: 'status',
-        scopedSlots: { customRender: 'status' }
-    },
-    {
-        title: '完结时间',
-        dataIndex: 'time',
-        align: 'center',        
-        key: 'time',
-        scopedSlots: { customRender: 'time' }
-    },
-    {
-        title: '备注',
-        dataIndex: 'remarks',
-        align: 'center',        
-        key: 'remarks',
-        scopedSlots: { customRender: 'remarks' }
+        width:250,
+        scopedSlots: { customRender: 'scriptOptions' }
     },
     {
-        title: '操作',
-        dataIndex: 'options',
+        title: '视频',
+        dataIndex: 'videoOptions',
         align: 'center',        
         key: 'options',
-        scopedSlots: { customRender: 'options' }
+        width:250,
+        scopedSlots: { customRender: 'videoOptions' }
     },
 ]
 
+
 let marterialData=[
     {
         name:'1111',
@@ -656,8 +673,12 @@ let marterialData=[
     },
 ]
 export default {
+    name:'order-detail',
     data() {
         return {
+            pageSpinning:false,
+            userInfo:{},
+            roleCode:'',
             tabKey:1,
 
             columns:[...materialColumns],
@@ -695,9 +716,96 @@ export default {
 
             sizeType:[],
             size: "4",
+
+            currentOrderId:'',
+            currentOrderInfo:{},
+            url:{
+                orderDetail:'/platform/order/queryById',
+                confirmOrder:'/platform/designer/accept',
+                rejectOrder:'/platform/designer/reject',
+
+                withdrawOrder:'/platform/operator/destroy',
+            },
+
+            confirmOrderBtnLoading:false,
+            rejectOrderBtnLoading:false,
+            withdrawOrderBtnLoading:false,
+            editOrderBtnLoading:false,
+
+            orderAdvice:'',//驳回理由
+
+            role:'',
         }
     },
     methods: {
+        goPlantForm(){
+            if(this.$parent.role=='operator'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }else if(this.$parent.role=='designLeader'){
+                this.$parent.currentTabComponent='designleaderPlatform'
+            }else if(this.$parent.role=='design'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }
+        },
+        // 确认订单
+        confirmOrder(){
+            this.confirmOrderBtnLoading=true;
+            postAction(this.url.confirmOrder,this.currentOrderInfo).then(res=>{
+                console.log(res)
+                this.confirmOrderBtnLoading=false;
+                if(res.success){
+                    this.$message.success(res.messgae)
+                    this.orderDetailHttp()
+                }else{
+                    this.$message.error(res.message)
+                }
+            })
+        },
+        // 驳回订单
+        rejectOrder(){
+            if(this.orderAdvice){
+                this.rejectOrderBtnLoading=true;
+                let params={
+                    ...this.currentOrderInfo,
+                    orderAdvice:this.orderAdvice
+                }
+                postAction(this.url.rejectOrder,params).then(res=>{
+                    console.log(res)
+                    this.rejectOrderBtnLoading=false;
+                    if(res.success){
+                        this.$message.success(res.messgae)
+                        this.orderDetailHttp()
+                    }else{
+                        this.$message.error(res.message)
+                    }
+                })
+            }else{
+                this.$message.error('请填写驳回理由')
+            }
+            
+        },
+
+        // 撤回订单
+        withdrawOrderConfirm(){
+            this.withdrawOrderBtnLoading=true;
+            let params={
+                ...this.currentOrderInfo,               
+            }
+            postAction(this.url.withdrawOrder,params).then(res=>{
+                console.log(res)
+                this.withdrawOrderBtnLoading=false;
+                if(res.success){
+                    this.$message.success(res.messgae)
+                    this.orderDetailHttp()
+                }else{
+                    this.$message.error(res.message)
+                }
+            })
+        },
+        withdrawOrderCancel(e) {
+            console.log(e);
+            // this.$message.error('');
+        },
         // 查看详情
         viewDetails(record){
             console.log(record)
@@ -711,10 +819,7 @@ export default {
         withdrawOrder(){
 
         },
-        // 更多操作
-        handleMenuClick(e) {
-            console.log('click', e);
-        },
+        
 
         // 催一下
         hurryUp(){
@@ -766,31 +871,83 @@ export default {
         },
         // 生成水印
         getWater() {
-        var params = qs.stringify({
-          id: this.id,
-          watermarkTemplateId: this.size
-        })
-        postAction('/ctop/materialInfo/watermark', params).then(res => {
-          if (res.success) {
-            // getAction("/ctop/videoWatermarkTask/list").then(res=>{
-            //     console.log(res)
-            // })
-            this.$message.success('水印素材生成中,请一分钟后刷新')
-            this.visibleDetail = false
-            this.refuseFile = []
-            this.refuseReason = ''
-            closeAllVideoFun()
-            this.loadData()
-          }
-        })
-      },
+            var params = qs.stringify({
+            id: this.id,
+            watermarkTemplateId: this.size
+            })
+            postAction('/ctop/materialInfo/watermark', params).then(res => {
+            if (res.success) {
+                // getAction("/ctop/videoWatermarkTask/list").then(res=>{
+                //     console.log(res)
+                // })
+                this.$message.success('水印素材生成中,请一分钟后刷新')
+                this.visibleDetail = false
+                this.refuseFile = []
+                this.refuseReason = ''
+                closeAllVideoFun()
+                this.loadData()
+            }
+            })
+        },
+
+        // 请求order详情数据
+        orderDetailHttp(){
+            this.pageSpinning=true;
+            getAction(this.url.orderDetail,{
+                id:this.currentOrderId
+            }).then(res=>{
+                console.log(res)
+                this.pageSpinning=false;
+                if(res.success){
+                    this.currentOrderInfo=res.result;
+                }
+            })
+        },
+        // 请求物料列表数据
+        
+
+        roleJudgement(role){
+            // 1 运营(不区分运营经理)
+            // 2 设计组长
+            // 3 设计
+            // 4 管理员
+            if(role.indexOf('operator')!=-1||role.indexOf('Operation')!=-1||role.indexOf('operation')!=-1){
+                return 1
+            }else if(rolethis.roleCode=='designTeamLeader'){
+                return 2
+            }else if(role=='planeLeader'||role=='production'||role=='plane'||role=='shot'||role=='clip'||role=='plan'){
+                return 3
+            }else if(role=='admin'){
+                return 4
+            }
+        },
     },
     created(){
+        
         getAction('/ctop/videoWatermarkTemplate/list').then(res => {
             if (res.success) {
-            this.sizeType = res.result.records
+                this.sizeType = res.result.records
             }
-        })
-    }
+        });
+
+        
+        
+    },
+    mounted() {
+       let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        console.log(this.$parent.orderId)
+        this.currentOrderId=this.$parent.orderId;
+        this.role=this.$parent.role;  
+        
+    },
+    activated() {
+        if(this.currentOrderId){
+            this.orderDetailHttp()
+        } 
+    },
 }
 </script>

+ 769 - 0
src/views/modules/workBench/orderList.vue

@@ -0,0 +1,769 @@
+
+<style lang="scss" scoped>
+.orderDetail{
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+   
+    width: 100%;
+    .topBody{
+        width: 100%;
+        background: #FFFFFF;
+        margin-bottom: 12px;
+        padding: 20px;
+        box-sizing: border-box;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .bottom{
+            display: flex;
+            position: relative;
+            justify-content: space-between;
+            // padding: 20px;
+            .orderIcon{
+                width: 28px;
+                height: 28px;
+                margin-right: 15px;
+                img{
+                    width: 100%;
+                }
+            }
+            .tip{
+                .greet{
+                    width: 300px;
+                    height: 28px;
+                    font-size: 20px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 28px;
+                    margin-bottom: 5px;
+                }
+                .descPosition{
+                    
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.45);
+                    overflow: hidden;
+                    margin-bottom: 0;
+                    li{
+                        height: 22px;
+                        line-height: 22px;
+                        margin-top:3px ;
+                    }
+                    span{
+                        width: 250px;
+                        display: inline-block;
+                    }
+                }
+
+            }
+            .optBody{
+                width: 200px;
+                flex-shrink:0;
+                // justify-content: flex-end;
+                text-align: right;
+                .btnBody{
+                    margin-bottom: 10px;
+                }
+                .orderInfo{
+                    display: flex;
+                    justify-content: space-between;
+                    text-align: right;
+                    p{
+                        margin-bottom: 0;
+                    }
+                    
+                    .markName{                        
+                        height: 22px;
+                        font-size: 14px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.45);
+                        line-height: 22px;
+                    }
+                    .big{                                               
+                        height: 28px;
+                        font-size: 20px;
+                        font-family: PingFangSC-Regular, PingFang SC;
+                        font-weight: 400;
+                        color: rgba(0, 0, 0, 0.85);
+                        line-height: 28px;
+                    }
+                }
+
+            }
+        }
+
+    }
+    .section{
+        background: white;
+        padding:20px ;
+        .breadcrumb{
+            height: 22px;
+            font-size: 12px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+            line-height: 22px;
+        }
+        .sectionBody{
+            
+            p{
+                margin-bottom: 0;
+            }
+            .section-item{
+                background: white;
+                margin-bottom: 20px;
+            }
+            .tabBox{
+                padding: 15px 20px 0;
+                display: flex;
+                flex-wrap: wrap;
+                position: relative;
+                .search-item{
+                    margin-bottom: 12px;
+                    width: 30%;
+                }
+                .opt-item{
+                    position: absolute;
+                    right: 20px;
+                    top: 16px;
+                }
+            }
+            .sectionHead{
+                padding: 15px 20px;
+                // height: 24px;
+                font-size: 16px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: rgba(0, 0, 0, 0.85);
+                line-height: 24px;
+                border-bottom: 1px solid  #E9E9E9;;
+                .allOrder{
+                    float: right;
+                }
+            }
+            .section-box{
+                margin-top: 30px;
+                padding: 20px 20px;
+                border: 1px solid #E9E9E9;
+                .description{
+                    margin-top: 10px;
+                    .time{
+                        height: 32px;
+                        line-height: 32px;
+                    }
+                }
+                ul{
+                    display: flex;
+                    flex-wrap: wrap;
+                    // justify-content: space-around;
+                }
+                li{
+                    
+                    width: 30%;
+                    height: 22px;
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: rgba(0, 0, 0, 0.85);
+                    line-height: 22px;
+                    text-align: left;
+                    margin-bottom: 15px;
+                }
+                .top{
+                    margin-bottom: 25px;
+                }
+                .bottom{
+                    h4{
+                        
+                        font-size: 15px;
+                        font-family: PingFangSC-Medium, PingFang SC;
+                        font-weight: 600;
+                        color: rgba(0, 0, 0, 0.85);
+                        margin-bottom: 25px;
+                    }
+                }
+                .shenhe{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #52C41A;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+
+                }
+                .wancheng{
+                    width: 6px;
+                    height: 6px;
+                     display: inline-block;
+                    background: #1890FF;
+                    border-radius: 50%;
+                    // margin-right: 3px;
+                    position: relative;
+                    top: -2px;
+                }
+                .bohui{
+                    width: 6px;
+                    height: 6px;
+                    display: inline-block;
+                    background: #F5222D;
+                    border-radius: 50%;
+                    position: relative;
+                    top: -2px;
+                }
+            }
+            
+        }
+    }
+}
+.videoBox{
+    width: 320px;
+    height: 180px;
+}
+.imgBox{
+    width: 100%;
+    height: 180px;
+}
+.marterialInfo{
+    
+    p{margin-bottom: 0;}
+    ul,li{
+        margin: 0;
+        padding: 0;
+    }
+    .info-item{
+        margin-bottom: 20px;
+        display: flex;
+        // justify-content: center;
+        align-items: center;
+        span{
+            display: inline-block;
+            width: 70px;
+            text-align: left;
+        }
+        .ant-tag{
+            width: auto;
+            min-width: 50px;
+            text-align: center;
+        }
+    }
+    .info{
+        ul{
+            display: flex;
+            justify-content: space-between;
+            flex-wrap: wrap;
+        }
+        li{
+            width: 33.3%;
+            margin-bottom: 20px;
+        }
+        margin-bottom: 0;
+    }
+    .bottom-btn{
+        width: 100%;
+        text-align: center;
+        position: absolute;
+        bottom: 20px;
+        left: 0;
+
+    }
+}
+</style>
+
+<style lang="less">
+    .orderDetail{
+        .ant-timeline-item-head{
+            background: rgb(240,242,245);
+        }
+        .muen{
+            cursor: pointer;
+        }
+        .muen:hover{
+            color: #1890ff;
+        }
+    }
+    
+    
+</style>
+<template>
+    <div class="orderDetail ">
+        
+        <div class="section">
+             <p class="breadcrumb">
+                <a-breadcrumb style="display:block;width:100%">
+                    <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
+                    <a-breadcrumb-item>订单列表</a-breadcrumb-item>
+                </a-breadcrumb>
+            </p>
+            <div class="sectionBody">
+                <div class="tabBody">
+                    <a-tabs v-model="activeKey" @change='tabChange'>
+                        <a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title"  >
+                            <!-- {{ pane.content }}{{pane.role+'-'+roleCode}} -->
+                        </a-tab-pane>
+                    </a-tabs>
+                </div>
+                <!-- 素材列表 -->
+                <div class="section-item">
+                    <div class="tabBox">
+                        
+                        <div class="search-item">
+                            <span>订单名称:</span>
+                            <a-input placeholder="请输入订单名称" allow-clear v-model="orderName" style="width:300px" />
+                        </div>
+                        <div class="search-item">
+                            <span>订单编号:</span>
+                            <a-input placeholder="请输入订单编号" allow-clear v-model="orderId" style="width:300px" />
+                        </div>
+                        
+
+                        <div class="search-item">
+                            <span>发起的人:</span>
+                            <a-input placeholder="请输入订单发起人" allow-clear v-model="orderSponsor" style="width:300px" />
+                        </div>
+                        <div class="opt-item">
+                            <a-button type='primary' @click="search" style="margin-right:20px">查询</a-button>
+                            <a-button type='default' @click="reset">查询</a-button>
+                        </div>
+                    </div>
+                        
+                    
+                    <div class="section-box">
+                         <a-table
+                            size="middle"
+                            :columns="columns"
+                            :dataSource="data"
+                            :pagination="ipagination"
+                            :loading="loading"
+                            @change="sort"
+                            style="word-break: break-all;"
+                            >
+                            <div slot="orderStatus" slot-scope="text" >
+                                <span class="wancheng" v-if="text==3"> </span>
+                                <span class="bohui" v-else-if="text==2||text==-1"> </span>
+                                <span class="shenhe" v-else> </span>
+                                {{text | handleOrderStatus}}
+                            </div>
+                            <span slot="options" slot-scope="text,record">
+                                <a href="javascript:;" @click="viewDetails(record)">详情</a>                                                           
+                            </span>
+                            <span slot="materialFinishTime" slot-scope="text">
+                                {{text||'-'}}                                                    
+                            </span>
+
+                        </a-table>
+                    </div>
+                    <a-drawer
+                    title="素材详情"
+                    width="640"
+                    :placement="placement"
+                    :closable="false"
+                    :visible="visible"
+                    @close="onClose"
+                    >
+                        <div class="videoBody">
+                            <div class="videoBox">
+                                <video :src="currentMaterial.src" ></video>
+                            </div>
+                            
+                            <div class="imgBox">
+                                <img src="" alt="">
+                                <img src="" alt="">
+                            </div>
+                        </div>
+                        <div class="marterialInfo">
+                            <div class="info-item">
+                                <span>素材状态:</span>
+                                <p>未审核</p>
+                            </div>
+                            <div class="info-item">
+                                <span>生成水印:</span>
+                                <a-select :defaultValue="4" v-model="size" style="width:70%;">
+                                    <a-select-option :value="item.id" :key="item.id" v-for="item of sizeType">{{
+                                        item.name
+                                    }}</a-select-option>
+                                </a-select>
+                                
+                            </div>
+                            <div class="info-item">
+                                <span>视频标签:</span>
+                                <a-tag>Tag 1</a-tag>
+                                <a-tag>Tag 1</a-tag>
+                            </div>
+                            <div class="info-item info">
+                                <ul>
+                                    <li><span>视频时长:</span> 17秒 </li>
+                                    <li><span>视频尺寸:</span> 1080*1920 </li>
+                                    <li><span>视频大小:</span> 31.42M </li>
+                                    <li><span>策划:</span> 吴永前 </li>
+                                    <li><span>拍摄:</span> 吴永前 </li>
+                                    <li><span>剪辑:</span> 吴永前 </li>                                    
+                                </ul>
+                            </div>
+                            <div class="info-item">
+                                <span>广告语:</span>
+                                <p>14354534324454354水电费水电费方式手动</p>
+                            </div>
+                            <div class="bottom-btn">
+                                <a-button type='primary' @click="approved" style="margin-right:20px">通过审核</a-button>
+                                <a-button type='default' @click="reject">驳回</a-button>
+                            </div>
+                        </div>
+                    </a-drawer>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
+import qs from 'qs'
+
+
+let listColumns=[
+    {
+        title: '订单名称',
+        dataIndex: 'orderTitle',
+        align: 'center',        
+        key: 'orderTitle',
+        scopedSlots: { customRender: 'orderTitle' }
+    },
+    {
+        title: '订单编号',
+        dataIndex: 'id',
+        align: 'center',        
+        key: 'tag',
+        scopedSlots: { customRender: 'id' }
+    },
+    {
+        title: '订单发起人',
+        dataIndex: 'status',
+        align: 'center',        
+        key: 'status',
+        scopedSlots: { customRender: 'status' }
+    },
+    {
+        title: '订单状态',
+        dataIndex: 'orderStatus',
+        align: 'center',        
+        key: 'orderStatus',
+        scopedSlots: { customRender: 'orderStatus' }
+    },
+    {
+        title: '更新时间',
+        dataIndex: 'materialFinishTime',
+        align: 'center',        
+        key: 'materialFinishTime',
+        scopedSlots: { customRender: 'materialFinishTime' }
+    },
+    {
+        title: '操作',
+        dataIndex: 'options',
+        align: 'center',        
+        key: 'options',
+        width:250,
+        scopedSlots: { customRender: 'options' }
+    },
+]
+
+
+export default {
+    name:'order-list',
+    data() {
+        const operatorPanes = [
+            { title: '全部订单', content: '', key: 4 , },
+            { title: '我发起的', content: '', key: 1 , },           
+            { title: '已完成的', content: '', key: 2 ,},
+            { title: '被驳回的', content: '', key: 3 , },
+
+        ];
+        const designLeaderPanes=[
+            { title: '全部订单', content: '', key: 4 , },
+            { title: '待确定的', content: '', key: 1 , },
+            { title: '待指派的', content: '', key: 2 , },
+            { title: '已完成的', content: '', key: 3 ,},
+            
+        ]
+        return {
+            operatorPanes,
+            designLeaderPanes,
+            userInfo:{},
+            roleCode:'',
+
+            panes:[],
+            activeKey: '4',
+            orderInfo:{ },
+
+            columns:[...listColumns],
+            data:[],
+            loading:false,
+            ipagination: {
+                current: 1,
+                pageSize: 10,
+                //   pageSizeOptions: ['10', '20', '30'],
+                showTotal: (total, range) => {
+                    return range[0] + "-" + range[1] + " 共" + total + "条"
+                },
+                showQuickJumper: true,
+                showSizeChanger:true,
+                pageSizeOptions: ['10', '30', '50'],
+                total: 0,
+                onChange: (current, pageSize) => {
+                    // 切换分页时的回调,
+                    // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+                    this.ipagination.current = current;
+                    this.ipagination.pageSize= pageSize;
+                }
+            },
+            // 订单进度
+            orderName:'',
+            orderId:'',
+            orderStatus:'',
+            orderParticipants:"",
+            orderSponsor:'',
+
+            visible: false,
+            placement: 'right',
+            currentMaterial:{},
+
+
+            sizeType:[],
+            size: "4",
+        }
+    },
+    methods: {
+        goPlantForm(){
+            if(this.$parent.role=='operator'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }else if(this.$parent.role=='designLeader'){
+                this.$parent.currentTabComponent='designleaderPlatform'
+            }else if(this.$parent.role=='design'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }
+        },
+        tabChange(key){
+            console.log(key)
+            this.tableHttp(key)
+        },
+        handleChange(value) {
+            console.log(`selected ${value}`);
+        },
+        
+        filterOption(input, option) {
+            return (
+                option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            );
+        },
+
+        // 查看详情
+        viewDetails(record){
+            console.log(record)
+            // this.$router.push(`/workBench/orderDetail?orderId=${record.id}`)
+            this.$parent.currentTabComponent='orderDetail';
+            this.$parent.orderId=record.id
+        },
+        
+        
+        // 撤回订单
+        withdrawOrder(){
+
+        },
+        // 更多操作
+        handleMenuClick(e) {
+            console.log('click', e);
+        },
+
+        // 催一下
+        hurryUp(record){
+            console.log(record)
+        },
+
+        // 验收
+        checkAccept(record){
+            console.log(record)
+        },
+        onClose() {
+            this.visible = false;
+        },
+        // 上传素材
+        uploadMaterial(){
+
+        },
+
+        sort(pagination, filters, sorter, { currentDataSource }){
+        
+            this.ipagination.current=pagination.current;
+
+            this.ipagination.pageSize=pagination.pageSize;
+            this.materialHttp()
+        },
+        // 请求素材
+        materialHttp(){
+            // this.loading=true;           
+            this.data=[];
+        },
+
+        
+
+        
+
+        // 素材通过审核
+        approved(){
+
+        },
+        // 素材驳回
+        reject(){
+
+        },
+        
+        search(){
+
+        },
+        reset(){
+            this.orderName='';
+            this.orderId='';
+            this.orderStatus='';
+            this.orderParticipants="";
+            this.orderSponsor='';
+        },
+
+        tableHttp(type){
+            let  params=this.handlerParams(type)
+            this.loading=true;
+            params={
+                ...params,
+                pageNo:this.ipagination.current,
+                pageSize:this.ipagination.pageSize
+            }
+            getAction('/platform/order/listByCreatorOrDesignLeader',params).then(res=>{
+                console.log(res);
+                this.loading=false;
+                if(res.success){
+                    this.data=res.result.records;
+                    this.ipagination.total=res.result.total;
+
+                }
+            })
+        },
+
+        handlerParams(status){
+            if(this.$parent.role=='operator'){
+                if(status==1){
+                    return {
+                        orderStatus:0,
+                        createBy:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        orderStatus:3,
+                        createBy:this.userInfo.id
+                    }
+                }else if(status==3){
+                    return {
+                        orderStatus:2,
+                        createBy:this.userInfo.id
+                    }
+                }else if(status==4){
+                    return {
+                        createBy:this.userInfo.id
+                    }
+                }   
+            }else if(this.$parent.role=='designLeader'){
+                if(status==1){
+                    return {
+                        orderStatus:0,
+                        design:this.userInfo.id
+                    }
+                }else if(status==2){
+                    return {
+                        orderStatus:1,
+                        design:this.userInfo.id
+                    }
+                }else if(status==3){
+                    return {
+                        orderStatus:3,
+                        design:this.userInfo.id
+                    }
+                }else if(status==4){
+                    return {
+                        design:this.userInfo.id
+                    }
+                }
+            }
+           
+        },
+        handlerParamsRole(role){
+            if(this.$parent.role=='operator'){
+                this.panes=this.operatorPanes
+            }else if(this.$parent.role=='designLeader'){
+                this.panes=this.designLeaderPanes
+            }
+        }
+    },
+    mounted(){
+        
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        console.log(this.$parent.orderStatus)
+        if(this.$parent.role=='operator'){
+            this.panes=this.operatorPanes
+        }else if(this.$parent.role=='designLeader'){
+            this.panes=this.designLeaderPanes
+        }
+        this.activeKey=this.$parent.orderStatus
+
+
+    },
+    filters:{
+        handleOrderStatus(val){
+            let text
+            switch (val) {
+                case 0:
+                    text='待接单'
+                    break;
+                case 1:
+                    text='已接单'
+                    break;
+                case 2:
+                    text='已驳回'
+                    break;
+                case 3:
+                    text='已完成'
+                    break;
+                case -1:
+                    text='已作废'
+                    break;
+            
+                default:
+                    text='出错'
+                    break;
+            }
+            return text
+        }
+    },
+    activated() {
+        if(this.$parent.role=='operator'){
+            this.panes=this.operatorPanes
+        }else if(this.$parent.role=='designLeader'){
+            this.panes=this.designLeaderPanes
+        }
+        this.activeKey=this.$parent.orderStatus
+        this.tableHttp(this.$parent.orderStatus)
+    },
+}
+</script>

+ 139 - 81
src/views/modules/workBench/placeOrder.vue

@@ -58,8 +58,11 @@
 
     }
     .section{
+        background: white;
         .sectionBody{
             // background: white;
+            width:960px;
+            margin: 0 auto ;
             margin-top: 20px;
             ul,
             li {
@@ -71,8 +74,8 @@
                 margin-bottom: 16px;
                 position: relative;
                 padding: 32px 24px 48px 32px;
-                border-radius: 4px;
-                box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
+                // border-radius: 4px;
+                // box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
                 .moduler-title {
                     display: flex;
                     align-items: center;
@@ -121,7 +124,7 @@
                     transform: translateY(-50%);
                 }
                 .row-item .input-item {
-                    min-width: 480px;
+                    min-width: 500px;
                     position: relative;
                     // height: 35px;
                     .tip {
@@ -158,6 +161,17 @@
         .ant-form-item {          
             margin-bottom: 0px; 
         }
+        .ant-radio-button-wrapper {
+            min-width: 80px;
+            text-align: center;
+            
+        }
+        .muen{
+            cursor: pointer;
+        }
+        .muen:hover{
+            color: #1890ff;
+        }
     }
 </style>
 <template>
@@ -165,7 +179,7 @@
         <div class="topBody">
              <p class="breadcrumb">
                 <a-breadcrumb style="display:block;width:100%">
-                    <a-breadcrumb-item><router-link to="/workBench">工作台</router-link></a-breadcrumb-item>
+                    <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
                     <a-breadcrumb-item>素材下单</a-breadcrumb-item>
                 </a-breadcrumb>
             </p>
@@ -194,15 +208,8 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                             <a-form-model-item ref="name"  prop="name">
-                               <a-input
-                                    v-model="form.name"
-                                    @blur="
-                                    () => {
-                                        $refs.name.onFieldBlur();
-                                    }
-                                    "
-                                />
+                             <a-form-model-item ref="orderTitle"  prop="orderTitle">
+                               <a-input    v-model="form.orderTitle" />
                             </a-form-model-item>
                         </div>
                     </div>
@@ -213,10 +220,10 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                             <a-form-model-item ref="designLeader"  prop="designLeader">
-                               <a-select  style="width: 300px" v-model="form.designLeader" mode="multiple" placeholder="请选择设计组长">
-                                    <a-select-option v-for="item in designLeaderList" :key="item.id" :value='item.value'>
-                                        {{item.title}}
+                             <a-form-model-item ref="design"  prop="design">
+                               <a-select  style="width: 500px" v-model="form.design" show-search  option-filter-prop="children" placeholder="请选择设计组长" :filter-option="filterOption">
+                                    <a-select-option v-for="item in designLeaderList" :key="item.userId" :value='item.userId'>
+                                        {{item.realname}}
                                     </a-select-option>
                                 </a-select>
                             </a-form-model-item>
@@ -229,10 +236,10 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                             <a-form-model-item ref="designLeader"  prop="designLeader">
-                               <a-select  style="width: 300px" v-model="form.associatedProject" mode="multiple" placeholder="请选择设计组长">
-                                    <a-select-option v-for="item in associatedProjectList" :key="item.id" :value='item.value'>
-                                        {{item.title}}
+                             <a-form-model-item ref="project"  prop="project">
+                               <a-select  style="width: 500px" v-model="form.project" show-search  option-filter-prop="children" placeholder="请选择关联项目">
+                                    <a-select-option v-for="item in projectList" :key="item.projectId" :value='item.projectId'>
+                                        {{item.projectName+'_'+ (item.mediaId==1?'头条':'快手')+'_'+ item.userName}}
                                     </a-select-option>
                                 </a-select>
                             </a-form-model-item>
@@ -245,31 +252,24 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="deliverySystem"  prop="deliverySystem">
-                                <a-radio-group v-model="form.deliverySystem" @change="deliverySystemChange">
-                                     <a-radio-button value="NONE">不限</a-radio-button>
-                                    <a-radio-button value="IOS">IOS</a-radio-button>
-                                    <a-radio-button value="ANDROID">安卓</a-radio-button> 
+                            <a-form-model-item ref="sysName"  prop="sysName">
+                                <a-radio-group v-model="form.sysName" @change="sysNameChange">
+                                     <a-radio-button :value="3">不限</a-radio-button>
+                                    <a-radio-button :value="1">IOS</a-radio-button>
+                                    <a-radio-button :value="2">安卓</a-radio-button> 
                                 </a-radio-group>
                             </a-form-model-item>
                         </div>
                     </div>
-                    <div class="row-item" v-if="form.deliverySystem=='ANDROID'">
+                    <div class="row-item" v-if="form.sysName==2">
                         <div class="hint-item"></div>
                         <div class="label-item">
                             <div class="text-item">APK链接</div>
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="APKLink"  prop="APKLink">
-                                <a-input
-                                    v-model="form.APKLink"
-                                    @blur="
-                                    () => {
-                                        $refs.APKLink.onFieldBlur();
-                                    }
-                                    "
-                                />
+                            <a-form-model-item ref="sysPackage"  prop="sysPackage">
+                                <a-input v-model="form.sysPackage"/>
                             </a-form-model-item>
                         </div>
                     </div>
@@ -280,8 +280,8 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="APKLink"  prop="APKLink">
-                                <a-range-picker v-model="form.dataValue" />
+                            <a-form-model-item ref="dataValue"  prop="dataValue">
+                                <a-range-picker v-model="form.dataValue" :disabled-date="disabledDate" />
                             </a-form-model-item>
                         </div>
                     </div>
@@ -292,8 +292,8 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="totalMaterial"  prop="totalMaterial">
-                                <a-input-number :min="1" :max="500"  @change="totalMaterialChange" v-model="form.totalMaterial" />
+                            <a-form-model-item ref="materialAmount"  prop="materialAmount">
+                                <a-input-number :min="1" :max="500"  @change="materialAmountChange" v-model="form.materialAmount" />
                             </a-form-model-item>
                         </div>
                     </div>
@@ -304,8 +304,8 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="averageDayMaterial"  prop="averageDayMaterial">
-                                <a-input-number :min="1" :max="500"  @change="averageDayMaterialChange" v-model="form.averageDayMaterial" />
+                            <a-form-model-item ref="materialAmountDay"  prop="materialAmountDay">
+                                <a-input-number :min="1" :max="500"  @change="materialAmountDayChange" v-model="form.materialAmountDay"  />
                             </a-form-model-item>
                         </div>
                     </div>
@@ -318,36 +318,35 @@
                         <div class="input-item"> 
                             <a-form-model-item ref="materialType"  prop="materialType">
                                 <a-radio-group v-model="form.materialType" @change="materialTypeChange">
-                                    <a-radio-button value="NONE">不限</a-radio-button>
-                                    <a-radio-button value="REALPEOPLE">真人</a-radio-button>
-                                    <a-radio-button value="CLIP">剪辑</a-radio-button>
-                                    <a-radio-button value="COMBINATION">组合</a-radio-button>
+                                    <a-radio-button :value="1">真人</a-radio-button>
+                                    <a-radio-button :value="2">剪辑</a-radio-button>
+                                    <a-radio-button :value="3">组合</a-radio-button>
                                                                       
                                 </a-radio-group>
                             </a-form-model-item>
                         </div>
                     </div>
-                    <div class="row-item" v-if="form.materialType=='COMBINATION'">
+                    <div class="row-item" v-if="form.materialType==3">
                         <div class="hint-item"></div>
                         <div class="label-item">
                             <div class="text-item">真人数量</div>
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="realPeoleNum"  prop="realPeoleNum">
-                                 <a-input-number :min="1" :max="500"  @change="averageDayMaterialChange" v-model="form.realPeoleNum" />
+                            <a-form-model-item ref="realAmount"  prop="realAmount">
+                                 <a-input-number :min="1" :max="500"  @change="realAmountChange" v-model="form.realAmount" />
                             </a-form-model-item>
                         </div>
                     </div>
-                    <div class="row-item" v-if="form.materialType=='COMBINATION'">
+                    <div class="row-item" v-if="form.materialType==3">
                         <div class="hint-item"></div>
                         <div class="label-item">
                             <div class="text-item">剪辑数量</div>
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="clipNum"  prop="clipNum">
-                                 <a-input-number :min="1" :max="500"  @change="averageDayMaterialChange" v-model="form.clipNum" />
+                            <a-form-model-item ref="cutAmount"  prop="cutAmount">
+                                 <a-input-number :min="1" :max="500"  @change="materialAmountDayChange" v-model="form.cutAmount" />
                             </a-form-model-item>
                         </div>
                     </div>
@@ -358,9 +357,9 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="orderNote"  prop="orderNote">
+                            <a-form-model-item ref="orderRemark"  prop="orderRemark">
                                 <a-textarea
-                                    v-model="form.orderNote"
+                                    v-model="form.orderRemark"
                                     placeholder="请输入订单备注"
                                     :auto-size="{ minRows: 3,  }"
                                 />
@@ -374,7 +373,7 @@
                             <div class="required-item"></div>
                         </div>
                         <div class="input-item"> 
-                            <a-form-model-item ref="orderNote"  prop="orderNote">
+                            <a-form-model-item ref="orderRemark"  prop="orderRemark">
                                 <a-upload
                                     action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                                     :default-file-list="defaultFileList"
@@ -389,7 +388,7 @@
                     <!-- <div class="moduler-title">计划名称</div> -->
                     <div class="opt">
                         <a-button type="default" style="margin-right:15px" @click="goBack">取消</a-button>
-                        <a-button type="primary"  style="margin-right:15px" @click="saveHandler" :loading="saveLoading">保存</a-button>
+                        <a-button type="primary"  style="margin-right:15px" @click="saveHandler" :loading="saveLoading">下单</a-button>
                     </div>
                 </div>   
                 </a-form-model>
@@ -408,38 +407,39 @@ export default {
             defaultFileList:[],
             saveLoading:false,
             form: {
-                name: '',               
-                designLeader:undefined,
-                associatedProject:undefined,
-                deliverySystem:'NONE',
-                APKLink:'',
+                orderTitle: '',               
+                design:undefined,
+                project:undefined,
+                sysName:3,
+                sysPackage:'',
                 dataValue:[],
-                totalMaterial:undefined,
-                averageDayMaterial:undefined,
-                materialType:'NONE',
-                realPeoleNum:undefined,
-                clipNum:undefined,
-                orderNote:'',
+                materialAmount:undefined,
+                materialAmountDay:undefined,
+                materialType:1,
+                realAmount:undefined,
+                cutAmount:undefined,
+                orderRemark:'',
 
             },
             rules: {
-                name: [
-                    { required: true, message: '请填写规则的具体名称', trigger: 'blur' },
+                orderTitle: [
+                    { required: true, message: '请填写订单名称', trigger: 'blur' },
                     { min: 2, message: '长度不得小于2', trigger: 'blur' },
                 ],
-                APKLink: [
+                sysPackage: [
                     { required: true, message: '请输入APK链接', trigger: 'blur' },
                     { min: 2, message: '长度不得小于2', trigger: 'blur' },
                 ],
                 dataValue: [{ required: true, message: '请选择订单周期', trigger: 'change' }],
-                applyRange: [{ required: true, message: '请选择具体应用范围', trigger: 'change' }],
-                applyAccount: [{required: true, message: '请选择具体应用范围', trigger: 'change' }],
-                specificMoment: [{required: true, message: '请选择具体时刻', trigger: 'change' }],
+                materialAmount: [{ required: true, message: '素材总数必须大于1', trigger: 'change' }],
+                materialAmountDay: [{required: true, message: '日均产量必须填写', trigger: 'change' }],
+                project: [{required: true, message: '必须选择关联项目', trigger: 'change' }],
+                design: [{required: true, message: '必须选择设计组长', trigger: 'change' }],
                
             },
             // 操作记录
             designLeaderList:[],
-            associatedProjectList:[],
+            projectList:[],
 
             // 本周项目燃尽图
             burnDownChart:[],
@@ -447,10 +447,28 @@ export default {
             // 分页参数
             totalPage:0,
             currentPage:1,
-
+            userInfo:{},
+            roleCode:''
         }
     },
     methods: {
+        goPlantForm(){
+            if(this.$parent.role=='operator'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }else if(this.$parent.role=='designLeader'){
+                this.$parent.currentTabComponent='designleaderPlatform'
+            }else if(this.$parent.role=='design'){
+                this.$parent.currentTabComponent='operatorPlatform'
+            }
+        },
+        disabledDate(current) {
+            return current && current < moment().subtract(1,'days')
+        },
+        filterOption(input, option) {
+            return (
+                option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            );
+        },
         // 附件上传的方法
         handleChange({ file, fileList }) {
         if (file.status !== 'uploading') {
@@ -475,19 +493,23 @@ export default {
         pageChange(page, pageSize){
 
         },
-        deliverySystemChange(val){
+        sysNameChange(val){
             console.log(val);
-            this.form.APKLink='';
+            this.form.sysPackage='';
         },
-        totalMaterialChange(e){
-            console.log(e.target.value)
+        materialAmountChange(e){
+            console.log(e)
         },
-        averageDayMaterialChange(){
+        materialAmountDayChange(e){
 
         },
         materialTypeChange(val){
 
         },
+        realAmountChange(e){
+            console.log(e);
+            this.form.cutAmount=this.form.materialAmount-this.form.realAmount
+        },
         goBack() {
             this.$router.replace('/autoRules')
             this.$bus.$emit('remove', '/newBlankRule')
@@ -497,8 +519,25 @@ export default {
         saveHandler(){
              this.$refs.ruleForm.validate(valid=> {
                 if (valid) {
-                    this.form.rulesList=this.rulesList;
+                    
                     console.log(valid,this.form);
+                    let params={
+                        ...this.form,
+                        createBy:this.userInfo.id,
+                        startDate:this.form.dataValue[0].format('YYYY-MM-DD'),
+                        endDate:this.form.dataValue[1].format('YYYY-MM-DD'),
+                    };
+
+                    
+                    postAction('/platform/operator/payout',params).then(res=>{
+                        console.log(res);
+                        if(res.success){
+                             this.$router.push('/workBench')
+                            this.$bus.$emit('remove', '/workBench/placeOrder')
+                        }else{
+                            this.$message.error(res.success)
+                        }
+                    })
 
                 } else {
                     console.log('error submit!!');
@@ -507,6 +546,25 @@ export default {
             });
         },
     },
+
+    mounted(){
+        let userInfo=localStorage.getItem('pro__Login_Userinfo');
+        if(userInfo){
+            this.userInfo=JSON.parse(userInfo).value
+        }
+        this.roleCode=localStorage.getItem('roleCode')
+        getAction('/platform/query/designLeader',{}).then(res=>{
+            console.log(res);
+            this.designLeaderList=res.result
+        })
+
+        getAction('/ctop/projectMember/participateList',{
+            userId:this.userInfo.id,
+        }).then(res=>{
+            console.log(res);
+            this.projectList=res.result
+        })
+    },
 }
 </script>
 

+ 121 - 13
src/views/modules/yard/YardList.vue

@@ -54,13 +54,14 @@
     <!-- 操作按钮区域 -->
     <div class="table-operator">
       <a-button @click="handleAdd" v-show="show" type="primary" icon="plus">新增</a-button>
+      <a-pagination showQuickJumper :total="ipagination.total" v-model="ipagination.current" style="float:right" @change="totalpageChange" :pageSize.sync="ipagination.pageSize" />
     </div>
 
     <!-- table区域-begin -->
     <div>
-      <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
+      <!-- <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
         :pagination="ipagination" :loading="loading">
-        <!-- 字符串超长截取省略号显示-->
+        
         <span slot="esContent" slot-scope="text">
           <j-ellipsis :value="text" :length="10" />
         </span>
@@ -77,12 +78,39 @@
               <a-menu-item v-show="show">
                 <a @click="handleEdit(record)">编辑</a>
               </a-menu-item>
+              <a-menu-item v-show="show">
+                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
+                  <a>删除</a>
+                </a-popconfirm>
+              </a-menu-item>
             </a-menu>
           </a-dropdown>
           <a-divider type="vertical" />
           <a href="javascript:;" @click="showDetail(record)">场地信息</a>
         </span>
-      </a-table>
+      </a-table> -->
+
+
+      <a-row class="image-list" :gutter="16" style="padding:0 8px">
+      <a-col :lg="6" :sm="12" class="vm-margin" style="padding:0"  v-for="(item, index) of dataSource" :key="index" >
+          <vm-card
+          style="margin: 0 15px;"
+          :editable="true"
+          :title="item.buildingName"
+          :img="item.coverUrl"
+          :desc="item.address"
+          :detailUrl="item.videoUrl"
+          :editUrl="item.editUrl"      
+          pageTitle='场地列表'   
+          :id="item.id"
+          :record="item"          
+          @delete-ok="deleteOk(item)"
+          @showDetail='showDetail(item)'
+          @editDetail='handleEdit(item)'
+          @updateList='updateList(1)'
+        ></vm-card>
+      </a-col>
+    </a-row>
     </div>
     <!-- table区域-end -->
 
@@ -92,6 +120,7 @@
     </a-modal>
     <a-modal title="详情" v-model="detail" class="ping" :footer="null" :width="800" style="overflow:hidden">
       <a-tabs defaultActiveKey="1" @change="callback" v-model="indexDetail">
+        
         <a-tab-pane tab="场地图集" key="1" forceRender>
           <div>
             <a type="primary" style="margin-left:10px" @click="addPhoto=true">新增场地图片</a>
@@ -99,7 +128,7 @@
               <li v-for="(item,index) of photoList" :key="index" @click="showImage(item)">
                 <a-icon type="close-circle"
                   style="position:absolute;top:-5px;right:-5px;color:red;z-index:10;cursor: pointer;"
-                  @click="deteleImg(item.id)" />
+                  @click.stop="deteleImg(item.id)" />
                 <img :src="item.photoUrl" alt />
               </li>
             </ul>
@@ -108,7 +137,31 @@
             <a-pagination showQuickJumper size="small" :total="total" @change="pageChange" :pageSize.sync="pageSize" />
           </div>
         </a-tab-pane>
-        <a-tab-pane tab="场地视频" key="2">
+        <a-tab-pane tab="场地信息" key="2">
+          <div style="display:flex;flex-direction:row;height:300px;">
+            <div
+              style="height:200px;width:30%;border:1px solid #f2f2f2;"
+              :style="{backgroundImage: imageUrl?'url(' +imageUrl+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
+            ></div>
+            <div style="flex:1;margin:15px">
+              <a-form >
+                <a-form-item label="场地名称" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{currentYard.buildingName}}</span>
+                </a-form-item>
+                <a-form-item label="场地地址" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{currentYard.address}}</span>
+                </a-form-item>
+                <a-form-item label="联系人名" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{currentYard.contactName}}</span>
+                </a-form-item>
+                <a-form-item label="联系电话" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
+                  <span>{{currentYard.contactMobile}}</span>
+                </a-form-item>
+              </a-form>
+            </div>
+          </div>
+        </a-tab-pane>
+        <a-tab-pane tab="场地视频" key="3">
           <div>
             <a type="primary" style="margin-left:10px" @click="addVideo=true">新增场地视频</a>
             <ul class="actor-photo-list">
@@ -131,14 +184,14 @@
 
     <!-- 新增图集 -->
     <a-modal v-model="addPhoto" title="新增图集" @ok="handleOk('photo')" @cancel="handleCancel('photo')">
-        <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" />
+        <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" :sizeCheck="false"/>
       <!-- <upload-to-ali style="margin:10px" v-model="imageUrl" :customDomain="customDomain" preview :region="region"
         :bucket="bucket" :accept="acceptImage" :max="1" :size="1024000" :accessKeyId="accessKeyId"
         :accessKeySecret="accessKeySecret"></upload-to-ali> -->
     </a-modal>
     <!-- 新增作品 -->
     <a-modal v-model="addVideo" title="新增作品" @ok="handleOk('video')" @cancel="handleCancel('video')">
-        <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false" />
+        <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false"  :sizeCheck="false"/>
       <!-- <upload-to-ali style="margin:10px" v-model="videoUrl" :customDomain="customDomain" preview :region="region"
         :bucket="bucket" :accept="acceptVideo" :max="1" :size="1024000" :accessKeyId="accessKeyId"
         :accessKeySecret="accessKeySecret"></upload-to-ali> -->
@@ -151,6 +204,7 @@
 <script>
   import YardModal from './modules/YardModal'
   import yardDetail from './modules/yardDetail'
+  import VmCard from '@/components/ctop/vm-card'
   import {
     JeecgListMixin
   } from '@/mixins/JeecgListMixin'
@@ -163,7 +217,8 @@
     yardPhotoDelete,
     yardVideoDelete,
     yardPhotoAdd,
-    yardVideoAdd
+    yardVideoAdd,
+    yardListDelete
   } from '@/api/yard'
   export default {
     name: 'YardList',
@@ -172,10 +227,31 @@
       JEllipsis,
       YardModal,
       UploadToAli,
-      uploadFile
+      uploadFile,
+      VmCard
     },
     data() {
       return {
+        ipagination: {
+            current: 1,
+            pageSize: 8,
+            //   pageSizeOptions: ['10', '20', '30'],
+            showTotal: (total, range) => {
+                return range[0] + "-" + range[1] + " 共" + total + "条"
+            },
+            showQuickJumper: true,
+            showSizeChanger:true,
+            pageSizeOptions: ['10', '30', '50'],
+            total: 0,
+            onChange: (current, pageSize) => {
+                // 切换分页时的回调,
+                // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
+                this.ipagination.current = current;
+                this.ipagination.pageSize= pageSize;
+            }
+        },
+
+        noImgUrl:require('@/assets/img/noImg.png'),
         queryParam: {},
         description: '场地管理',
         // 新增修改按钮是否显示
@@ -223,7 +299,8 @@
           }
         ],
         url: {
-          list: '/ctop/yard/list'
+          list: '/ctop/yard/list',
+          delete:'/ctop/yard/delete',
         },
         detail: false,
         indexDetail: '1',
@@ -245,13 +322,20 @@
         accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
         addPhoto: false,
         addVideo: false,
-        confirmLoading: true
+        confirmLoading: true,
+        currentYard:{},
       }
     },
 
     methods: {
+      totalpageChange(page){
+        console.log(page)
+        this.ipagination.current=page;
+        this.loadData(this.ipagination.current)
+      },
       showDetail(item) {
         console.log(item)
+        this.currentYard=item
         this.detail = true
         this.id = item.id
         // this.currentPage = 1
@@ -264,7 +348,7 @@
         if (key == '1') {
           this.currentPage = 1
           this.getPhoto()
-        } else if (key == '2') {
+        } else if (key == '3') {
           this.currentPage = 1
           this.getVideo()
         }
@@ -376,7 +460,31 @@
             this.getVideo()
           }
         })
-      }
+      },
+
+      deleteOk: function (data) {
+        console.log('最外层deleteFn执行',data)
+        yardListDelete({
+          id:data.id
+        }).then(res=>{
+          if(res.success){
+            this.$message.success('删除成功')
+            for (let i = 0; i < this.dataSource.length; i++) {
+              if (this.dataSource[i].id === data.id) {
+                this.dataSource.splice(i, 1)
+              }
+            }
+            // this.getActorList(data.page)
+          }else{
+            this.$message.error('删除失败,稍后再试')
+          }
+          
+        })
+      },
+      updateList(page){
+        this.totalpageChange(page)
+      },
+      
     }
   }
 </script>

+ 117 - 171
src/views/modules/yard/modules/YardModal.vue

@@ -6,82 +6,31 @@
     :confirmLoading="confirmLoading"
     @ok="handleOk"
     @cancel="handleCancel"
-    cancelText="关闭">
-
+    cancelText="关闭"
+  >
     <a-spin :spinning="confirmLoading">
       <a-form :form="form">
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="场地名称">
-          <a-input placeholder="请输入场地名称" v-decorator="['buildingName']"/>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="场地名称">
+          <a-input placeholder="请输入场地名称" v-decorator="['buildingName']" />
         </a-form-item>
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="地址">
-          <a-input placeholder="请输入地址" v-decorator="['address']"/>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="地址">
+          <a-input placeholder="请输入地址" v-decorator="['address']" />
         </a-form-item>
-        <a-form-item
-          label="照片"
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-        >
-        <uploadFile v-if="visible" :value.sync="imageUrl" :fileCount="10" uploadType="image" />
-          <!-- <upload-to-ali
-            v-model="imageUrl"
-            :customDomain="customDomain"
-            multiple
-            preview
-            :region="region"
-            :bucket="bucket"
-            :accept="acceptImage"
-            :max="10"
-            :size="1024000"
-            :accessKeyId="accessKeyId"
-            :accessKeySecret="accessKeySecret"
-          ></upload-to-ali> -->
+        <a-form-item label="照片" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <uploadFile v-if="visible" :value.sync="imageUrl" :fileCount="10" uploadType="image" :sizeCheck="false"/>
         </a-form-item>
-        <a-form-item
-          label="视频"
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-        >
-
-         <uploadFile  v-if="visible" :value.sync="videoUrl" :fileCount="1" uploadType="video" />
-          <!-- <upload-to-ali
-            v-model="videoUrl"
-            :customDomain="customDomain"
-            multiple
-            preview
-            :region="region"
-            :bucket="bucket"
-            :accept="acceptVideo"
-            :max="10"
-            :size="1024000"
-            :accessKeyId="accessKeyId"
-            :accessKeySecret="accessKeySecret"
-          ></upload-to-ali> -->
+        <a-form-item label="视频" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <uploadFile v-if="visible" :value.sync="videoUrl" :fileCount="10" uploadType="video" :sizeCheck="false"/>
         </a-form-item>
 
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="联系人姓名">
-          <a-input placeholder="请输入联系人姓名" v-decorator="['contactName']"/>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="联系人姓名">
+          <a-input placeholder="请输入联系人姓名" v-decorator="['contactName']" />
         </a-form-item>
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="联系人电话">
-          <a-input placeholder="请输入联系人电话" v-decorator="['contactMobile']"/>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="联系人电话">
+          <a-input placeholder="请输入联系人电话" v-decorator="['contactMobile']" />
         </a-form-item>
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label="备注">
-          <a-input placeholder="请输入备注" v-decorator="['remark']"/>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注">
+          <a-input placeholder="请输入备注" v-decorator="['remark']" />
         </a-form-item>
       </a-form>
     </a-spin>
@@ -89,122 +38,119 @@
 </template>
 
 <script>
-  import {httpAction} from '@/api/manage'
-  import pick from 'lodash.pick'
-  import JTreeSelect from '@/components/jeecg/JTreeSelect'
-  import moment from 'moment'
-  import UploadToAli from '@femessage/upload-to-ali'
-  import uploadFile from '@/components/uploadFile.vue'
-  export default {
-    name: "YardModal",
-    components: {
-      UploadToAli,
-      JTreeSelect,
-      uploadFile
-    },
-    data() {
-      return {
-        title: "操作",
-        visible: false,
-        model: {},
-        videoUrl: [],
-        imageUrl: [],
-        customDomain: '',
-        region: 'oss-cn-beijing',
-        bucket: 'ctop-media',
-        acceptVideo: 'video/mpeg,video/mp4',
-        acceptImage: 'image/jpeg,image/jpg,image/png',
-        accessKeyId: 'LTAIbNbqWzSOklQV',
-        accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
-        dateFormat: "YYYY-MM-DD",
-        labelCol: {
-          xs: {span: 24},
-          sm: {span: 5},
-        },
-        wrapperCol: {
-          xs: {span: 24},
-          sm: {span: 16},
-        },
+import { httpAction } from '@/api/manage'
+import pick from 'lodash.pick'
+import JTreeSelect from '@/components/jeecg/JTreeSelect'
+import moment from 'moment'
+import UploadToAli from '@femessage/upload-to-ali'
+import uploadFile from '@/components/uploadFile.vue'
+export default {
+  name: 'YardModal',
+  components: {
+    UploadToAli,
+    JTreeSelect,
+    uploadFile,
+  },
+  data() {
+    return {
+      title: '操作',
+      visible: false,
+      model: {},
+      videoUrl: [],
+      imageUrl: [],
+      customDomain: '',
+      region: 'oss-cn-beijing',
+      bucket: 'ctop-media',
+      acceptVideo: 'video/mpeg,video/mp4',
+      acceptImage: 'image/jpeg,image/jpg,image/png',
+      accessKeyId: 'LTAIbNbqWzSOklQV',
+      accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
+      dateFormat: 'YYYY-MM-DD',
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
 
-        confirmLoading: false,
-        form: this.$form.createForm(this),
+      confirmLoading: false,
+      form: this.$form.createForm(this),
 
-        url: {
-          add: "/ctop/yard/add",
-          edit: "/ctop/yard/edit",
-        },
-      }
+      url: {
+        add: '/ctop/yard/add',
+        edit: '/ctop/yard/edit',
+      },
+    }
+  },
+  created() {},
+  methods: {
+    add() {
+      this.edit({})
     },
-    created() {
+    edit(record) {
+      let that = this
+      that.form.resetFields()
+      that.model = Object.assign({}, record)
+      that.visible = true
+      this.imageUrl = record.imageUrl ? record.imageUrl : []
+      this.videoUrl = record.videoUrl ? record.videoUrl : []
+      that.$nextTick(() => {
+        that.form.setFieldsValue(pick(this.model, 'buildingName', 'contactName', 'contactMobile', 'address', 'remark'))
+        //时间格式化
+      })
     },
-    methods: {
-      add() {
-        this.edit({});
-      },
-      edit(record) {
+    close() {
+      this.$emit('close')
+      this.visible = false
+    },
+    moment,
+    handleOk() {
+      const that = this
+      // 触发表单验证
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          that.confirmLoading = true
+          let httpurl = ''
+          let method = ''
+          if (!this.model.id) {
+            httpurl += this.url.add
+            method = 'post'
+          } else {
+            httpurl += this.url.edit
+            method = 'put'
+          }
 
-        let that = this;
-        that.form.resetFields();
-        that.model = Object.assign({}, record);
-        that.visible = true;
-        that.$nextTick(() => {
-          that.form.setFieldsValue(pick(this.model, 'buildingName', 'contactName', 'contactMobile','address','remark','imageUrl','videoUrl'))
+          values.imageUrl = this.imageUrl
+          values.videoUrl = this.videoUrl
+          values.coverUrl = this.imageUrl[0]
+          let formData = Object.assign(this.model, values)
           //时间格式化
-        });
-
-      },
-      close() {
-        this.$emit('close');
-        this.visible = false;
-      },
-      moment,
-      handleOk() {
-        const that = this;
-        // 触发表单验证
-        this.form.validateFields((err, values) => {
-          if (!err) {
-            that.confirmLoading = true;
-            let httpurl = '';
-            let method = '';
-            if (!this.model.id) {
-              httpurl += this.url.add;
-              method = 'post';
-            } else {
-              httpurl += this.url.edit;
-              method = 'put';
-            }
 
-            values.imageUrl = this.imageUrl;
-            values.videoUrl = this.videoUrl;
-            let formData = Object.assign(this.model, values);
-            //时间格式化
-
-            console.log(formData)
-            httpAction(httpurl, formData, method).then((res) => {
+          console.log(formData)
+          httpAction(httpurl, formData, method)
+            .then((res) => {
               if (res.success) {
-                that.$message.success(res.message);
-                that.$emit('ok');
+                that.$message.success(res.message)
+                that.$emit('ok')
               } else {
-                that.$message.warning(res.message);
+                that.$message.warning(res.message)
               }
-            }).finally(() => {
-              that.confirmLoading = false;
-              that.close();
             })
-
-
-          }
-        })
-      },
-      handleCancel() {
-        this.close()
-      },
-
-
-    }
-  }
+            .finally(() => {
+              that.confirmLoading = false
+              that.close()
+            })
+        }
+      })
+    },
+    handleCancel() {
+      this.close()
+    },
+  },
+}
 </script>
 
 <style lang="less" scoped>
-
 </style>

+ 2 - 4
src/views/modules/yard/modules/yardDetail.vue

@@ -103,7 +103,7 @@ li {
       @ok="handleOk('photo')"
       @cancel="handleCancel('photo')"
     >
-     <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false" />
+     <uploadFile :value.sync="imageUrl" :fileCount="1" uploadType="image" :multiple="false"  :sizeCheck="false"/>
       <!-- <upload-to-ali
         style="margin:10px"
         v-model="imageUrl"
@@ -125,7 +125,7 @@ li {
       @ok="handleOk('video')"
       @cancel="handleCancel('video')"
     >
-    <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false" />
+    <uploadFile :value.sync="videoUrl" :fileCount="1" uploadType="video" :multiple="false"  :sizeCheck="false"/>
       <!-- <upload-to-ali
         style="margin:10px"
         v-model="videoUrl"
@@ -149,11 +149,9 @@ import {
 } from '@/api/actor'
 import UploadToAli from '@femessage/upload-to-ali'
 import uploadFile from '@/components/uploadFile.vue'
-import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import { closeAllVideoFun } from '@/utils/videoControl'
 export default {
   name: 'VmCard',
-  mixins: [JeecgListMixin],
   components: {
     UploadToAli,
     uploadFile

+ 243 - 25
src/views/playerPart/playerList.vue

@@ -49,7 +49,10 @@
           :loading="loading"
         >
           <span slot="action" slot-scope="text, record">
-            <a @click="preview(record)">替换素材</a>
+            <a @click="downloadZip(record)">导出</a>
+
+            <a-divider type="vertical" />
+            <a @click="changeView(record)">替换素材</a>
 
             <a-divider type="vertical" />
             <a @click="preview(record)">预览</a>
@@ -108,33 +111,91 @@
     <a-modal
       title="替换素材"
       :visible="changeVisible"
-      @cancel="handleCancel"
+      @cancel="changeVisible = false"
       :width="1000"
-      @ok="saveFile"
-      :confirm-loading="confirmLoading"
+      @ok="changeFile"
+      :confirm-loading="changeLoading"
     >
-      <a-form :form="form">
-        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="模板所属账户">
-          <Treeselect :appId.sync="appId" :multiple="false" request="1,3" ref="treeSelect" style="width: 100%" />
-        </a-form-item>
-        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="模板类型">
-          <a-input
-            placeholder="请输入模板类型"
-            v-decorator.trim="['fileType', { rules: [{ required: true, message: '请输入模板类型' }] }]"
-          />
-        </a-form-item>
-        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="模板文件">
+      <a-list class="demo-loadmore-list" :loading="loading" item-layout="horizontal" :data-source="dataList">
+        <!-- <a-list-item slot="renderItem" slot-scope="item, index"> -->
+        <a-list-item-meta style="margin-bottom: 10px">
+          <a slot="title">是否重新生成</a>
+          <div slot="description">
+            <a-radio-group v-model="create" button-style="solid">
+              <a-radio-button value="1"> 是 </a-radio-button>
+              <a-radio-button value="2"> 否 </a-radio-button>
+            </a-radio-group>
+          </div>
+        </a-list-item-meta>
+        <a-list-item-meta v-if="create == '1'">
+          <a slot="title">请输入试玩名称(不填默认拼接时间)</a>
+          <div slot="description">
+            <a-input placeholder="请输入试玩名称" v-model="fileName" />
+          </div>
+        </a-list-item-meta>
+
+        <!-- </a-list-item> -->
+        <a-list-item slot="renderItem" slot-scope="item, index">
           <a-upload
             name="file"
             action="http://192.168.1.251/jeecg-boot"
-            :customRequest="customRequest"
+            :customRequest="customRequestChange"
+            :beforeUpload="beforeUpload"
             :fileList="defaultFileList"
+            slot="actions"
+            v-if="item.fileSuffix == 'png' || item.fileSuffix == 'jpg' || item.fileSuffix == 'gif'"
           >
-            <a-button> <a-icon type="upload" /> Click to Upload </a-button>
+            <a @click="getIndex(item, index)">替换素材</a>
           </a-upload>
-          <!-- <input type="file" @change="customRequest"> -->
-        </a-form-item>
-      </a-form>
+
+          <a-list-item-meta v-if="item.fileSuffix == 'png' || item.fileSuffix == 'jpg' || item.fileSuffix == 'gif'">
+            <a slot="title"
+              >{{ item.fileName }} (请上传大小为{{ item.width + '*' + item.height }}的图片,格式为{{
+                item.fileSuffix
+              }})</a
+            >
+            <div
+              slot="description"
+              style="width: 300px; background: rgba(0, 0, 0, 0.5); display: flex; justify-content: center"
+            >
+              <img :src="item.fileUrl" alt="" style="width: 50%; heihgt: auto; margin: 0 auto" />
+              <img
+                :src="item.imgPviewsUrl"
+                v-if="item.imgPviewsUrl"
+                alt=""
+                style="width: 50%; heihgt: auto; margin: 0 auto"
+              />
+            </div>
+          </a-list-item-meta>
+          <!-- <a-list-item-meta v-else-if="item.fileSuffix == 'mp3'">
+            <a slot="title">{{ item.fileName }}</a>
+            <div
+              slot="description"
+              style="width: 200px; background: rgba(0, 0, 0, 0.5); display: flex; justify-content: center"
+            >
+              <audio
+                loop
+                muted
+                :src="item.fileUrl"
+                controls=""
+                style="width: 100%; height: 20px; margin: 5px auto"
+              ></audio>
+            </div>
+          </a-list-item-meta>
+          <a-list-item-meta v-else-if="item.fileSuffix == 'mp4'">
+            <a slot="title">{{ item.fileName }}</a>
+            <div
+              slot="description"
+              style="width: 200px; background: rgba(0, 0, 0, 0.5); display: flex; justify-content: center"
+            >
+              <video :src="item.fileUrl" controls="controls" style="width: 50%; heihgt: auto; margin: 0 auto">
+                您的浏览器不支持 video 标签。
+              </video>
+            </div>
+          </a-list-item-meta> -->
+          <!-- <div>content</div> -->
+        </a-list-item>
+      </a-list>
     </a-modal>
   </div>
 </template>
@@ -163,17 +224,24 @@ export default {
       headers: {
         'Content-Type': 'multipart/form-data',
       },
+      thisItem: null,
+      thisIndex: null,
       defaultFileList: [],
       fileAll: null,
       playerList,
       previewBody: false,
       playerSrc: '',
       previewVisible: false,
-      changeVisible:false,
+      changeVisible: false,
+      changeLoading: false,
       loading: false,
       dataSource: [],
+      dataList: [],
       form: this.$form.createForm(this),
       appId: '',
+      fileName: '',
+      create: '1',
+      zipName: null,
       columns: [
         {
           title: '试玩名称',
@@ -202,6 +270,46 @@ export default {
     }
   },
   methods: {
+    downloadZip(item) {
+      let eleLink = document.createElement('a')
+      eleLink.download = item.fileName
+      eleLink.href = item.fileUrl
+      eleLink.click()
+      eleLink.remove()
+    },
+    beforeUpload(file, fileList) {
+      let that = this
+      return new Promise(function (resolve, reject) {
+        var imgInfo = {}
+
+        let fileReader = new FileReader()
+        fileReader.readAsDataURL(file) //根据图片路径读取图片
+        fileReader.onload = function (e) {
+          let base64 = this.result
+          let img = new Image()
+          img.src = base64
+          img.onload = function () {
+            imgInfo = {
+              width: img.naturalWidth,
+              height: img.naturalHeight,
+            }
+            console.log(imgInfo)
+            if (imgInfo.width != that.thisItem.width || imgInfo.height != that.thisItem.height) {
+              alert(`请选择${that.thisItem.width}*${that.thisItem.height}大小的文件!`)
+              reject()
+            } else {
+              resolve()
+            }
+          }
+        }
+      })
+      //  const fileOvesize = (file.size > this.size * oneKB)
+    },
+    getIndex(item, index) {
+      console.log(item, index)
+      this.thisItem = item
+      this.thisIndex = index
+    },
     customRequest(data) {
       var dataAll = {
         uid: '1',
@@ -213,6 +321,62 @@ export default {
       this.fileAll = data.file
       // this.saveFile(data.file)
     },
+    customRequestChange(data) {
+      console.log(data)
+      var dataAll = {
+        uid: '1',
+        name: data.file.name,
+        status: 'done',
+      }
+
+      // this.defaultFileList = []
+      if (data.file) {
+        var that = this
+        that.thisItem.newFile = data.file
+
+        var fr = new FileReader()
+        fr.onload = function () {
+          that.thisItem.imgPviewsUrl = this.result
+        }
+        fr.readAsDataURL(data.file)
+      }
+
+      // this.saveFile(data.file)
+    },
+    changeFile(e) {
+      this.changeLoading = true
+      var dataArr = this.dataList.filter((i) => {
+        return i.newFile != null
+      })
+      console.log(this.dataList, dataArr)
+      let formData = new FormData()
+      formData.append('file', dataArr[0].newFile)
+      formData.append('userId', this.userInfo().id)
+      formData.append('updateName', dataArr[0].fileName)
+      formData.append('id', dataArr[0].parentId)
+      formData.append('fileType', dataArr[0].fileType)
+      if (dataArr[0].accountId) {
+        formData.append('accountId', dataArr[0].accountId)
+      }
+
+      formData.append('isCreate', this.create == '1' ? 1 : null)
+      formData.append('newFileName', this.fileName == '' ? this.zipName : this.fileName+'.zip')
+
+      postAction('/shiwan/shiwanFileUpload/createNewZipFile', formData).then((res) => {
+        if (res.success) {
+          this.changeLoading = false
+          this.changeVisible = false
+          this.getPlayableList()
+          this.fileName = ''
+        }
+      })
+
+      // for (let i = 0; i < dataArr.length; i++) {
+      //   if (i == 0) {
+
+      //   }
+      // }
+    },
     saveFile(e) {
       this.confirmLoading = true
       this.form.validateFields((err, values) => {
@@ -241,14 +405,31 @@ export default {
         }
       })
     },
+
     ...mapGetters(['nickname', 'avatar', 'userInfo']),
     changeView(item) {
       getAction('/shiwan/shiwanFileUpload/selectListByParentId', { id: item.id }).then((res) => {
         if (res.success) {
-          this.previewBody = true
-          this.playerSrc = res.result.filter((i) => {
-            return i.fileSuffix == 'html'
-          })[0].fileUrl
+          var data = []
+          data = res.result.filter((i) => {
+            if (i.fileSuffix == 'png' || i.fileSuffix == 'jpg' || i.fileSuffix == 'gif') {
+              return i
+            }
+          })
+          this.dataList = data.map((i) => {
+            return {
+              ...i,
+              width: null,
+              height: null,
+              imgPviewsUrl: '',
+              newFile: null,
+            }
+          })
+          for (let i = 0; i < this.dataList.length; i++) {
+            this.getImgWidth(this.dataList[i])
+          }
+          this.changeVisible = true
+          this.zipName = item.fileName
         }
       })
     },
@@ -290,6 +471,43 @@ export default {
         }
       })
     },
+    getImgWidth(item) {
+      // this.$nextTick(() => {
+      // 记录当前时间戳
+      var start_time = new Date().getTime()
+      // 图片地址
+      var img_url = item.fileUrl
+      // 创建对象
+      var img = new Image()
+      // 改变图片的src
+      img.src = img_url
+      // 定时执行获取宽高
+      var checkAll = ''
+      var that = this
+      var check = function () {
+        // 只要任何一方大于0
+        // 表示已经服务器已经返回宽高
+        if (img.width > 0 || img.height > 0) {
+          var diff = new Date().getTime() - start_time
+          item.width = img.width
+          item.height = img.height
+          that.$set(item, 'width', img.width)
+          that.$set(item, 'height', img.height)
+          clearInterval(set)
+        }
+      }
+      var set = setInterval(check, 40)
+      // 加载完成获取宽高
+      img.onload = function () {
+        var diff = new Date().getTime() - start_time
+        item.width = img.width
+        item.height = img.height
+        that.$set(item, 'width', img.width)
+        that.$set(item, 'height', img.height)
+        // console.log(item.width, item.height)
+      }
+      // })
+    },
   },
   mounted() {
     this.getPlayableList()

+ 5 - 10
vue.config.js

@@ -73,17 +73,12 @@ module.exports = {
         // target: 'http://192.168.0.59:8088', //请求本地 需要jeecg-boot后台项目  英豪
         // target: 'http://192.168.1.188:8088', //请求本地 需要jeecg-boot后台项目  英豪
         // target: 'http://192.168.2.115:8080', //请求本地 需要jeecg-boot后台项目  祚云
-
-        // target: 'http://192.168.1.74:8098', //请求本地 需要jeecg-boot后台项目  毕洁泉
-        // target: 'http://192.168.1.74:8088', //请求本地 需要jeecg-boot后台项目  毕洁泉
+        // target: 'http://192.168.1.43:8098', //请求本地 需要jeecg-boot后台项目  毕洁泉
+        // target: 'http://192.168.1.43:8088', //请求本地 需要jeecg-boot后台项目  毕洁泉
+        // target: 'http://192.168.1.43:8888', //请求本地 需要jeecg-boot后台项目  毕洁泉
         // target: 'http://192.168.0.252:8098', //请求本地 需要jeecg-boot后台项目  毕洁泉
-        
-        // target: 'http://192.168.0.170:8088', //请求本地 需要jeecg-boot后台项目  毕洁泉
-
-        // target: 'http://192.168.1.94:8080', //请求本地 需要jeecg-boot后台项目  赵西安
-
-
-        //  target: 'http://api.tjyourong.com.cn', //请求本地 需要jeecg-boot后台项目
+        // target: 'http://192.168.1.219:8080', //请求本地 需要jeecg-boot后台项目  赵西安
+         target: 'http://api.tjyourong.com.cn', //请求本地 需要jeecg-boot后台项目
         // target: 'https://trac.tjyourong.com.cn', //请求本地 需要jeecg-boot后台项目
         // target: 'http://39.106.184.70:8088/', //请求本地 需要jeecg-boot后台项目
         //  target: 'http://adsp.tjyourong.com.cn/', //请求本地 需要jeecg-boot后台项目