Browse Source

素材库上线

xiuli.gao 1 year ago
parent
commit
ea58cab3ef

+ 1 - 1
index.html

@@ -7,4 +7,4 @@
7 7
         hm.src = "https://hm.baidu.com/hm.js?d61b9e2caf4d46ccda7471b5385e2333";
8 8
         var s = document.getElementsByTagName("script")[0];
9 9
         s.parentNode.insertBefore(hm, s);
10
-      })();</script><link href=./static/css/app.e284a45b98807f7aae6ec452a3f713ae.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.022a5bf13e7b1d5b0b03.js></script><script type=text/javascript src=./static/js/app.0ce40c580a5762d8d1ef.js></script></body></html>
10
+      })();</script><link href=./static/css/app.8aba09abcddeecec5d5460ded8733484.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.54db302575019e5fa316.js></script><script type=text/javascript src=./static/js/app.0ce40c580a5762d8d1ef.js></script></body></html>

+ 9 - 9
project/src/components/assembly/editCon.vue

@@ -151,17 +151,17 @@
151 151
       </div>
152 152
       <p class="uploadImgHint" style="margin-left:40px;">*图片仅支持png或jpg格式,且文件大小不得超过10M。</p>
153 153
       <div class="lineItem">
154
-        <label>封面描述:</label>
154
+        <label>消息描述:</label>
155 155
         <div class="input">
156 156
           <div class="flex">
157
-            <el-input class="input" type="textarea" size="small" placeholder="请输入封面描述" v-model="link.desc" clearable>
157
+            <el-input class="input" type="textarea" size="small" placeholder="请输入消息描述" v-model="link.desc" clearable>
158 158
             </el-input>
159 159
             <span class="font_zj">{{ $getStrBytes(link.desc) }}/512字节</span>
160 160
           </div>
161 161
           <div class="warning_hint f12" style="margin-left:0" v-if="$getStrBytes(link.desc) > 512"> <i
162
-              class="el-icon-warning-outline"></i> 封面描述,最多512个字节,已超出!</div>
162
+              class="el-icon-warning-outline"></i> 消息描述,最多512个字节,已超出!</div>
163 163
         </div>
164
-        <!-- <el-input class="input" size="small" placeholder="请输入封面描述" v-model="link.desc" clearable></el-input> -->
164
+        <!-- <el-input class="input" size="small" placeholder="请输入消息描述" v-model="link.desc" clearable></el-input> -->
165 165
       </div>
166 166
       <div class="buttons">
167 167
         <el-button type="primary" plain size="mini" @click="linkVisible = false">取消</el-button>
@@ -283,15 +283,15 @@
283 283
       </div>
284 284
       <p class="uploadImgHint" style="margin-left:40px;">*图片仅支持png或jpg格式,且文件大小不得超过10M。</p>
285 285
       <div class="lineItem">
286
-        <label>封面描述:</label>
286
+        <label>消息描述:</label>
287 287
         <div class="input">
288 288
           <div class="flex">
289
-            <el-input class="input" type="textarea" size="small" placeholder="请输入封面描述" v-model="linkExtend.desc"
289
+            <el-input class="input" type="textarea" size="small" placeholder="请输入消息描述" v-model="linkExtend.desc"
290 290
               clearable></el-input>
291 291
             <span class="font_zj">{{ $getStrBytes(linkExtend.desc) }}/512字节</span>
292 292
           </div>
293 293
           <div class="warning_hint f12" style="margin-left:0" v-if="$getStrBytes(linkExtend.desc) > 512"> <i
294
-              class="el-icon-warning-outline"></i> 封面描述,最多512个字节,已超出!</div>
294
+              class="el-icon-warning-outline"></i> 消息描述,最多512个字节,已超出!</div>
295 295
         </div>
296 296
       </div>
297 297
       <div class="buttons">
@@ -632,7 +632,7 @@ export default {
632 632
       }
633 633
       if (this.linkExtend && this.linkExtend.desc != '' && this.$getStrBytes(this.linkExtend.desc) > 512) {
634 634
         this.$message({
635
-          message: '请正确输入封面描述',
635
+          message: '请正确输入消息描述',
636 636
           type: "warning"
637 637
         })
638 638
         return
@@ -676,7 +676,7 @@ export default {
676 676
       }
677 677
       if (this.link && this.link.desc != '' && this.$getStrBytes(this.link.desc) > 512) {
678 678
         this.$message({
679
-          message: '请正确输入封面描述',
679
+          message: '请正确输入消息描述',
680 680
           type: "warning"
681 681
         })
682 682
         return

+ 56 - 16
project/src/components/manage/materialLibrary/dialog/batchGrouping.vue

@@ -5,15 +5,17 @@
5 5
       :close-on-click-modal="false"
6 6
       :close-on-press-escape="false"
7 7
       class="group-dialog"
8
-      width="350px"
8
+      width="400px"
9 9
     >
10 10
       <div slot="title">
11 11
         <span>批量分组</span>
12 12
       </div>
13 13
       <div class="form-wrap" v-loading="loading">
14
-        <div class="batchHint">已选中 <span>{{ media_ids.length }}</span> 张图片,请选择分组</div>
15
-        <div class="imgItemInfo">
16
-          <div class="form-item">
14
+        <div class="batchHint" style="margin-bottom:30px">已选中 <span>{{ media_ids.length }}</span> 张图片,请 选择分组 或 自定义分组</div>
15
+        <el-radio v-model="radioGroup" :label="1">选择分组</el-radio>
16
+        <el-radio v-model="radioGroup" :label="2">自定义分组</el-radio>
17
+        <div class="imgItemInfo" style="margin-top:20px;">
18
+          <div class="form-item" v-if="radioGroup==1">
17 19
             <span class="lable">分 组</span>
18 20
             <el-select v-model="group_id" size="small" clearable placeholder="请选择">
19 21
               <el-option
@@ -24,6 +26,10 @@
24 26
               </el-option>
25 27
             </el-select>
26 28
           </div>
29
+          <div class="form-item" v-if="radioGroup==2">
30
+            <span class="lable" style="width: 65px"><em>*</em>分组名称</span>
31
+            <el-input v-model="groupName" size="small" placeholder="请输入名称" clearable />
32
+          </div>
27 33
         </div>
28 34
       </div>
29 35
 
@@ -54,7 +60,9 @@ export default {
54 60
   data () {
55 61
     return{
56 62
       loading: false,
57
-      group_id:''
63
+      group_id:'',
64
+      radioGroup: 1,
65
+      groupName: ''
58 66
     }
59 67
   },
60 68
   created(){
@@ -64,34 +72,66 @@ export default {
64 72
     handleCancel() {
65 73
       this.$emit('cancel')
66 74
       this.group_id = ''
75
+      this.groupName = ''
76
+      this.radioGroup = 1
67 77
     },
68 78
     // 点击确定
69 79
     handleConfirm(){
70
-      if ( this.group_id == '') {
71
-        this.$confirm(`您选择的分组为空,默认对 ${this.media_ids.length} 个素材移除原有分组, 是否继续?`, '提示', {
72
-          confirmButtonText: '继续',
73
-          cancelButtonText: '取消',
74
-          type: 'warning'
75
-        }).then(() => {
76
-          this.changeGroup()
77
-        }).catch(() => {});
80
+      if ( this.radioGroup == 2 ) {
81
+        this.createdGroup()
78 82
       } else {
79
-        this.changeGroup()
83
+        if ( this.group_id == '') {
84
+          this.$confirm(`您选择的分组为空,默认对 ${this.media_ids.length} 个素材移除原有分组, 是否继续?`, '提示', {
85
+            confirmButtonText: '继续',
86
+            cancelButtonText: '取消',
87
+            type: 'warning'
88
+          }).then(() => {
89
+            this.changeGroup()
90
+          }).catch(() => {});
91
+        } else {
92
+          this.changeGroup()
93
+        }
94
+      }
95
+    },
96
+    // 自定义 新建分组
97
+    createdGroup(){
98
+      if ( this.groupName == '' ) {
99
+        this.$message({ message: '请填写分组名称!', type: 'fail' })
100
+        return
80 101
       }
102
+      this.$loading(this.$loadingConfig);
103
+      this.$axios.post(this.URL.BASEURL + this.URL.media_editGroup, {
104
+        name: this.groupName
105
+      }).then((data)=>{
106
+        this.$loading(this.$loadingConfig).close();
107
+        const res = data.data;
108
+        if (res && res.errno == 0) {
109
+          this.changeGroup(res.rst.group_id)
110
+        } else if (res.errno != 4002) {
111
+          this.$message.warning(res.err)
112
+        }
113
+      }).catch((err)=>{
114
+        this.$loading(this.$loadingConfig).close();
115
+      })
81 116
     },
82
-    async changeGroup(){
117
+    async changeGroup(id){
83 118
       try {
84 119
         this.$loading(this.$loadingConfig);
85 120
         const url = `${this.URL.BASEURL}${this.URL.media_changeGroup}`
86 121
         const params = {
87 122
           media_ids: this.media_ids.join(),
88
-          group_id: this.group_id,
123
+          group_id: id ? id : this.group_id,
89 124
         }
90 125
         const { data: res = {} } = await this.$axios.post(url, params)
91 126
         if (res && res.errno == 0 && res.rst) {
92 127
           this.$message.success('成功!')
93 128
           this.group_id = ''
129
+          this.groupName = ''
130
+          this.radioGroup = 1
94 131
           this.$emit('cancel', 'success')
132
+          if (id) { // 更新分组列表
133
+            this.$emit('renewGroupList')
134
+          }
95 135
         } else if (res.errno != 4002) {
96 136
           this.$message.warning(res.err)
97 137
         }

+ 29 - 10
project/src/components/manage/materialLibrary/pictureLibrary.vue

@@ -53,7 +53,7 @@
53 53
     <!-- 编辑素材 -->
54 54
     <editMaterials :editVisible="editVisible" @cancel="uploadMaterialsCancel" :editData="editData" :platformList="platformList" :groupList="groupList"></editMaterials>
55 55
     <!-- 批量分组 -->
56
-    <batchGrouping :groupingVisible="groupingVisible" :media_ids="media_ids" @cancel="uploadMaterialsCancel" :groupList="groupList"></batchGrouping>
56
+    <batchGrouping :groupingVisible="groupingVisible" :media_ids="media_ids" @cancel="uploadMaterialsCancel" :groupList="groupList" @renewGroupList="getPicturesGroup"></batchGrouping>
57 57
   </div>
58 58
 </template>
59 59
 <script>
@@ -99,6 +99,17 @@ export default {
99 99
       media_ids: [],// 批量素材ID
100 100
     }
101 101
   },
102
+  watch: {
103
+    selectMaterial(){ // 根据选中的数据 实时 更改选中样式
104
+      this.materialList.forEach((item) => {
105
+        if( this.selectMaterial.filter((v)=>{return v.id == item.id}).length > 0 ) {
106
+          item.checked = true
107
+        } else {
108
+          item.checked = false
109
+        }
110
+      });
111
+    }
112
+  },
102 113
   created(){
103 114
     this.height = document.documentElement.clientHeight - 257 > 400 ? document.documentElement.clientHeight - 257 : 400
104 115
     this.init()
@@ -126,8 +137,6 @@ export default {
126 137
           return v.id != data.id
127 138
         })
128 139
       }
129
-      data.checked = !data.checked;
130
-      this.$set(this.materialList,index,data)
131 140
     },
132 141
      // 获取列表数据
133 142
      async init() {
@@ -170,14 +179,8 @@ export default {
170 179
     // 点击全选
171 180
     allCheckedChange(){
172 181
       if ( this.allChecked ) {
173
-        this.materialList.forEach((v)=>{
174
-          v.checked = true
175
-        })
176 182
         this.selectMaterial = this.materialList
177 183
       } else {
178
-        this.materialList.forEach((v)=>{
179
-          v.checked = false
180
-        })
181 184
         this.selectMaterial = []
182 185
       }
183 186
     },
@@ -186,8 +189,8 @@ export default {
186 189
       this.uploadVisible = false;
187 190
       this.editVisible = false;
188 191
       this.groupingVisible = false;
189
-      this.selectMaterial = []
190 192
       if (val == 'success'){
193
+        this.selectMaterial = []
191 194
         this.init()
192 195
       }
193 196
     },
@@ -325,6 +328,22 @@ export default {
325 328
       } finally {
326 329
         this.$loading(this.$loadingConfig).close();
327 330
       }
331
+    },
332
+    getPicturesGroup() { //图片组
333
+      this.$axios.get(this.URL.BASEURL + this.URL.media_groupList, {
334
+        params: {
335
+          page: 1,
336
+          page_size: 500,
337
+          operator_id: '',
338
+        }
339
+      }).then((res) => {
340
+        var res = res.data
341
+        if (res && res.errno == 0 && Array.isArray(res.rst.data)) {
342
+          this.groupList = res.rst.data
343
+        } else if (res.errno != 4002) {
344
+        }
345
+      }).catch((err) => {
346
+      });
328 347
     }
329 348
   }
330 349
 }

File diff suppressed because it is too large
+ 1 - 1
static/css/app.e284a45b98807f7aae6ec452a3f713ae.css


File diff suppressed because it is too large
+ 9 - 0
static/js/0.54edbb6ef6404ac0de87.js


File diff suppressed because it is too large
+ 0 - 9
static/js/0.c11755cbb36d466498ee.js


File diff suppressed because it is too large
+ 0 - 1
static/js/31.e2a6bcb89b08c353d613.js


File diff suppressed because it is too large
+ 1 - 0
static/js/31.e9e8c01d1aa26f760b85.js


File diff suppressed because it is too large
+ 1 - 1
static/js/manifest.022a5bf13e7b1d5b0b03.js