<template>
    <div>
        <el-alert
          title="采集一个商品添加进草稿箱，将消耗20金币"
          type="success"
          :closable="false">
        </el-alert>
        <el-form class="ai-form" :model="form" label-width="140px" ref="form">
            <el-form-item label="来源：" style="width: 100%;" prop="type" :rules="[{ required: true, message: '请选择来源', trigger: 'blur' }]">
            <el-radio-group v-model="form.type" size="medium">
                <el-radio :label="1">TEMU</el-radio>
                <!--<el-radio :label="2">速卖通</el-radio>-->
            </el-radio-group>
            </el-form-item>
            <el-form-item label="商品地址：" style="width: 100%;" prop="url" :rules="[{ required: true, message: '请输入商品地址', trigger: 'blur' }]">
            <el-input type="textarea" :rows="5" v-model="form.url"></el-input>
            </el-form-item>
            <el-form-item label="店铺：" style="width: 100%;" prop="targetMallId" :rules="[{ required: true, message: '请选择店铺', trigger: 'blur' }]">
            <el-select style="width: 380px" v-model="form.targetMallId" placeholder="请选择">
                <el-option
                v-for="item in $store.state.mallList"
                :key="item.mallId"
                :label="item.mallName"
                :value="item.mallId">
                </el-option>
            </el-select>
            </el-form-item>
            <el-form-item label="商品分类：" style="width: 100%;" prop="targetCatId" :rules="[{ required: true, message: '请选择商品分类', trigger: 'blur' }]">
            <ai-lazy-cascader 
              style="width: 380px" 
              v-model="form.targetCatId" 
              filterable
              :props="props"></ai-lazy-cascader>
            </el-form-item>
        </el-form>
        <div class="bottom flex-center">
            <el-button @click="$emit('onClose')">取 消</el-button>
            <el-button type="primary" @click="addToDraft" :loading="isCopying">确定</el-button>
        </div>
    </div>
</template>

<script>
import {sendChromeAPIMessage, sendChromeWebReqMessage} from '@/api/chromeApi'
import AiLazyCascader from "@/components/AiLazyCascader.vue"
import { Message } from 'element-ui'

export default {
    name: 'AiCopyFromTemu',
    props: ['params'],
    components: {AiLazyCascader},
    data() {
        return {
            props: {
                value: 'catId',
                label: 'catName',
                lazy: true,
                lazyLoad (value, resolve) {
                    sendChromeAPIMessage({
                        url: 'bg-anniston-mms/category/children/list',
                        needMallId: true,
                        data: {
                            parentCatId: value || ''
                        }
                    }).then(res => {
                        if (res.errorCode === 1000000) {
                            resolve(res.result.categoryNodeVOS.map(v => {
                            return {
                                ...v,
                                leaf: v.isLeaf
                            }
                            }))
                        }
                    })
                },
                lazySearch(queryString, resolve) {
                  sendChromeAPIMessage({
                    url: 'bg-anniston-mms/category/search',
                    needMallId: true,
                    data: {
                      searchText: queryString || ''
                    }
                  }).then(res => {
                    if (res.errorCode === 1000000) {
                      resolve(res.result.categoryPaths.map(v => {
                        let value = []
                        let label = []
                        for (let i = 1; i <= 10; i++ ) {
                          if (v['cat'+i+'NodeVO']) {
                            value.push(v['cat'+i+'NodeVO'].catId)
                            label.push(v['cat'+i+'NodeVO'].catName)
                          }
                        }
                        return {
                          catId: value,
                          catName: label
                        }
                      }))
                    }
                  })
                }
            },
            form: {
                url: '',
                type: 1,  // 默认从temu复制
                targetMallId: '',
                targetCatId: []
            },
            goods: {},
            sku: {},
            productDetail: {},
            isCopying: false
        }
    },
    created () {
        if (this.params?.url) {
            this.form.url = this.params.url
        }
    },
    methods: {
        async addToDraft() {
            this.$refs.form.validate((valid) => {
            if (valid) {
                this.isCopying = true
                this.$http.post('/api/copyProduct/check',null, {params: {type: 0}}).then(res => {
                    if (res.code == 0) {
                        let source
                        if (this.form.type == '1') {
                            source = 'temu'
                        } else if (this.form.type == '2') {
                            source = 'aliexpress'
                        }
                        sendChromeWebReqMessage({
                            type: source,
                            url: this.form.url,
                        }).then((res) => {
                            if (this.form.type == '1') {
                                if (res.indexOf("rawData") == -1) {
                                  this.isCopying = falses
                                  Message.error("请检查地址是否正确，或者“TEMU”网站是否出现图形验证码")
                                  return
                                }
                                let str = res.substring(res.indexOf("rawData"))
                                str = str.substring(0, str.indexOf("<\/script>"))
                                str = str.substring(str.indexOf("{"))
                                str = str.substring(0, str.lastIndexOf("}"))
                                str = str + "}"

                                let goodsObj = JSON.parse(str)
                                this.goods = goodsObj.store.goods
                                this.sku = goodsObj.store.sku
                                this.productDetail = goodsObj.store.productDetail

                                let specIds = []
                                this.sku.forEach(item => {
                                    item.specs.forEach(item1 => {
                                        let flag = false
                                        specIds.forEach(item2 => {
                                        if (item2.specValue == item1.specValue) {
                                            flag = true
                                        }
                                        })
                                        if (!flag) {
                                        specIds.push({specKeyId: item1.specKeyId, specValue: item1.specValue})
                                        }
                                    })
                                })

                                Promise.all(specIds.map(item => this.getSpecId(item).then(res => {
                                    this.sku.forEach(item1 => {
                                        item1.specs.forEach(item2 => {
                                            if (item2.specValue == item.specValue) {
                                                item2.specValueId = res.result.specId
                                            }
                                        })
                                    })
                                    return 0
                                }))).then(() => {
                                    this.$http.post('/api/copyProduct/translate',{type: 1, goods: this.goods, sku: this.sku, productDetail: this.productDetail}).then(res => {
                                        if (res.code == 0) {
                                            this.createDraft(res.data)
                                        }
                                    })
                                })
                            } else if (this.form.type == '2') {
                                /*if (res.indexOf("runParams") == -1) {
                                Message.error("请检查地址是否正确，或者“速卖通”网站是否出现滑动条")
                                return
                                }
                                let str = res.substring(res.indexOf("runParams"))
                                str = str.substring(0, str.indexOf("<\/script>"))
                                str = str.substring(str.indexOf("{"))
                                str = str.substring(0, str.lastIndexOf("}"))
                                str = str.substring(str.indexOf('data'))
                                str = str.substring(5)

                                let obj = JSON.parse(str)

                                sendChromeWebReqMessage({
                                type: source,
                                url: obj.productDescComponent.descriptionUrl,
                                }).then((res1) => {
                                res1 = res1.substring(0, res1.indexOf("<script>"))
                                let str = res1.replace(/<img[^>]+src="([^">]+)"[^>]+>/g, '$1\n').replace(/<.*?>/g, '[||]')
                                let arr = str.split('[||]')
                                for (let i = 0; i < arr.length; i++) {
                                    console.log(arr[i])
                                }
                                })*/
                            }
                        })
                    } else {
                      this.isCopying = false
                    }
                })
            }
        })
      },
      createDraft(data) {
        sendChromeAPIMessage({
          url: 'bg-visage-mms/product/draft/add',
          needMallId: true,
          mallId: this.form.targetMallId,
          data: {
            catId: this.form.targetCatId[this.form.targetCatId.length - 1]
        }}).then((res) => {
          this.isCopying = false
          if (res.errorCode == 1000000) {
            let draftId = res.result.productDraftId
            let content = data
            let i = 0
            for (; i < this.form.targetCatId.length; i++) {
              content['cat' + (i+1) + 'Id'] = this.form.targetCatId[i]
            }
            for (; i < 10; i++) {
              content['cat' + (i+1) + 'Id'] = ''
            }
            content.productDraftId = draftId

            this.createProduct(content)
          } else {
            setTimeout(() => {
              this.createDraft(data)
            }, 500)
          }
        })
      },
      createProduct(content) {
        sendChromeAPIMessage({
          url: 'bg-visage-mms/product/draft/save',
          needMallId: true,
          mallId: this.form.targetMallId,
          data: {
            ...content
        }}).then((res) => {
          if (res.errorCode == 1000000) {
            Message.success("成功添加到草稿箱")
            this.saveInfo()
          } else {
            setTimeout(() => {
              this.createProduct(content)
            }, 500)
          }
        })
      },
      getSpecId(data) {
        return sendChromeAPIMessage({
          url: 'bg-anniston-mms/sku/spec/byName/queryOrAdd',
          needMallId: true,
          mallId: this.form.targetMallId,
          data: {
            parentSpecId: data.specKeyId,
            specName: data.specValue
        }}).then((res) => {
          if (res.errorCode == 1000000) {
            return res
          } else {
            this.getSpecId(data)
          }
        })
      },
      saveInfo() {
        let mallInfo = this.$store.state.mallList.filter(item => {
          return item.mallId == this.form.targetMallId
        })
        this.$http.post('/api/copyProduct/add', {
            mallId: mallInfo[0].mallId,
            mallName: mallInfo[0].mallName,
            url: this.form.url,
            type: this.form.type
          }).then(res1 => {
          if (res1.code == 0) {
            this.$store.dispatch('getUserInfo')
            this.$emit('onSuccess')
          }
        })
      }
    }
}
</script>

<style scoped lang="scss">
.bottom {
    justify-content: center;
  }
</style>