<template>
	<div class="app-container">
		<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
			label-width="68px">
			<el-form-item label="商品名称" prop="goodsName">
				<el-input v-model="queryParams.goodsName" placeholder="请输入商品名称" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="商品编号" prop="id">
				<el-input v-model="queryParams.id" placeholder="请输入商品编号" clearable @keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="游戏账号" prop="gameAccount">
				<el-input v-model="queryParams.gameAccount" placeholder="请输入游戏账号" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="所属游戏" prop="gameId">
				<el-select v-model="queryParams.gameId">
					<el-option v-for="(item,index) in gameList" :key="item.id" :label="item.gameName" :value="item.id">
					</el-option>
				</el-select>
			</el-form-item>
			<!-- <el-form-item label="商品状态" prop="goodsStatus">
				<el-select v-model="queryParams.goodsStatus">
					<el-option v-for="(item,index) in options5" :key="item.id" :label="item.label" :value="item.value">
					</el-option>
				</el-select>
			</el-form-item> -->
			<el-form-item>
				<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
		</el-form>

		<el-table v-show="lb" v-loading="loading" :data="goodsList" @selection-change="handleSelectionChange">
			<el-table-column label="商品名称" show-overflow-tooltip align="center" height="20px" prop="goodsName" />
			<el-table-column label="商品编号" height="20px" prop="id" />
			<el-table-column label="游戏账号" height="20px" prop="gameAccount" />
			<el-table-column label="游戏名称" align="center" prop="gameId">
				<template slot-scope="scope">
					<div v-for="(item,index) in gameList" :key="item.id" :label="item.gameName" :value="item.id">
						<span v-if="item.id==scope.row.gameId">{{item.gameName}}</span>
					</div>
				</template>
			</el-table-column>
			<el-table-column label="游戏账号售价" align="center" prop="price" />
			<el-table-column label="排位状态" align="center" prop="ranking">
				<template slot-scope="scope">
					<dict-tag :options="dict.type.ranking" :value="scope.row.ranking" />
				</template>
			</el-table-column>
			<el-table-column label="实名状态" align="center" prop="identifiedName">

				<template slot-scope="scope">
					<dict-tag :options="dict.type.identified_name" :value="scope.row.identifiedName" />
				</template>
			</el-table-column>
			<el-table-column align="center" label="主营行业" prop="accountSource">
				<template slot-scope="scope">
					<dict-tag :options="dict.type.account_source" :value="scope.row.accountSource" />
				</template>
			</el-table-column>
			<el-table-column label="游戏图片" align="center">
				<template slot-scope="scope">
					<label style="color: #ff0000;" @click="openPictureDialog(scope.row)">游戏图片</label>
					<!--<el-image  :src="pictureServerPath + scope.row.gamePicture" style="width: 50px;height: 50px;"></el-image>-->
				</template>
			</el-table-column>
			<el-table-column label="商品状态" align="center" prop="goodsStatus">
				<template slot-scope="scope">
					<span v-if="scope.row.goodsStatus=='goods_status_0'">已上架</span>
					<span v-if="scope.row.goodsStatus=='goods_status_1'">已预订</span>
					<span v-if="scope.row.goodsStatus=='goods_status_2'">已下架</span>
					<span v-if="scope.row.goodsStatus=='goods_status_3'">已出售</span>
				</template>
			</el-table-column>
			<el-table-column label="下架时间" align="center" prop="updateTime" />
			<el-table-column label="操作人" align="center" prop="updateBy" />
			<el-table-column label="操作" width="200px" align="center" class-name="small-padding fixed-width">
				<template slot-scope="scope">
					<div v-show="scope.row.goodsStatus=='goods_status_2'">
						<el-button type="success" size="small" @click="handleRevoke(scope.row)"
							v-hasPermi="['system:downGoods:revoke']">撤回
						</el-button>
					</div>
				</template>
			</el-table-column>
		</el-table>

		<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
			@pagination="getList" />

		<!-- 添加或修改商品信息对话框 -->
		<el-dialog :title="title" :visible.sync="open" high="1500px" width="1000px" append-to-body>
			<el-form ref="form" :model="form" :rules="rules" label-width="80px">
				<el-row>
					<el-col :span="12">
						<el-form-item label="商品名称" prop="goodsName">
							<el-input v-model="form.goodsName" placeholder="请输入商品名称" />
						</el-form-item>
					</el-col>

					<el-col :span="12">
						<el-form-item label="所属游戏" prop="gameId">
							<el-select v-model="form.gameId" @change="changeGameArea" style="width: 100%" filterable
								placeholder="请选择所属游戏">
								<el-option v-if="openGame&&openGame.find(item1 => item1 == item.id)"
									v-for="(item,index) in gameList" :key="item.id" :label="item.gameName"
									:value="item.id"></el-option>
								<el-option v-if="openGame==null" v-for="(item,index) in gameList" :key="item.id"
									:label="item.gameName" :value="item.id"></el-option>
							</el-select>

						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item label="游戏大区" prop="gameareaId">
							<el-cascader style="width: 100%" v-model="form.gameareaId" :options="options"
								:props="{ expandTrigger: 'hover' }"></el-cascader>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="账号售价" prop="price">
							<el-input v-model="form.price" placeholder="请输入游戏账号售价" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='identified_name'"
							label="实名情况" prop="identifiedName">
							<el-select v-model="form.identifiedName" style="width: 100%">
								<el-option v-for="dict in dict.type.identified_name" :key="dict.value"
									:label="dict.label" :value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='ranking'" label="排位情况"
							prop="ranking">
							<el-select v-model="form.ranking" style="width: 100%">
								<el-option v-for="dict in dict.type.ranking" :key="dict.value" :label="dict.label"
									:value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='account_type'"
							label="账号类型" prop="accountType">
							<el-select v-model="form.accountType" style="width: 100%">
								<el-option v-for="dict in dict.type.account_type" :key="dict.value" :label="dict.label"
									:value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>




				</el-row>

				<el-row>
					<el-col :span="12">
						<el-form-item label="游戏账号" prop="gameAccount">
							<el-input v-model="form.gameAccount" placeholder="请输入游戏账号" />
						</el-form-item>
					</el-col>





					<el-col :span="12">
						<el-form-item v-show="false" label="主营行业" prop="accountSource">
							<el-select v-model="form.accountSource" placeholder="请选择主营行业" style="width: 100%" disabled>
								<el-option v-for="dict in dict.type.account_source" :key="dict.value"
									:label="dict.label" :value="dict.value"></el-option>
							</el-select>
						</el-form-item>

					</el-col>

					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='binding_psn'"
							label="绑定psn" prop="bindingPsn">
							<el-select v-model="form.bindingPsn" style="width: 100%">
								<el-option v-for="dict in dict.type.binding_psn" :key="dict.value" :label="dict.label"
									:value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='binding_tap'"
							label="绑定tap" prop="bindingTap">
							<el-select v-model="form.bindingTap" style="width: 100%">
								<el-option v-for="dict in dict.type.binding_tap" :key="dict.value" :label="dict.label"
									:value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item v-show="block" v-for="(item,index) in type" v-if="item=='account_type_wg'"
							label="账号类型" prop="accountTypeWg">
							<el-select v-model="form.accountTypeWg" style="width: 100%">
								<el-option v-for="dict in dict.type.account_type_wg" :key="dict.value"
									:label="dict.label" :value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>

				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item v-show="gameAttrs1" label="游戏属性" prop="gameAttributes">

							<table width="90%" border="1" style="border-color: #f1f3f5;" cellspacing="0" cellpadding="0"
								align="center" @selection-change='handleCheckedCitiesChange()'>
								  <tbody>
									    <tr v-for="(item,index) in tableData">
										      <th width="100px">{{item.label}}</th>
										<td width="750px">
											<span v-for="(item1,index) in item.children" style="margin: 0 10px;">

												<el-checkbox-group v-model="gameAttrs" style="display: inline;"
													@change="handleCheckedCitiesChange">
													<el-checkbox v-if="item.type==1" :label="item1.id" :value="item1.id"
														:key="item1.id">{{item1.label}}</el-checkbox>
												</el-checkbox-group>
												<el-radio v-if="item.type==0" :label="item1.label" :value="item1.id"
													:key="item1.id">{{item1.label}}</el-radio>

											</span>
										</td>
									</tr>
									  </tbody>
							</table>

						</el-form-item>
					</el-col>
				</el-row>






			</el-form>

			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>

		<el-dialog title="游戏图片" :before-close="closedialog" :visible.sync="openPicture" width="1000px" append-to-body>

			<el-form ref="form" :model="form" :rules="rules" label-width="80px">
				<div class="img_list">
					<div style="position: relative;width: 100px;height: 100px;" v-for="item in attach_list">
						<el-image @click="deletePicture(item.id)" style="width: 100px;height: 100px;"
							:src="nginx_pictures_path+item.url"></el-image>
					</div>
				</div>
				<el-upload ref="upload" :action="uploadImgUrl" list-type="picture-card"
					:before-upload="beforeAvatarUpload" :on-success="handleAvatarSuccess" :on-remove="handleRemove"
					:on-change="changeUpload" :show-file-list="true" accept="image/png, image/jpeg, application/pdf"
					:multiple="true" :headers="headers"></el-upload>
			</el-form>
			<el-button @click="addPictures">添加图片</el-button>
			<!-- <el-button @click="openPicture = false">关 闭</el-button>-->
			<el-button @click="cancelPic">取 消</el-button>
			<!--<image style="width: 100px;height: 100px;" src="http://localhost:9001/be3f82f6-e723-4f42-a9e6-7eae9f7cc54c.png"></image>-->
		</el-dialog>
		<el-dialog title="刷新记录" :visible.sync="openRefreshRecord" width="500px" append-to-body>
			<div class="">
				刷新纪录
			</div>
			<el-button @click="openRefreshRecord=false">确定</el-button>
			<el-button @click="openRefreshRecord=false">取 消</el-button>
		</el-dialog>


	</div>
</template>
<style lang="scss" scoped>
	.post-information-title {
		font-size: 15px;
		margin: -35px 10px 10px 10px;
		color: dodgerblue;

		span {
			display: inline-block;
			width: 11px;
			height: 100%;

			img {
				width: 100%;
			}
		}
	}

	.staffUpData .el-upload-list--picture-card .el-upload-list__item {
		overflow: inherit;
		float: left;
		background: rgba(255, 94, 94, 1);
		margin-top: 20px;

		img {
			display: block;
		}
	}

	.staffUpData .el-upload-list--picture-card .el-upload-list__item-name {
		display: block;
		width: 100%;
	}

	.staffUpData .el-upload--picture-card {
		margin-top: 20px;
	}

	.el-upload-list__item.is-success .el-upload-list__item-status-label {
		display: none !important;
	}

	.img_list {}

	.img_list div {
		margin: 10px;
		float: left;

	}
</style>

<script>
	import {
		listGoods,
		getGoods,
		delGoods,
		refGoods,
		addGoods,
		updateGoods,
		sell,
		getInitGoodsManager,
		getGameArea,
		getGoodsPictures,
		addGoodsPictures,
		getGoodsByShopId,
		getGameAttrib,
		goodsNoticeList,
		goodsPayment,
		goodsPaymentadd,
		getTBusShopInfo,
		getGameAttr,
		addAttr,
		revoke
	} from "@/api/data/goods";
	import {
		getToken
	} from "@/utils/auth";
	import {
		getInfo,
		getSysDeptInfo,
	} from "@/api/data/goodsPayment";
	import {
		delAttach
	} from '@/api/data/attach'
	import Treeselect from "@riophae/vue-treeselect";
	import "@riophae/vue-treeselect/dist/vue-treeselect.css";
	import {
		deptTreeSelect
	} from '@/api/system/user'

	export default {
		name: "Goods",
		dicts: ['account_source', 'is_multiple', 'by_stages', 'ranking', 'game_platform_mapping', 'identified_name',
			'account_type', 'binding_tap',
			'binding_psn',
			'account_type_wg', 'healthy_status', 'main_industry'
		],
		components: {
			Treeselect
		},
		data() {
			return {
				gameAttrs: [],
				gameAttrs1: false,
				openGame: [],
				radio: '',
				props: {
					multiple: true
				},
				uploadImgUrl: process.env.VUE_APP_BASE_API + "/file/upload", // 上传的图片服务器地址
				headers: {
					Authorization: "Bearer " + getToken(),
				},
				options: [],
				nginx_pictures_path: null,
				attach_list: [],
				pictureServerPath: null,
				// 遮罩层
				loading: true,
				sxz: false,
				lb: true,
				// 选中数组
				ids: [],
				type: [],
				block: true,
				channelid: false,
				bp1: false,
				bp2: false,
				deptName: '',
				deptName1: '',
				// 部门树选项
				deptOptions: undefined,
				// 非单个禁用
				single: true,
				// 非多个禁用
				multiple: true,
				multiple1: true,
				// 显示搜索条件
				showSearch: true,
				// 总条数
				total: 0,
				total1: 13,
				// 商品信息表格数据
				goodsList: [],
				// 弹出层标题
				title: "",
				// 是否显示弹出层
				open: false,
				send: false,
				ck: false,
				xg: false,
				openPicture: false,
				openRefreshRecord: false,
				openRefreshRecord1: false,
				Channel: false,
				Channel1: false,
				bp: false,
				dbbp: false,
				bp1: false,
				// 付款状态
				options1: [{
					value: 'Y',
					label: '已付款'
				}, {
					value: 'X',
					label: '未付款'
				}],
				// 销售渠道
				options2: [{

					value: 'zichu',
					label: '自出',
					children: [{
						value: 'taohaowan',
						label: '淘号玩'
					}]

				}, {

					value: 'fenxiao',
					label: '分销',
					children: [{
							value: 'game_platform_mapping_1',
							label: '游戏阁'
						}, {
							value: 'game_platform_mapping_3',
							label: '换号吧'
						},
						{
							value: 'game_platform_mapping_4',
							label: '氪金兽'
						},
						{
							value: 'game_platform_mapping_5',
							label: '盼之'
						},
						{
							value: 'game_platform_mapping_6',
							label: '螃蟹'
						},
						{
							value: 'game_platform_mapping_7',
							label: '神仙代售'
						},
						{
							value: 'game_platform_mapping_8',
							label: '看个号'
						}, {

							value: 'game_platform_mapping_9',
							label: '7881'
						},
						{
							value: 'game_platform_mapping_10',
							label: '聚幻游'
						},
						{
							value: 'game_platform_mapping_11',
							label: '破晓网'
						},
						{
							value: 'all',
							label: '其他'
						},
					]

				}],

				options4: [{
					value: 'Y',
					label: '是'
				}, {
					value: 'N',
					label: '否'
				}],
				options5: [{
					value: 'goods_status_0',
					label: '已上架'
				}],
				// disabled:false,

				// 查看表格
				tableData: [],
				// 修改参数
				form: {
					name: '',
					region: '',
					date1: '',
					date2: '',
					delivery: false,
					type: [],
					resource: '',
					desc: '',
				},
				// 查询参数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					pageNum1: 1,
					pageSize1: 10,
					goodsName: null,
					gameId: null,
					gameName: null,
					gameareaId: null,
					gameareaName: null,
					price: null,
					healthyStatus: null,
					accountSource: null,
					gamePicture: null,
					goodsStatus: 'goods_status_2',
					shopId: null,
					sort: null,
					id: null
				},
				gameList: [],
				electronicDataList1: [],
				electronicDataList2: [],
				// 表单参数
				form: {
					electronicDataList: [],
					gamePicture: [],
					//创建一个游戏属性数值
					arrayLIst: [],
					sort: null,
				},
				// 表单校验
				rules: {

					gameareaId: [{
						required: true,
						message: "大区不能为空",
						trigger: "blur"
					}],

					gameAccount: [{
						required: true,
						message: "游戏账号不能为空",
						trigger: "blur"
					}],
					identifiedName: [{
						required: true,
						message: "实名不能为空",
						trigger: "blur"
					}],
					ranking: [{
						required: true,
						message: "排位不能为空",
						trigger: "blur"
					}],
					accountType: [{
						required: true,
						message: "账户类型不能为空",
						trigger: "blur"
					}],
					accountTypeWg: [{
						required: true,
						message: "账号类型不能为空",
						trigger: "blur"
					}],
					// gameAttributes: [{
					// 	required: true,
					// 	message: "游戏属性不能为空",
					// 	trigger: "blur"
					// }],
					bindingTap: [{
						required: true,
						message: "绑定tap不能为空",
						trigger: "blur"
					}],
					bindingPsn: [{
						required: true,
						message: "绑定psn不能为空",
						trigger: "blur"
					}],
					originalPrice: [{
						required: true,
						message: "商品原价不能为空",
						trigger: "blur"
					}],
					price: [{
						required: true,
						message: "账号售价不能为空",
						trigger: "blur"
					}, ],
					distributionChannel: [{
						required: true,
						message: "销售渠道不能为空",
						trigger: "blur"
					}],
					securityPrice: [{
						required: true,
						message: "包赔费用不能为空",
						trigger: "blur"
					}],
					securityRate: [{
						required: true,
						message: "包赔费率不能为空",
						trigger: "blur"
					}],
					isMultiple: [{
						required: true,
						message: "多倍包赔不能为空",
						trigger: "blur"
					}],
					byStages: [{
						required: true,
						message: "分期购买不能为空",
						trigger: "blur"
					}],

					paymentChannels: [{
						required: true,
						message: "付款渠道不能为空",
						trigger: "blur"
					}],
					paymentNumber: [{
						required: true,
						message: "付款流水号不能为空",
						trigger: "blur"
					}],
					isSecurity: [{
						required: true,
						message: "是否包赔不能为空",
						trigger: "blur"
					}],
					channelId: [{
							required: true,
							message: "分销编号不能为空",
							trigger: "blur"
						},
						{
							validator(rule, value, callback) {
								if (/(^[1-9]\d*$)/.test(value)) {
									callback()
								} else {
									callback(new Error('请输入正整数'))
								}
							},
							trigger: 'blur'
						}
					]
				}
			};
		},
		watch: {
			'$route.query.shopId': {
				handler: function(newValue, oldValue) {
					if (newValue != undefined) {
						this.queryParams.shopId = newValue
					}
					if (oldValue != undefined) {
						this.queryParams.shopId = oldValue
					}
					this.getList();
				}
			}
		},
		created() {
			this.form.shopId = this.$route.query.shopId;
			if (this.$route.query.openGame) {
				this.openGame = this.$route.query.openGame.split(',');
			} else {
				this.openGame = null
			}
			this.queryParams.shopId = this.$route.query.shopId;
			this.queryParams.sort = this.$route.query.sort;
			this.initGoodsManager();
			this.getList();
			// this.user();
			// this.changeGameArea();
		},
		methods: {
			/** 撤回按钮操作 */
			handleRevoke(row) {
				let query={
					id:row.id,
				}
				revoke(query).then(res=>{
					if (res.code==200) {
						this.$message({
							type: 'success',
							message: '撤回成功!'
						})
						this.getList();
					} else{
						alert(res.msg)
					}
				})
			},
			handleCheckedCitiesChange(item) {
				// console.log(this.gameAttrs)
			},
			handleClose(done) {
				this.$confirm('确认关闭？')
					.then(_ => {
						this.bp = false;
						this.dbbp = false;
						this.bp1 = false;
						this.bp2 = false;
						this.channelid = false;
						this.reset();
						done();
					})
					.catch(_ => {});
			},
			deletePicture(id) {
				let that = this
				this.$modal.confirm("确定删除此图片吗？").then(function() {
					delAttach(id).then(r => {
						getGoodsPictures({
							goodsId: that.form.id
						}).then(resp => {
							that.nginx_pictures_path = resp.nginx_pictures_path
							that.attach_list = resp.attachlist
						})
					})
				})
			},

			rowClass() {
				return "text-align: rigth;";
			},

			addPictures() {
				let that = this
				this.form.gamePicture = null
				addGoodsPictures(this.form).then(resp => {
					// this.openPictureDialog()
					this.openPicture = false
					location.reload();
				})
			},


			openPictureDialog(rows) {
				this.openPicture = true
				this.form = rows
				this.form.electronicDataList = []
				let that = this
				getGoodsPictures({
					goodsId: this.form.id
				}).then(resp => {
					that.nginx_pictures_path = resp.nginx_pictures_path
					that.attach_list = resp.attachlist
				})
			},

			closedialog(done) {
				this.openPicture = false;
				this.$refs.upload.clearFiles()
			},

			uploadSumit() { // 上传文件
				this.isloading = true
				uploadElectronicData(this.form).then((res) => {
					this.$emit('getUploadSuccess')
					this.$message({
						message: '上传成功',
						type: 'success'
					})
					this.isshow = false
					this.isloading = false
				}).catch((e) => {
					this.$message({
						message: '上传失败',
						type: 'error'
					})
					this.form.electronicDataList = []
					this.isshow = false
					this.isloading = false
				})
			},
			openDialog(employeeId) {
				this.isshow = true
				this.form.employeeId = employeeId
				// employeeId && this.editEmployeeStatusDetail()
			},
			handlePictureCardPreview(file) {
				this.dialogImageUrl = file.url
				this.dialogVisible = true
			},
			handleDownload(file) {},
			// 删除
			handleRemove(file, fileList) {},
			// 上传之前
			beforeAvatarUpload(file) {
				const isJPG = file.type === 'image/jpeg'
				const isPng = file.type === 'image/png'
				const isPdf = file.type === 'application/pdf'
				const isLt50M = file.size / 1024 / 1024 < 50
				if (!isLt50M) {
					this.$message.warning('上传文件大小不能超过 50MB!')
					return false
				}
				if (!isJPG && !isPng && !isPdf) {
					this.$message.warning('只能上传 JPG/PNG/PDF/JPEG 格式!')
					return false
				}
			},
			// 上传成功
			handleAvatarSuccess(res) {
				this.form.gamePicture = res.data.url
			},
			// 文件状态改变时的钩子，添加文件、上传成功和上传失败时都会被调用
			changeUpload(file, fileList) {

				if (file.status === 'success') {
					this.$refs.upload.uploadFiles = this.$refs.upload.uploadFiles.filter((item) => {
						return item.raw.size / 1024 / 1024 < 50
					})
					this.tobase64(file)
				}
			},
			tobase64(file) {
				let that = this
				var reader = new FileReader()
				reader.readAsDataURL(file.raw)
				reader.onload = (e) => {
					const tempobj = {
						data: file.response.data.webUrl,
						suffix: '.' + file.raw.type.split('/')[1],
						fileName: file.name,
						uid: file.uid,
					}
					if (tempobj.uid == null) {
						this.$message.error('图片uid为空,请稍后重新上传图片!');
					} else if (tempobj.data == null) {
						this.$message.error('图片data为空,请稍后重新上传图片!');
					} else if (tempobj.suffix == null) {
						this.$message.error('图片suffix为空,请稍后重新上传图片!');
					} else if (tempobj.fileName == null) {
						this.$message.error('图片fileName为空,请稍后重新上传图片!');
					} else {
						this.form.electronicDataList.push(tempobj)
					}
				}
			},

			// 强制重新渲染
			forceUpdate() {
				this.$forceUpdate()
			},

			changeGameArea(id) {
				this.form.arrayList = []
				let that = this
				let gm = {
					gameId: this.form.gameId || id
				}
				getGameArea(gm).then(res => {

					that.options = res.gameArea
				})
				getGameAttrib(gm.gameId).then(res => {

					if (res.data.gameProperties != null) {
						this.block = true;
						let data = res.data.gameProperties.split(",")
						this.type = data
					} else {
						this.block = false
					}
				})
				let query = {
					gameId: gm.gameId
				}
				getGameAttr(query).then(res => {
					if (res.data[0].children) {
						this.gameAttrs1 = true
						this.tableData = res.data[0].children
					} else {
						this.gameAttrs1 = false
					}

				})
			},

			initGoodsManager() {
				getInitGoodsManager().then(res => {
					this.pictureServerPath = res.pictureServerPath
					this.gameList = res.gameList
				})
			},

			/** 查询商品信息列表 */
			getList() {
				this.loading = true;
				listGoods(this.queryParams).then(response => {
					this.goodsList = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			// 取消按钮
			cancelPic() {
				this.$refs.upload.clearFiles()
				this.openPicture = false;
				this.reset();
				location.href = location.href + "#reloaded";
			},


			cancel() {
				this.open = false;
				this.send = false;
				this.bp = false;
				this.dbbp = false;
				this.bp1 = false;
				this.bp2 = false;
				this.gameAttrs = [];
				this.gameAttrs1 = false;
				this.channelid = false;
				this.reset();
			},
			// 表单重置
			reset() {
				this.form = {
					id: null,
					goodsName: null,
					gameId: null,
					gameName: null,
					gameareaId: null,
					gameareaName: null,
					createTime: null,
					price: null,
					healthyStatus: null,
					accountSource: null,
					gamePicture: null,
					goodsStatus: null,
					shopId: this.form.shopId,
					electronicDataList: [],
					arrayList: [],
				};
				this.resetForm("form");
			},
			/** 搜索按钮操作 */
			handleQuery() {
				this.queryParams.pageNum = 1;
				this.getList();
			},
			/** 重置按钮操作 */
			resetQuery() {
				this.resetForm("queryForm");
				this.handleQuery();
			},
			// 多选框选中数据
			handleSelectionChange(selection) {
				this.ids = selection.map(item => item.id)
				this.single = selection.length !== 1
				this.multiple = !selection.length
				this.multiple1 = !selection.length
			},
			/** 新增按钮操作 */
			handleAdd() {
				this.block = false
				this.form.arrayList = [];
				const shopId = this.$route.query.shopId;
				getGoodsByShopId(shopId).then(response => {
					if (response.msg == "true") { //说明 之前上传的号  图片都已经传了
						this.reset();
						this.open = true;
						this.title = "添加商品信息,添加完请记得添加商品图片";
						// this.$refs.upload.clearFiles();
						this.form.accountSource = this.$route.query.accountSource
					} else {
						this.$modal.notice("(" + response.msg + "....)订单没有传图片，请完善之后在操作!").then(function() {

						})
					}
				});
			},

			/** 修改按钮操作 */
			handleUpdate(row) {
				this.form.arrayList = [];
				this.form.electronicDataList = [];
				const id = row.id || this.ids
				this.changeGameArea(row.gameId)


				getGoods(id).then(response => {
					this.form = response.data;
					this.open = true;
					this.title = "修改商品信息";
					//this.$refs.upload.clearFiles();
					let jsonstr = response.data.verticalProperties;
					// this.ids = selection.map(item => item.id)
					let resion = response.data.gameAttrs.map(item => Number(item.attributeId))
					this.gameAttrs = resion
					//非空判断，转换json集合
					if (jsonstr != null) {
						let attribute = JSON.parse(jsonstr);

						//回填游戏属性
						this.form.arrayList = attribute;
					}
				});
			},


			/** 提交按钮 */
			submitForm() {
				let _this = this;
				this.$refs["form"].validate(valid => {
					if (valid) {
						if (Array.isArray(this.form.gameareaId) != true) {
							_this.form.gameareaId = this.form.gameareaId
						} else {
							_this.form.gameareaId = _this.form.gameareaId[this.form.gameareaId.length - 1]
						}
						if (_this.form.id != null) {
							let resion = this.gameAttrs.map(item => ({
								attributeId: item
							}))
							_this.form.gameAttrs = resion;
							_this.form.verticalProperties = JSON.stringify(this.form.arrayList);
							updateGoods(_this.form).then(response => {
								this.gameAttrs1 = false
								this.gameAttrs = []
								this.$modal.msgSuccess("修改成功");
								this.open = false;
								this.getList();
							});
						} else {
							let resion = this.gameAttrs.map(item => ({
								attributeId: item
							}))
							_this.form.gameAttrs = resion;
							_this.form.verticalProperties = JSON.stringify(this.form.arrayList);
							_this.form.sort = this.queryParams.sort;
							addGoods(_this.form).then(response => {
								this.gameAttrs1 = false
								this.gameAttrs = []
								this.$modal.msgSuccess("新增成功,请继续添加商品图片！！！！！");
								this.open = false;
								this.getList();
							})
						}


					}
				});
			},


			/** 下架按钮操作 */
			handleDelete(row) {
				const ids = row.id || this.ids;
				this.$modal.confirm('此商品是否已出售？已出售商品请勿点击确定按钮！').then(function() {

				}).then(() => {
					this.$modal.confirm('是否确认下架商品信息编号为"' + ids + '"的数据项？').then(function() {
						return delGoods(ids);
					}).then(() => {
						this.getList();
						this.$modal.msgSuccess("下架成功");
					}).catch(() => {});
				}).catch(() => {});

			},
			/** 刷新按钮操作 */
			handleRefresh(row) {
				let id = this.$route.query.shopId;
				getTBusShopInfo(id).then(res => {
					let RefreshableTtimes = res.data.refreshCount
					let RefreshedTimes = res.data.useRefreshCount
					const ids = this.ids;
					const shopId = this.$route.query.shopId;
					// 把写的提示信心需要换行的地方分成数组 confirmText
					const confirmText = ['剩余刷新次数：' + RefreshableTtimes + '', '已刷新次数：' + RefreshedTimes + '',
						'是否确认刷新商品信息编号为"' + ids + '"的数据项？'
					]
					const newDatas = []
					const h = this.$createElement
					for (const i in confirmText) {
						newDatas.push(h('p', {
							style: 'color: red'
						}, confirmText[i]))
					}
					this.$confirm(
						'提示', {
							title: '提示',
							message: h('div', null, newDatas),
							showCancelButton: true,
							confirmButtonText: '确定',
							cancelButtonText: '取消',
							type: 'warning'
						}
					).then(() => {
						this.multiple1 = true;
						this.sxz = true;
						this.lb = false;
						let data = {
							ids: ids,
							shopId: shopId
						}
						return refGoods(data).then(res => {
							if (res.code == 200) {
								this.multiple1 = false;
								this.sxz = false;
								this.lb = true;
								this.getList();
								this.$modal.msgSuccess("刷新成功");
							}
						})
					}).then(() => {}).catch(() => {});
				})

			},
			/** 导出按钮操作 */
			handleExport() {
				this.download('system/goods/export', {
					...this.queryParams
				}, `goods_${new Date().getTime()}.xlsx`)
			}
		}
	};
</script>
