fix(dataset): the duration of the assets in common dataset is not display

adjust some styles

src/components/dialog/DatasetConfigDialog/index.vue

@@ -41,14 +41,10 @@
 </template>
 
 <script>
-import {
-  AssetTagInfo,
-  AssetTypeInfo,
-  Dataset
-} from '@/constant'
+import { Dataset } from '@/constant'
 import {
   parseDuration,
-  getAssetThumb
+  transformDatasetAssetToAsset
 } from '@/utils'
 import {
   getDatasetByDevice,
@@ -67,7 +63,6 @@ export default {
       assetSchema: {
         singlePage: true,
         list: this.getAssetsByDataset,
-        transform: this.transformDatasetAsset,
         buttons: [
           { label: '重新绑定', on: this.onBind },
           { label: '解绑', on: this.onUnbind }
@@ -86,8 +81,13 @@ export default {
       schema: {
         list: this.getDatasets,
         condition: { type: Dataset.FILL },
+        filters: [
+          { key: 'name', type: 'search', placeholder: '名称' },
+          { type: 'refresh' }
+        ],
         cols: [
-          { prop: 'name', label: '名称', 'align': 'center' },
+          { prop: 'name', label: '名称' },
+          { prop: 'updateTime', label: '更新时间', width: 160 },
           { type: 'invoke', render: [
             { label: '查看', on: this.onViewDataset }
           ] }
@@ -96,7 +96,6 @@ export default {
       contentSchema: {
         singlePage: true,
         list: this.getAssets,
-        transform: this.transformDatasetAsset,
         cols: [
           { prop: 'tagInfo', label: '类型', width: 80, align: 'center' },
           { prop: 'typeInfo', label: '资源', width: 72, align: 'center' },
@@ -137,6 +136,9 @@ export default {
     },
     setDataset (dataset) {
       this.isUnbound = !dataset
+      if (dataset) {
+        dataset.mediaList = dataset.mediaList.map(this.transformDatasetAsset)
+      }
       this.dataset = dataset
       this.title = dataset ? dataset.name : '绑定填充素材包'
     },
@@ -146,18 +148,11 @@ export default {
       }
       return getDatasetByDevice(this.$deviceId).then(({ data }) => {
         this.setDataset(data)
-        return { data: data.mediaList }
+        return { data: data ? data.mediaList : [] }
       })
     },
     transformDatasetAsset (asset) {
-      asset.tagInfo = AssetTagInfo[asset.tag]
-      asset.typeInfo = AssetTypeInfo[asset.type]
-      asset.file = {
-        type: asset.type,
-        url: asset.keyName,
-        thumb: asset.minioData ? getAssetThumb(asset.minioData) : null
-      }
-      asset.name = asset.minioData.originalName
+      transformDatasetAssetToAsset(asset)
       asset.duration = parseDuration(asset.adDuration)
       return asset
     },
@@ -199,8 +194,8 @@ export default {
         return Promise.resolve({ data: this.$datasetAssets })
       }
       return getFillDataset(this.$datasetId).then(({ data: { mediaList } }) => {
-        this.$datasetAssets = mediaList
-        return { data: mediaList }
+        this.$datasetAssets = mediaList.map(this.transformDatasetAsset)
+        return { data: this.$datasetAssets }
       })
     }
   }

src/components/service/EventTargetPicker/index.vue

@@ -99,7 +99,7 @@
     />
     <table-dialog
       ref="contentDialog"
-      title="素材包"
+      :title="contentDialogTitle"
       :schema="contentSchema"
       append-to-body
     />
@@ -158,8 +158,13 @@ export default {
       datasetSchema: {
         list: getDatasets,
         condition: { type: Dataset.COMMON },
+        filters: [
+          { key: 'name', type: 'search', placeholder: '名称' },
+          { type: 'refresh' }
+        ],
         cols: [
-          { prop: 'name', label: '名称', 'align': 'center' },
+          { prop: 'name', label: '名称' },
+          { prop: 'updateTime', label: '更新时间', width: 160 },
           { type: 'invoke', render: [
             { label: '查看', on: this.onViewDataset }
           ] }
@@ -178,7 +183,8 @@ export default {
             { label: '查看', allow: ({ minioData }) => !!minioData, on: this.onViewAsset }
           ] }
         ]
-      }
+      },
+      datasetName: ''
     }
   },
   computed: {
@@ -237,6 +243,9 @@ export default {
           ] }
         ]
       }
+    },
+    contentDialogTitle () {
+      return `${this.datasetName}的上播内容`
     }
   },
   watch: {
@@ -334,7 +343,8 @@ export default {
       this.$datasetAssets = null
       this.$refs.datasetDialog.show()
     },
-    onViewDataset ({ id }) {
+    onViewDataset ({ id, name }) {
+      this.datasetName = name
       this.$datasetId = id
       this.$datasetAssets = null
       this.$refs.contentDialog.show()
@@ -344,10 +354,15 @@ export default {
         return Promise.resolve({ data: this.$datasetAssets })
       }
       return getCommonDataset(this.$datasetId).then(({ data: { mediaList } }) => {
-        this.$datasetAssets = mediaList.map(transformDatasetAssetToAsset)
+        this.$datasetAssets = mediaList.map(this.transformDatasetAsset)
         return { data: this.$datasetAssets }
       })
     },
+    transformDatasetAsset (asset) {
+      transformDatasetAssetToAsset(asset)
+      asset.duration = parseDuration(asset.adDuration)
+      return asset
+    },
     onChoosenDataset ({ value, done }) {
       if (this.$datasetId !== value.id) {
         this.$datasetId = value.id

src/views/ad/automation/dataset/index.vue

@@ -13,6 +13,7 @@
       ref="assetDialog"
       title="上播内容"
       size="xl fixed"
+      @closed="onClosed"
     >
       <c-transfer
         class="l-flex__auto"
@@ -94,20 +95,24 @@ export default {
           { type: 'add', on: this.onAdd }
         ],
         filters: [
-          { key: 'name', type: 'search', placeholder: '名称' }
+          { key: 'name', type: 'search', placeholder: '名称' },
+          { type: 'refresh' }
         ],
         cols: [
+          { type: 'refresh' },
           { prop: 'name', label: '名称', render: (data, h) => h('edit-input', {
             props: {
               value: `${data.name}`
             },
             on: { edit: val => this.onEditName(data, val) }
           }), 'class-name': 'c-edit-column' },
+          { prop: 'createTime', label: '创建时间', width: 200 },
+          { prop: 'updateTime', label: '更新时间', width: 200 },
           { type: 'invoke', render: [
             { label: '上播内容', on: this.onEdit },
             { label: '关联设备', on: this.onViewDevices },
             { label: '删除', on: this.onDel }
-          ], width: 240 }
+          ], width: 200 }
         ]
       },
       assetSchema: {
@@ -185,21 +190,15 @@ export default {
           inputPlaceholder: '最多30个字符',
           inputPattern: /^.{0,30}$/,
           inputValidator: val => {
-            console.log(val)
-            if (val) {
-              if (/^\s+|\s+$/.test(val)) {
-                return '请勿输入首尾空格'
-              }
-              return true
-            }
-            return '请填写名称'
+            const name = val ? val.replace(/^\s+|\s+$/g, '') : val
+            return name ? true : '请填写名称'
           },
           inputErrorMessage: '最多30个字符',
           confirmButtonText: '新增',
           cancelButtonText: '取消',
           beforeClose: (action, instance, done) => {
             if (action === 'confirm') {
-              this.onSave(instance.inputValue, done)
+              this.onSave(instance.inputValue.replace(/^\s+|\s+$/g, ''), done)
             } else {
               done()
             }
@@ -232,12 +231,23 @@ export default {
       updateDataset({
         id: dataset.id,
         name: newVal
-      }).catch(() => {
-        dataset.name = oldVal
-      })
+      }).then(
+        () => {
+          this.$refs.table.pageTo(1)
+        },
+        () => {
+          dataset.name = oldVal
+        }
+      )
+    },
+    onClosed () {
+      if (this.$datasetChanged) {
+        this.$refs.table.pageTo(1)
+      }
     },
     onEdit ({ id }) {
       this.$datasetId = id
+      this.$datasetChanged = false
       this.$refs.assetDialog.show()
     },
     getAssetsByDataset () {
@@ -266,9 +276,12 @@ export default {
           keyName,
           adDuration: getAssetDuration(asset)
         }
-      }))
+      })).then(() => {
+        this.$datasetChanged = true
+      })
     },
     onAssetChanged () {
+      this.$datasetChanged = true
       this.$refs.assetContentTable.pageTo()
     },
     onEditAssetDuration (asset, { newVal, oldVal }) {
@@ -277,9 +290,14 @@ export default {
       }
       if (newVal !== oldVal) {
         asset.adDuration = Number(newVal)
-        updateDatasetAssetDuration(asset.relationId, asset.adDuration).catch(() => {
-          asset.adDuration = oldVal
-        })
+        updateDatasetAssetDuration(asset.relationId, asset.adDuration).then(
+          () => {
+            this.$datasetChanged = true
+          },
+          () => {
+            asset.adDuration = oldVal
+          }
+        )
       }
     },
     onAssetRowClick (row) {

src/views/screen/material/dataset/index.vue

@@ -42,15 +42,19 @@ export default {
           { type: 'add', on: this.onAdd }
         ],
         filters: [
-          { key: 'name', type: 'search', placeholder: '名称' }
+          { key: 'name', type: 'search', placeholder: '名称' },
+          { type: 'refresh' }
         ],
         cols: [
+          { type: 'refresh' },
           { prop: 'name', label: '名称', render: (data, h) => h('edit-input', {
             props: {
               value: `${data.name}`
             },
             on: { edit: val => this.onEditName(data, val) }
           }), 'class-name': 'c-edit-column' },
+          { prop: 'createTime', label: '创建时间', width: 200 },
+          { prop: 'updateTime', label: '更新时间', width: 200 },
           { type: 'invoke', render: [
             { label: '上播内容', on: this.onEdit },
             { label: '删除', on: this.onDel }
@@ -72,21 +76,15 @@ export default {
           inputPlaceholder: '最多30个字符',
           inputPattern: /^.{0,30}$/,
           inputValidator: val => {
-            console.log(val)
-            if (val) {
-              if (/^\s+|\s+$/.test(val)) {
-                return '请勿输入首尾空格'
-              }
-              return true
-            }
-            return '请填写名称'
+            const name = val ? val.replace(/^\s+|\s+$/g, '') : val
+            return name ? true : '请填写名称'
           },
           inputErrorMessage: '最多30个字符',
           confirmButtonText: '新增',
           cancelButtonText: '取消',
           beforeClose: (action, instance, done) => {
             if (action === 'confirm') {
-              this.onSave(instance.inputValue, done)
+              this.onSave(instance.inputValue.replace(/^\s+|\s+$/g, ''), done)
             } else {
               done()
             }
@@ -119,9 +117,14 @@ export default {
       updateDataset({
         id: dataset.id,
         name: newVal
-      }).catch(() => {
-        dataset.name = oldVal
-      })
+      }).then(
+        () => {
+          this.$refs.table.pageTo(1)
+        },
+        () => {
+          dataset.name = oldVal
+        }
+      )
     },
     onDel (dataset) {
       deleteDataset(dataset).then(() => {
@@ -146,7 +149,9 @@ export default {
           adDuration: duration,
           orderNo: index
         }
-      }))
+      })).then(() => {
+        this.$refs.table.pageTo(1)
+      })
     },
     onViewAsset ({ file }) {
       this.$refs.previewDialog.show(file)