<template>
  <base-list>
    <template slot="n_header">
      <el-form v-model="pagerDto" inline>
        <el-form-item label="中文报关品名">
          <el-input v-model="pagerDto._Co_CnName" />
        </el-form-item>
        <el-form-item label="英文报送品名">
          <el-input v-model="pagerDto._Co_EnName" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="pagerSerach()">
            搜索
          </el-button>
        </el-form-item>
      </el-form>
    </template>
    <template slot="n_option">
      <el-button @click="inputFile()">
        批量导入
      </el-button>
      <el-button @click="addItem()">
        添加
      </el-button>
    </template>
    <template>
      <el-table
        v-loading="dataLoading"
        :data="data"
        :highlight-current-row="true"
        :select-on-indeterminate="true"
        width="100%"
      >
        <el-table-column label="中文报关品名" prop="CnName" />
        <el-table-column label="英文报关品名" prop="EnName" />
        <el-table-column label="单价申报价值" prop="DeclaredUnitPrice" />
        <el-table-column label="创建人" prop="CreateUserName" />
        <el-table-column label="创建时间" prop="CreateTime" />
        <el-table-column label="修改人" prop="UpdateUserName" />
        <el-table-column label="修改时间" prop="UpdateTime" />
        <el-table-column label="操作">
          <template slot-scope="r">
            <el-button @click="modifyItem(r.row)">
              编辑
            </el-button>
            <el-button @click="deleteItem(r.row)">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :page-sizes="[10, 20, 40,100, 400]"
        :current-page="pagerDto.PageIndex"
        :page-size.sync="pagerDto.PageSize"
        background
        layout="prev, pager, next ,total ,jumper,sizes,slot "
        :total="pagerDto.total"
        @size-change="changePager"
        @current-change="pagerSerach"
      />
    </template>
    <el-dialog title="批量导入" :visible.sync="dialogShowInput">
      <el-form>
        <el-form-item label="申报文件">
          <el-upload
            class="upload-demo"
            action="http://wms.xingyunyi.cn/api/Finance/updateLoadFile"
            :on-success="changeFileUrl"
          >
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传excel文件</div>
          </el-upload>
        </el-form-item>
        <el-button type="primary" @click="saveInput()">确定上传</el-button>
      </el-form>
    </el-dialog>

    <el-dialog title="添加申报" :visible.sync="dialogShowAdd">
      <el-form>
        <el-form-item label="中文品名">
          <el-input v-model="addData.CnName" />
        </el-form-item>
        <el-form-item label="英文品名">
          <el-input v-model="addData.EnName" />
        </el-form-item>
        <el-form-item label="单价申报价值">
          <el-input v-model="addData.DeclaredUnitPrice" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="postAddItem()">
            确定添加
          </el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog title="修改申报" :visible.sync="dialogShowEdit">
      <el-form>
        <el-form-item label="中文品名">
          <el-input v-model="editRow.CnName" />
        </el-form-item>
        <el-form-item label="英文品名">
          <el-input v-model="editRow.EnName" />
        </el-form-item>
        <el-form-item label="单价申报价值">
          <el-input v-model="editRow.DeclaredUnitPrice" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="postModifyItem()">
            确定修改
          </el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </base-list>
</template>
<script>
import BaseList from '@/components/Xyy/baselist'
import { QueryPagerServiceDeclaredUnitPrice, ModifyServiceDeclaredUnitPrice, AddServiceDeclaredUnitPrice, DeleteServiceDeclaredUnitPrice, InputService_DeclaredUnitPrice
  , CleartPagerServiceDeclaredUnitPriceListCache
} from '@/api/channel/serviceDeclaredUnitPrice'
export default {
  name: 'ServiceDeclaredUnitPrice',
  components: { 'base-list': BaseList },
  data() {
    return {
      data: [],
      dialogShowInput: false,
      dialogShowAdd: false,
      dialogShowEdit: false,
      dataLoading: false,
      pagerDto: { PageIndex: 0, PageSize: 10, total: 0 },
      addData: {},
      editRow: {},
      url: ''
    }
  },
  mounted() {
    this.pagerSerach(1)
  },
  methods: {
    changeFileUrl(r) {
      this.url = r.Data.url
    },
    inputFile() {
      this.dialogShowInput = true
    },
    saveInput() {
      InputService_DeclaredUnitPrice({ url: this.url }).then(r => {
        CleartPagerServiceDeclaredUnitPriceListCache()
        this.dialogShowInput = false
        this.pagerSerach()
      })
    },
    pagerSerach(index) {
      this.dataLoading = true
      if (index) {
        this.pagerDto.PageIndex = index
      }
      QueryPagerServiceDeclaredUnitPrice(this.pagerDto).then(res => {
        this.data = res.Result
        this.pagerDto.total = res.TotalCount
      }).finally(res => { this.dataLoading = false })
    },
    changePager(v) {
      this.PageSize = v
      this.pagerSerach()
    },
    addItem() {
      this.addData = {}
      this.dialogShowAdd = true
    },
    modifyItem(r) {
      this.editRow = r
      this.dialogShowEdit = true
    },
    postAddItem() {
      AddServiceDeclaredUnitPrice(this.addData).then(r => {
        CleartPagerServiceDeclaredUnitPriceListCache()
        this.$message({ type: 'success', message: '添加成功' })
        this.dialogShowAdd = false
        this.pagerSerach()
      })
    },
    postModifyItem() {
      ModifyServiceDeclaredUnitPrice(this.editRow).then(r => {
        CleartPagerServiceDeclaredUnitPriceListCache()
        this.$message({ type: 'success', message: '修改成功' })
        this.dialogShowEdit = false
        this.pagerSerach()
      })
    },
    deleteItem(row) {
      this.$confirm('是否确定删除该配置?', '确定删除').then(r => {
        DeleteServiceDeclaredUnitPrice(row).then(y => {
          CleartPagerServiceDeclaredUnitPriceListCache()
          this.$message({ type: 'success', message: '删除成功' })
          this.pagerSerach()
        }
        )
      })
    }
  }
}
</script>
