<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="model">
				<el-select
					v-model="queryParams.type"
					@keyup.enter.native="handleQuery"
					style="width: 50%"
				>
					<el-option label="全部" :value="null"></el-option>
					<el-option label="非IOT仪器" :value="1"></el-option>
					<el-option label="IOT仪器" :value="2"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="仪器名称" prop="name">
				<el-input
					v-model="queryParams.name"
					placeholder="请输入仪器名称进行搜索"
					clearable
					@keyup.enter.native="handleQuery"
				/>
			</el-form-item>
			<el-form-item label="仪器ID" prop="id">
				<el-input
					v-model="queryParams.id"
					placeholder="请输入仪器ID进行搜索"
					clearable
					@keyup.enter.native="handleQuery"
				/>
			</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-row :gutter="10" class="mb8">
			<el-col :span="1.5">
				<el-button
					type="primary"
					plain
					icon="el-icon-plus"
					size="mini"
					@click="handleAdd"
					v-hasPermi="['system:instrument:add']"
					>新增
				</el-button>
			</el-col>
			<right-toolbar
				:showSearch.sync="showSearch"
				@queryTable="getList"
			></right-toolbar>
		</el-row>

		<el-table
			v-loading="loading"
			:data="instrumentList"
			@selection-change="handleSelectionChange"
		>
			<el-table-column
				type="selection"
				fixed="left"
				width="55"
				align="center"
			/>
			<el-table-column label="升序排序" align="center" prop="sortNo" />
			<el-table-column label="仪器ID" align="center" prop="id" />
			<el-table-column label="仪器类型" align="center" prop="type">
				<template slot-scope="scope">
					<span v-show="scope.row.type == 1">非iot仪器</span>
					<span v-show="scope.row.type == 2">iot仪器</span>
				</template>
			</el-table-column>
			<el-table-column
				label="仪器封面"
				align="center"
				prop="banner"
				width="150px"
			>
				<template slot-scope="scope">
					<el-avatar
						shape="square"
						:size="100"
						:src="scope.row.banner"
					></el-avatar>
				</template>
			</el-table-column>
			<el-table-column
				label="仪器LOGO"
				align="center"
				prop="logo"
				width="150px"
			>
				<template slot-scope="scope">
					<el-avatar
						shape="square"
						:size="100"
						:src="scope.row.logo"
					></el-avatar>
				</template>
			</el-table-column>
			<el-table-column
				label="仪器名称"
				align="center"
				prop="name"
				width="150px"
			/>
			<el-table-column label="仪器型号" align="center" prop="model" />
			<el-table-column label="保修日期" align="center" prop="guarantee">
				<template slot-scope="scope">
					<span v-show="scope.row.guarantee != null"
						>{{ scope.row.guarantee }}年</span
					>
				</template>
			</el-table-column>
			<el-table-column
				label="可见小程序标签"
				align="center"
				prop="miniTagNames"
				width="150px"
			>
				<template slot-scope="scope">
					<el-tag
						v-for="item in getSplitList(scope.row.miniTagNames)"
						:key="item"
					>
						{{ item }}
					</el-tag>
				</template>
			</el-table-column>
			<el-table-column
				label="可见外部标签"
				align="center"
				prop="wecomTagNames"
				width="150px"
			>
				<template slot-scope="scope">
					<el-tag
						v-for="item in getSplitList(scope.row.wecomTagNames)"
						:key="item"
					>
						{{ item }}
					</el-tag>
				</template>
			</el-table-column>
			<!--<el-table-column
        label="日常打卡奖励"
        align="center"
        prop="dailyClockCredit"
      />
      <el-table-column
        label="额外打卡奖励"
        align="center"
        prop="extraClockCredit"
      />-->
			<el-table-column
				label="操作"
				align="center"
				width="200px"
				fixed="right"
				class-name="small-padding fixed-width"
			>
				<template slot-scope="scope">
					<el-button
						size="mini"
						type="text"
						icon="el-icon-edit"
						@click="handleUpdate(scope.row)"
						v-hasPermi="['system:instrument:edit']"
						>编辑
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-edit"
						@click="editMiniProgramTags(scope.row)"
					>
						设置小程序可见标签
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-edit"
						@click="editWecomTags(scope.row)"
						>设置外部可见标签
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-edit"
						@click="editInstrumentNameVisible(scope.row)"
					>
						正品控名称配置
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-edit"
						@click="editInstrumentInstructionVisible(scope.row)"
					>
						配置说明书
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-delete"
						@click="handleDelete(scope.row)"
						v-hasPermi="['system:instrument:remove']"
						v-if="scope.row.status == 0"
						>隐藏
					</el-button>
					<el-button
						size="mini"
						type="text"
						icon="el-icon-delete"
						@click="handleDelete(scope.row)"
						v-hasPermi="['system:instrument:remove']"
						v-if="scope.row.status == 1"
						>解除隐藏
					</el-button>
				</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" width="700px" append-to-body>
			<el-form ref="form" :model="form" :rules="rules" label-width="180px">
				<el-form-item label="排序" prop="sortNo">
					<el-input-number
						v-model="form.sortNo"
						controls-position="right"
						:min="0"
						:precision="0"
						placeholder="请输入排序:值越大，排序越前"
					></el-input-number>
				</el-form-item>
				<el-form-item label="仪器封面" prop="banner" width="150px">
					<template>
						<!-- 仪器封面 -->
						<el-upload
							:action="uploadUrl"
							:headers="headers"
							:file-list="bannerFile.fileList"
							list-type="picture-card"
							accept=".jpg,.png"
							:limit="1"
							:class="{ hide: bannerFile.uploadHide }"
							:on-change="bannerUploadChange"
							:on-remove="bannerUploadRemove"
							:on-success="bannerUploadSuccess"
							:on-error="uploadError"
						>
							<i slot="default" class="el-icon-plus"></i>
							<div slot="file" slot-scope="{ file }">
								<img
									class="el-upload-list__item-thumbnail"
									:src="file.url"
									alt=""
								/>
								<span class="el-upload-list__item-actions">
									<span
										class="el-upload-list__item-preview"
										@click="bannerPicturePreview(file)"
									>
										<i class="el-icon-zoom-in"></i>
									</span>
									<span
										v-if="!bannerFile.disabled"
										class="el-upload-list__item-delete"
										@click="bannerUploadRemove(file)"
									>
										<i class="el-icon-delete"></i>
									</span>
								</span>
							</div>
							<div slot="tip" class="el-upload__tip">只能上传jpg/png文件</div>
						</el-upload>
						<!-- 预览窗口 -->
						<el-dialog :visible.sync="bannerFile.dialogVisible" append-to-body>
							<img width="100%" :src="bannerFile.dialogImageUrl" alt="" />
						</el-dialog>
					</template>
				</el-form-item>
				<!--  仪器LOGO  -->
				<el-form-item label="仪器LOGO" prop="logo">
					<template>
						<el-upload
							:action="uploadUrl"
							:headers="headers"
							:file-list="logoFile.fileList"
							list-type="picture-card"
							accept=".jpg,.png"
							:limit="1"
							:class="{ hide: logoFile.uploadHide }"
							:on-change="logoUploadChange"
							:on-remove="logoUploadRemove"
							:on-success="logoUploadSuccess"
							:on-error="uploadError"
						>
							<i slot="default" class="el-icon-plus"></i>
							<div slot="file" slot-scope="{ file }">
								<img
									class="el-upload-list__item-thumbnail"
									:src="file.url"
									alt=""
								/>
								<span class="el-upload-list__item-actions">
									<span
										class="el-upload-list__item-preview"
										@click="logoPicturePreview(file)"
									>
										<i class="el-icon-zoom-in"></i>
									</span>
									<span
										v-if="!logoFile.disabled"
										class="el-upload-list__item-delete"
										@click="logoUploadRemove(file)"
									>
										<i class="el-icon-delete"></i>
									</span>
								</span>
							</div>
							<div slot="tip" class="el-upload__tip">只能上传jpg/png文件</div>
						</el-upload>
						<!-- 预览窗口 -->
						<el-dialog :visible.sync="logoFile.dialogVisible" append-to-body>
							<img width="100%" :src="logoFile.dialogImageUrl" alt="" />
						</el-dialog>
					</template>
				</el-form-item>
				<!--  仪器序列号  -->
				<el-form-item label="仪器序列号图片" prop="serial">
					<template>
						<el-upload
							:action="uploadUrl"
							:headers="headers"
							:file-list="serialFile.fileList"
							list-type="picture-card"
							accept=".jpg,.png"
							:limit="1"
							:class="{ hide: serialFile.uploadHide }"
							:on-change="serialUploadChange"
							:on-remove="serialUploadRemove"
							:on-success="serialUploadSuccess"
							:on-error="uploadError"
						>
							<i slot="default" class="el-icon-plus"></i>
							<div slot="file" slot-scope="{ file }">
								<img
									class="el-upload-list__item-thumbnail"
									:src="file.url"
									alt=""
								/>
								<span class="el-upload-list__item-actions">
									<span
										class="el-upload-list__item-preview"
										@click="serialPicturePreview(file)"
									>
										<i class="el-icon-zoom-in"></i>
									</span>
									<span
										v-if="!serialFile.disabled"
										class="el-upload-list__item-delete"
										@click="serialUploadRemove(file)"
									>
										<i class="el-icon-delete"></i>
									</span>
								</span>
							</div>
							<div slot="tip" class="el-upload__tip">只能上传jpg/png文件</div>
						</el-upload>
						<!-- 预览窗口 -->
						<el-dialog :visible.sync="serialFile.dialogVisible" append-to-body>
							<img width="100%" :src="serialFile.dialogImageUrl" alt="" />
						</el-dialog>
					</template>
				</el-form-item>
				<el-form-item label="手写绑定介绍视频/图片" prop="manualCodeBinding">
					<el-upload
						class="upload-demo"
						:action="uploadUrl"
						:headers="headers"
						:limit="1"
						:on-exceed="manualUploadExceed"
						:on-success="manualUploadSuccess"
						:on-error="uploadError"
						:file-list="manualFile.fileList"
            :before-upload="handleBeforeUpload"
					>
						<el-button size="small" type="primary">点击上传</el-button>
						<div slot="tip" class="el-upload__tip">
							只能上传一个文件，且视频不超过10M，图片不超过1M
						</div>
					</el-upload>
				</el-form-item>
				<el-form-item label="扫码绑定介绍图片" prop="scanCodeBinding">
					<el-upload
						class="upload-demo"
						:action="uploadUrl"
						:headers="headers"
						:limit="1"
						:on-exceed="scanUploadExceed"
						:on-success="scanUploadSuccess"
						:on-error="uploadError"
						:file-list="scanFile.fileList"
            :before-upload="handleBeforeUpload"
					>
						<el-button size="small" type="primary">点击上传</el-button>
						<div slot="tip" class="el-upload__tip">
							只能上传一个文件，且视频不超过10M，图片不超过1M
						</div>
					</el-upload>
				</el-form-item>
				<el-form-item label="仪器名称" prop="name">
					<el-input v-model="form.name" placeholder="请输入仪器名称" />
				</el-form-item>
				<el-form-item label="保修日期" prop="guarantee">
					<el-input-number
						:min="1"
						:precision="0"
						v-model="form.guarantee"
					></el-input-number>
				</el-form-item>
				<!--  <el-form-item label="日常打卡获得积分" prop="dailyClockCredit">
          <el-input-number
            :min="0"
            :precision="0"
            v-model="form.dailyClockCredit"
          ></el-input-number>
        </el-form-item>
        <el-form-item label="开启额外打卡奖励" prop="dailyClockCredit">
          <el-switch
            v-model="form.isExtraClock"
            :active-value="1"
            :inactive-value="0"
            active-color="#13ce66"
            inactive-color="#DCDCDC"
            @change="isExtraClockChange"
          >
          </el-switch>
        </el-form-item>
        <el-form-item
          v-if="form.isExtraClock == 1"
          label="额外打卡奖励积分"
          prop="extraClockCredit"
        >
          <el-input-number
            :min="0"
            :precision="0"
            v-model="form.extraClockCredit"
          ></el-input-number>
        </el-form-item>
        <el-form-item
          v-if="form.isExtraClock == 1"
          label="额外打卡时间"
          prop="extraClockTimeRange"
        >
          <el-date-picker
            v-model="form.extraClockTimeRange"
            clearable
            value-format="yyyy-MM-dd HH:mm:ss"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </el-form-item>-->
				<el-form-item label="仪器绑定积分" prop="bindingCredit">
					<el-input-number
						:min="0"
						:precision="0"
						v-model="form.bindingCredit"
					/>
				</el-form-item>
				<el-form-item label="仪器类型" prop="type">
					<el-select
						v-model="form.type"
						style="width: 50%"
						@change="typeChange"
					>
						<el-option label="非IOT仪器" :value="1"></el-option>
						<el-option label="IOT仪器" :value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item v-if="form.type == 2" label="仪器型号" prop="model">
					<el-select v-model="form.model" @change="modelChange" style="width: 50%">
						<el-option label="FR200" value="FR200"></el-option>
						<el-option label="WL200" value="WL200"></el-option>
						<el-option label="FR380" value="FR380"></el-option>
						<el-option label="FR390" value="FR390"></el-option>
						<el-option label="M01" value="M01"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="模式" prop="modeIdsValue">
					<template>
						<el-select
							v-model="form.modeIdsValue"
							multiple
							placeholder="请选择模式"
							@change="modeIdsValueChang"
						>
							<el-option
								v-for="item in this.mode.modeIdsOptions"
								:key="item.id"
								:label="item.modeName"
								:value="item.id"
							>
							</el-option>
						</el-select>
						<el-button
							v-if="
								form.modeIdsValue != undefined &&
								form.modeIdsValue != null &&
								form.modeIdsValue.length > 1
							"
							@click="openModeIdDialog()"
							size="small"
							type="primary"
							>排序
						</el-button>
					</template>
				</el-form-item>
				<el-form-item label="带NEW标识模式" prop="newModeIdList">
					<template>
						<el-select
							v-model="form.newModeIdList"
							multiple
							placeholder="请选择带new标识模式"
						>
							<el-option
								v-for="item in newModeOptionList"
								:key="item.id"
								:label="item.modeName"
								:value="item.id"
							>
							</el-option>
						</el-select>
					</template>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="生成护理记录最短时间"
					prop="nursingTime"
				>
					<el-time-picker
						v-model="form.nursingTime"
						value-format="HH:mm:ss"
						placeholder="请选择护理时长"
					>
					</el-time-picker>
				</el-form-item>
				<el-form-item label="扫机身码" prop="isScanCode">
					<el-switch
						v-model="form.isScanCode"
						:active-value="1"
						:inactive-value="0"
						active-color="#13ce66"
						inactive-color="#DCDCDC"
					>
					</el-switch>
				</el-form-item>
				<el-form-item label="是否支持购买" prop="isPurchase">
					<el-select
						v-model="form.isPurchase"
						style="width: 50%"
						@change="isPurchaseChang"
					>
						<el-option label="是" :value="1"></el-option>
						<el-option label="否" :value="0"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item
					v-if="form.isPurchase == 1"
					label="商城小程序appid"
					prop="shoppingAppid"
				>
					<el-input
						v-model="form.shoppingAppid"
						placeholder="请输入商城小程序appid"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.isPurchase == 1"
					label="商城小程序path"
					prop="shoppingPath"
				>
					<el-input
						v-model="form.shoppingPath"
						placeholder="请输入商城小程序path"
					/>
				</el-form-item>

				<el-form-item label="初次护理弹窗" prop="firstNurse">
					<el-button size="small" type="primary" @click="addNurse()"
						>添加规则
					</el-button>
					<input
						ref="nurseFile"
						id="nurseFile"
						type="file"
						name="file"
						accept=".png,.jpg,.jpeg,.gif,.mpeg,.mp4,.avi,.mov,.wmv"
						@change="nurseFileChange($event)"
					/>
					<el-table
						v-if="nurseList.length"
						:data="nurseList"
						border
						style="width: 100%"
						v-loading="loading"
					>
						<el-table-column label="弹窗提示图片或视频" width="140">
							<template slot-scope="scope">
								<template v-if="!scope.row.file">
									<el-button
										size="small"
										type="primary"
										@click="addNurseFile(scope.$index)"
										>上传文件
									</el-button>
								</template>
								<template v-else>
									<template v-if="scope.row.fileType === 'image'">
										<ImagePreview :src="scope.row.file" />
									</template>
									<template v-else>
										<div style="width: 80px; height: 80px">
											<video
												style="width: 100%; height: 100%"
												:src="scope.row.file"
											></video>
										</div>
									</template>
								</template>
							</template>
						</el-table-column>
						<el-table-column prop="message" label="规则提示内容">
							<template slot-scope="scope">
								<el-input
									placeholder="请输入"
									v-model="scope.row.message"
									clearable
								></el-input>
							</template>
						</el-table-column>
						<el-table-column fixed="right" label="操作" width="80">
							<template slot-scope="scope">
								<el-popconfirm
									@confirm="handleNurseDelete(scope)"
									confirm-button-text="确定"
									cancel-button-text="取消"
									icon="el-icon-info"
									icon-color="red"
									title="确定删除吗？"
								>
									<el-button slot="reference" type="text" size="small"
										>删除
									</el-button>
								</el-popconfirm>
							</template>
						</el-table-column>
					</el-table>
				</el-form-item>

				<el-form-item label="仪器介绍" prop="instrumentIntroduce">
					<el-button size="small" type="primary" @click="addIntroduce()"
						>添加介绍
					</el-button>
					<input
						ref="introduceFile"
						id="introduceFile"
						type="file"
						name="file"
						accept=".png,.jpg,.jpeg,.gif,.mpeg,.mp4,.avi,.mov,.wmv"
						@change="introduceFileChange($event)"
					/>
					<el-table
						v-if="introduceList.length"
						:data="introduceList"
						border
						style="width: 100%"
						v-loading="loading"
					>
						<el-table-column label="弹窗提示图片或视频" width="140">
							<template slot-scope="scope">
								<template v-if="!scope.row.file">
									<el-button
										size="small"
										type="primary"
										@click="addIntroduceFile(scope.$index)"
										>上传文件
									</el-button>
								</template>
								<template v-else>
									<template v-if="scope.row.fileType === 'image'">
										<ImagePreview :src="scope.row.file" />
									</template>
									<template v-else>
										<div style="width: 80px; height: 80px">
											<video
												style="width: 100%; height: 100%"
												:src="scope.row.file"
											></video>
										</div>
									</template>
								</template>
							</template>
						</el-table-column>
						<el-table-column prop="message" label="规则提示内容">
							<template slot-scope="scope">
								<el-input
									placeholder="请输入"
									v-model="scope.row.message"
									clearable
								></el-input>
							</template>
						</el-table-column>
						<el-table-column fixed="right" label="操作" width="80">
							<template slot-scope="scope">
								<el-popconfirm
									@confirm="handleIntroduceDelete(scope)"
									confirm-button-text="确定"
									cancel-button-text="取消"
									icon="el-icon-info"
									icon-color="red"
									title="确定删除吗？"
								>
									<el-button slot="reference" type="text" size="small"
										>删除
									</el-button>
								</el-popconfirm>
							</template>
						</el-table-column>
					</el-table>
				</el-form-item>

				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接中图片"
					prop="bluetoothConnecting"
				>
					<el-upload
						class="upload-demo"
						:action="uploadUrl"
						:headers="headers"
						:limit="1"
						:on-exceed="bluetoothConnectUploadExceed"
						:on-success="bluetoothConnectUploadSuccess"
						:on-error="uploadError"
						:file-list="bluetoothConnectFile.fileList"
						accept=".png,.jpg,.jpeg,.gif,.mpeg,.mp4,.avi,.mov,.wmv"
					>
						<el-button size="small" type="primary">点击上传</el-button>
						<div slot="tip" class="el-upload__tip">只能上传一个文件</div>
					</el-upload>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接中标题"
					prop="bluetoothConnectingTitle"
				>
					<el-input
						v-model="form.bluetoothConnectingTitle"
						placeholder="请输入蓝牙连接中标题"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接中文案"
					prop="bluetoothConnectingContent"
				>
					<el-input
						v-model="form.bluetoothConnectingContent"
						placeholder="请输入蓝牙连接中文案"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接失败图片"
					prop="bluetoothConnectFail"
				>
					<el-upload
						class="upload-demo"
						:action="uploadUrl"
						:headers="headers"
						:limit="1"
						:on-exceed="bluetoothFailUploadExceed"
						:on-success="bluetoothFailUploadSuccess"
						:on-error="uploadError"
						:file-list="bluetoothConnectFailFile.fileList"
						accept=".png,.jpg,.jpeg,.gif,.mpeg,.mp4,.avi,.mov,.wmv"
					>
						<el-button size="small" type="primary">点击上传</el-button>
						<div slot="tip" class="el-upload__tip">只能上传一个文件</div>
					</el-upload>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接失败标题"
					prop="bluetoothConnectFailTitle"
				>
					<el-input
						v-model="form.bluetoothConnectFailTitle"
						placeholder="请输入蓝牙连接失败标题"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙连接失败文案"
					prop="bluetoothConnectFailContent"
				>
					<el-input
						v-model="form.bluetoothConnectFailContent"
						placeholder="请输入蓝牙连接失败文案"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙断开连接图片"
					prop="bluetoothClosed"
				>
					<el-upload
						class="upload-demo"
						:action="uploadUrl"
						:headers="headers"
						:limit="1"
						:on-exceed="bluetoothClosedUploadExceed"
						:on-success="bluetoothClosedUploadSuccess"
						:on-error="uploadError"
						:file-list="bluetoothClosedFile.fileList"
						accept=".png,.jpg,.jpeg,.gif,.mpeg,.mp4,.avi,.mov,.wmv"
					>
						<el-button size="small" type="primary">点击上传</el-button>
						<div slot="tip" class="el-upload__tip">只能上传一个文件</div>
					</el-upload>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙断开连接标题"
					prop="bluetoothClosedTitle"
				>
					<el-input
						v-model="form.bluetoothClosedTitle"
						placeholder="请输入蓝牙断开连接标题"
					/>
				</el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="蓝牙断开连接文案"
					prop="bluetoothClosedContent"
				>
					<el-input
						v-model="form.bluetoothClosedContent"
						placeholder="请输入蓝牙断开连接文案"
					/>
				</el-form-item>
        <el-form-item v-if="form.type == 2" label="IOT版本" prop="iotVersion">
          <div style="position: relative">
            <el-tooltip
              class="item"
              effect="dark"
              content="此项仅研发可以配置，其他用户勿操作"
              placement="top-start"
            >
              <i class="iotVersion-absolute-info el-icon-info"></i>
            </el-tooltip>
          </div>
          <el-input v-model="form.iotVersion" placeholder="请输入IOT版本" />
        </el-form-item>
        <el-form-item
          v-if="form.type == 2"
          label="IOT升级数据文件"
          prop="iotUpgradeData"
        >
          <div style="position: relative">
            <el-tooltip
              class="item"
              effect="dark"
              content="此项仅研发可以配置，其他用户勿操作"
              placement="top-start"
            >
              <i class="iotUpgradeData-absolute-info el-icon-info"></i>
            </el-tooltip>
          </div>
          <el-upload
            class="upload-demo"
            :action="uploadUrl"
            :headers="headers"
            :limit="1"
            :on-exceed="iotUpgradeUploadExceed"
            :on-success="iotUpgradeUploadSuccess"
            :on-error="uploadError"
            :file-list="iotUpgradeFile.fileList"
          >
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传一个文件</div>
          </el-upload>
        </el-form-item>
				<el-form-item
					v-if="form.type == 2"
					label="IOT版本升级介绍"
					prop="iotVersionUpgrade"
				>
					<div style="position: relative">
						<el-tooltip
							class="item"
							effect="dark"
							content="此项仅研发可以配置，其他用户勿操作"
							placement="top-start"
						>
							<i class="absolute-info el-icon-info"></i>
						</el-tooltip>
					</div>
					<editor
						v-model="form.iotVersionUpgrade"
						placeholder="请输入内容"
						:min-height="192"
					/>
				</el-form-item>
        <!--  WE200      -->
        <el-form-item v-if="form.type == 2" label="WE200IOT版本" prop="we200IotVersion">
          <div style="position: relative">
            <el-tooltip
              class="item"
              effect="dark"
              content="此项仅研发可以配置，其他用户勿操作"
              placement="top-start"
            >
              <i class="we200-iotVersion-absolute-info el-icon-info"></i>
            </el-tooltip>
          </div>
          <el-input v-model="form.we200IotVersion" placeholder="请输入WE200IOT版本" />
        </el-form-item>
        <el-form-item
          v-if="form.type == 2"
          label="WE200IOT升级数据文件"
          prop="we200IotUpgradeData"
        >
          <div style="position: relative">
            <el-tooltip
              class="item"
              effect="dark"
              content="此项仅研发可以配置，其他用户勿操作"
              placement="top-start"
            >
              <i class="we200-iotUpgradeData-absolute-info el-icon-info"></i>
            </el-tooltip>
          </div>
          <el-upload
            class="upload-demo"
            :action="uploadUrl"
            :headers="headers"
            :limit="1"
            :on-exceed="we200IotUpgradeUploadExceed"
            :on-success="we200IotUpgradeUploadSuccess"
            :on-error="uploadError"
            :file-list="we200IotUpgradeFile.fileList"
          >
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传一个文件</div>
          </el-upload>
        </el-form-item>
        <el-form-item
          v-if="form.type == 2"
          label="WE200IOT版本升级介绍"
          prop="we200IotVersionUpgrade"
        >
          <div style="position: relative">
            <el-tooltip
              class="item"
              effect="dark"
              content="此项仅研发可以配置，其他用户勿操作"
              placement="top-start"
            >
              <i class="we200-absolute-info el-icon-info"></i>
            </el-tooltip>
          </div>
          <editor
            v-model="form.we200IotVersionUpgrade"
            placeholder="请输入内容"
            :min-height="192"
          />
        </el-form-item>
			</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="编辑小程序可见标签"
			:visible.sync="miniProgramTag.visible"
			width="50%"
		>
			<el-form ref="miniProgramTag" :model="miniProgramTag" label-width="150px">
				<el-row>
					<el-col :span="100">
						<el-form-item
							label="小程序标签"
							prop="selectTagList"
							label-width="100px"
						>
							<treeselect
								v-model="miniProgramTag.selectTagList"
								:options="miniProgramTag.optionTree"
								:multiple="true"
								:show-count="true"
								placeholder="请选择小程序标签"
								:disable-branch-nodes="true"
							/>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="miniProgramTag.visible = false">取 消</el-button>
				<el-button type="primary" @click="submitMiniProgramTagList"
					>确 定
				</el-button>
			</div>
		</el-dialog>

		<!-- 编辑企微可见标签   -->
		<el-dialog
			title="编辑企微可见标签"
			:visible.sync="wecomTag.visible"
			width="50%"
		>
			<el-form :model="wecomTag" label-width="150px">
				<el-row>
					<el-col :span="100">
						<el-form-item
							label="小程序标签"
							prop="tagIdArray"
							label-width="100px"
						>
							<treeselect
								v-model="wecomTag.selectTagList"
								:options="wecomTag.optionTree"
								:multiple="true"
								:show-count="true"
								placeholder="请选择小程序标签"
								:disable-branch-nodes="true"
							/>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="wecomTag.visible = false">重 置</el-button>
				<el-button type="primary" @click="submitWecomTagList">确 定</el-button>
			</div>
		</el-dialog>

		<el-dialog
			title="正品控商品名配置"
			:visible.sync="instrumentName.visible"
			width="50%"
		>
			<el-button
				size="mini"
				type="primary"
				icon="el-icon-add"
				@click="addInstrumentNameline()"
				>新增</el-button
			>
			<el-table
				:show-header="false"
				v-loading="loading"
				:data="instrumentName.nameForm"
			>
				<el-table-column type="index" width="55" align="center" />
				<el-table-column align="center" prop="productName" width="400">
					<template slot-scope="scope">
						<el-input
							placeholder="请输入正品控名称"
							v-model="scope.row.productName"
							clearable
						/>
					</template>
				</el-table-column>
				<el-table-column>
					<template slot-scope="scope">
						<el-button
							size="mini"
							type="text"
							icon="el-icon-save"
							@click="saveInstrumentName(scope.row)"
							>保存
						</el-button>
						<el-button
							size="mini"
							type="text"
							icon="el-icon-delete"
							@click="delInstrumentName(scope)"
							>删除</el-button
						>
					</template>
				</el-table-column>
			</el-table>
		</el-dialog>

		<el-dialog
			title="产品说明书配置"
			:visible.sync="instrumentInstructions.visible"
			width="50%"
		>
			<el-button
				size="mini"
				type="primary"
				icon="el-icon-add"
				@click="addInstrumentInstructionLine()"
				>添加说明书
			</el-button>
			<el-table
				v-loading="loading"
				:data="instrumentInstructions.instructionList"
			>
				<el-table-column
					align="center"
					prop="name"
					width="200"
					label="说明书类型"
				>
					<template slot-scope="scope">
						<el-input
							placeholder="请输入说明书类型"
							v-model="scope.row.name"
							clearable
						/>
					</template>
				</el-table-column>
				<el-table-column
					align="center"
					prop="link"
					width="250"
					label="说明书(每个类型只能上传一个说明书)"
				>
					<!--  scope.row.link        -->
					<template slot-scope="scope">
						<el-upload
							class="upload-demo"
							:action="uploadUrl"
							:headers="headers"
							:limit="1"
							:on-exceed="instructionUploadExceed"
							:on-success="
								(response, file, fileList) => {
									return instructionUploadSuccess(
										response,
										file,
										fileList,
										scope.$index
									)
								}
							"
							:on-error="uploadError"
							:file-list="scope.row.fileList"
							accept=".pdf,.PDF"
						>
							<el-button size="small" type="primary">点击上传</el-button>
						</el-upload>
					</template>
				</el-table-column>
				<el-table-column label="操作">
					<template slot-scope="scope">
            <el-button
              v-if="scope.row.link != null"
              size="mini"
              type="text"
              @click="copyInstructionNameUrl(scope.row)"
            >复制说明书
            </el-button>
						<el-button
              v-if="scope.row.link != null"
							size="mini"
							type="text"
							@click="viewInstrumentInstruction(scope.row)"
							>查看说明书
						</el-button>
						<el-button
              v-if="scope.row.link != null"
							size="mini"
							type="text"
							@click="saveInstrumentInstruction(scope.row)"
							>保存说明书
						</el-button>
						<el-button
              v-if="scope.row.link != null"
							size="mini"
							type="text"
							@click="delInstrumentInstruction(scope)"
							>删除说明书
						</el-button>
					</template>
				</el-table-column>
			</el-table>
		</el-dialog>

		<el-dialog
			title="排序"
			:visible.sync="mode.modeSortVisible"
			width="50%"
			:close-on-click-modal="false"
			:before-close="handleCloseMode"
		>
			<div>
				<draggable v-model="mode.modeIdsValueTemp" draggable=".itemTag">
					<template v-for="element in this.mode.modeIdsValueTemp">
						<el-tag :key="element.id" class="itemTag">
							{{ element.modeName }}</el-tag
						>
					</template>
				</draggable>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="handleCloseMode">取 消</el-button>
				<el-button type="primary" @click="handleSaveMode">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
import {
	listInstrument,
	getInstrument,
	delInstrument,
	addInstrument,
	updateInstrument,
	getMiniProgramTagTree,
	getWecomTagTree,
	listRelate,
	delRelate,
	updateRelate,
	addRelate,
	listInstructions,
	delInstructions,
	addInstructions,
	updateInstructions,
	listAllMode,
	addInstrumentTag,
	listInstrumentTag,
} from '@/api/system/instrument'
import { getToken } from '@/utils/auth'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'

import { upload } from '@/api/upload'

import draggable from 'vuedraggable'

export default {
	name: 'Instrument',
	components: { Treeselect, draggable },
  props: {
    // 大小限制(MB)
    fileSize: {
      type: Number,
      default: 1,
    },
    fileType: {
      type: Array,
      default: () => ["bmp", "gif", "jpg", "jpeg", "png", "mp4", "avi", "rmvb"],
    },
  },
	data() {
		return {
			// 遮罩层
			loading: true,
			// 选中数组
			ids: [],
			// 非单个禁用
			single: true,
			// 非多个禁用
			multiple: true,
			// 显示搜索条件
			showSearch: true,
			// 总条数
			total: 0,
			// 仪器列表格数据
			instrumentList: [],
			// 弹出层标题
			title: '',
			// 是否显示弹出层
			open: false,
			// 查询参数
			queryParams: {
				pageNum: 1,
				pageSize: 10,
				id: null,
				name: null,
				type: null,
			},
			/* 文件上传地址 */
			uploadUrl: process.env.VUE_APP_BASE_API + '/file/upload',
			headers: {
				Authorization: 'Bearer ' + getToken(),
			},
			/* 仪器封面 */
			bannerFile: {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			},
			/* 仪器logo */
			logoFile: {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			},
			/* 序列号图片 */
			serialFile: {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			},
			/* 手写绑定介绍视频/图片 */
			manualFile: {
				uploadHide: false,
				fileList: [],
			},
			/* 扫码绑定介绍视频/图片 */
			scanFile: {
				uploadHide: false,
				fileList: [],
			},
			/* iot升级数据文件 */
			iotUpgradeFile: {
				uploadHide: false,
				fileList: [],
			},
      /* we200iot升级数据文件 */
      we200IotUpgradeFile: {
        uploadHide: false,
        fileList: [],
      },
			/* 蓝牙连接文件 */
			bluetoothConnectFile: {
				uploadHide: false,
				fileList: [],
			},
			/* 蓝牙断开连接文件 */
			bluetoothConnectFailFile: {
				uploadHide: false,
				fileList: [],
			},
			/* 蓝牙断开连接文件 */
			bluetoothClosedFile: {
				uploadHide: false,
				fileList: [],
			},
			/* 小程序可见标签 */
			miniProgramTag: {
				instrumentId: null,
				selectTagList: null,
				visible: false,
				optionTree: [],
			},
			/* 企微可见标签 */
			wecomTag: {
				instrumentId: null,
				selectTagList: null,
				visible: false,
				optionTree: [],
			},
			// 表单参数
			form: {},
			// 表单校验
			rules: {
				sortNo: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
				banner: [{ required: true, message: '仪器封面不能为空' }],
				logo: [{ required: true, message: '仪器logo不能为空' }],
				serial: [{ required: true, message: '序列号图片不能为空' }],
				name: [
					{ required: true, message: '仪器名称不能为空', trigger: 'blur' },
				],
				guarantee: [
					{ required: true, message: '请选择保修日期', trigger: 'blur' },
				],
				dailyClockCredit: [
					{
						required: true,
						message: '日常打卡奖励积分不能为空',
						trigger: 'blur',
					},
				],
				isExtraClock: [
					{ required: true, message: '请选择是否开启额外打卡奖励' },
				],
				bindingCredit: [
					{
						required: true,
						message: '仪器绑定奖励积分',
						trigger: 'blur',
					},
				],
				extraClockCredit: [
					{
						required: true,
						message: '额外打卡奖励积分不能为空',
						trigger: 'blur',
					},
				],
				extraClockTimeRange: [
					{
						required: true,
						message: '额外打卡时间段不能为空',
						trigger: 'blur',
					},
				],
				type: [
					{ required: true, message: '仪器类型不能为空', trigger: 'change' },
				],
				model: [
					{ required: true, message: '仪器型号不能为空', trigger: 'change' },
				],
				modeIdsValue: [
					{ required: true, message: '仪器模式不能为空', trigger: 'change' },
				],
				nursingTime: [
					{
						required: true,
						message: '生成护理记录最短时长不能为空',
						trigger: 'change',
					},
				],
				isPurchase: [{ required: true, message: '是否支持购买' }],
				shoppingAppid: [
					{ required: true, message: '购买商城APPID不能为空', trigger: 'blur' },
				],
				shoppingPath: [
					{ required: true, message: '购买商城PATH不能为空', trigger: 'blur' },
				],
			},
			/** 初次护理规则 */
			imageFileType: ['png', 'jpg', 'jpeg', 'gif'],
			nurseIndex: 0,
			nurseList: [
				{
					file: '',
					fileType: '',
					message: '',
				},
			],
			/** 仪器介绍规则 */
			introduceIndex: 0,
			introduceList: [
				{
					file: '',
					fileType: '',
					message: '',
				},
			],
			/* 正品控商品名 */
			instrumentName: {
				visible: false,
				instrumentId: null,
				nameForm: [],
			},
			// 预览弹窗
			previewSrc: '', // 预览地址
			isPreviewVideo: true, // 预览开关
			/* 仪器说明书 */
			instrumentInstructions: {
				visible: false,
				instrumentId: null,
				instructionList: [
					{
						id: null,
						fileList: [],
						instrumentId: null,
						name: null,
						link: null,
					},
				],
			},
			/* 模式 */
			mode: {
				modeSortVisible: false,
				modeIdsValueTemp: [],
				modeIdsOptions: [],
				sortMode: [],
			},
			newModeOptionList: [],
		}
	},
	created() {
		this.getList()
	},
	methods: {
		/** 查询仪器列列表 */
		getList() {
			this.loading = true
			listInstrument(this.queryParams).then((response) => {
				this.instrumentList = response.rows
				this.total = response.total
			}).finally(() => {
        this.loading = false
      })
		},
		// 取消按钮
		cancel() {
			this.open = false
			this.reset()
		},
		// 表单重置
		reset() {
			this.nurseIndex = 0
			this.nurseList = [
				{
					file: '',
					fileType: '',
					message: '',
				},
			]
			this.introduceIndex = 0
			this.introduceList = [
				{
					file: '',
					fileType: '',
					message: '',
				},
			]
			this.form = {
				id: null,
				name: null,
				type: 1,
				model: 'WL200',
				banner: null,
				logo: null,
				serial: null,
				guarantee: 1,
				dailyClockCredit: 0,
				isExtraClock: 0,
				extraClockCredit: 0,
				/* 额外打卡时间范围 */
				extraClockTimeRange: [],
				bindingCredit: 0,
				miniTagIds: null,
				miniTagNames: null,
				wecomTagIds: null,
				wecomTagNames: null,
				sceneIds: null,
				sceneNames: null,
				nursingTime: null,
				iotVersion: null,
				iotUpgradeData: null,
				isScanCode: 0,
				isPurchase: 0,
				shoppingAppid: null,
				shoppingPath: null,
				bluetoothConnectingTitle: null,
				bluetoothConnectingContent: null,
				bluetoothConnecting: null,
				bluetoothClosed: null,
				bluetoothClosedTitle: null,
				bluetoothClosedContent: null,
				bluetoothConnectFail: null,
				bluetoothConnectFailTitle: null,
				bluetoothConnectFailContent: null,
				iotVersionUpgrade: null,
				sortNo: 1000,
				status: null,
				manualCodeBinding: null,
				scanCodeBinding: null,
				nurseList: null,
				introduceList: null,
				modeIdsValue: [],
				newModeIdList: [],
        we200IotVersion: null,
        we200IotUpgradeData: null,
        we200IotVersionUpgrade: null,
			}
			/* 仪器封面 */
			this.bannerFile = {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			}
			/* 仪器logo */
			this.logoFile = {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			}
			/* 序列号图片 */
			this.serialFile = {
				uploadHide: false,
				dialogImageUrl: '',
				dialogVisible: false,
				disabled: false,
				fileList: [],
			}
			/* 手写绑定介绍视频/图片 */
			this.manualFile = {
				uploadHide: false,
				fileList: [],
			}
			/* 扫码绑定介绍视频/图片 */
			this.scanFile = {
				uploadHide: false,
				fileList: [],
			}
			/* iot升级数据文件 */
			this.iotUpgradeFile = {
				uploadHide: false,
				fileList: [],
			}
			/* 蓝牙连接文件 */
			this.bluetoothConnectFile = {
				uploadHide: false,
				fileList: [],
			}
			/* 蓝牙连接失败文件 */
			this.bluetoothConnectFailFile = {
				uploadHide: false,
				fileList: [],
			}
			/* 蓝牙断开连接文件 */
			this.bluetoothClosedFile = {
				uploadHide: false,
				fileList: [],
			}
			/* 模式 */
			this.mode = {
				modeSortVisible: false,
				modeIdsValueTemp: [],
				modeIdsOptions: [],
				sortMode: [],
			}
			this.newModeOptionList = []
			this.resetForm('form')
		},
		/** 搜索按钮操作 */
		handleQuery() {
			this.queryParams.pageNum = 1
			this.getList()
		},
		/** 重置按钮操作 */
		resetQuery() {
			this.queryParams = {
				pageNum: 1,
				pageSize: 10,
				id: null,
				name: null,
				type: null,
			}
			this.resetForm('queryForm')
			this.handleQuery()
		},
		// 多选框选中数据
		handleSelectionChange(selection) {
			this.ids = selection.map((item) => item.id)
			this.single = selection.length !== 1
			this.multiple = !selection.length
		},
		/** 新增按钮操作 */
		handleAdd() {
			this.reset()
			this.open = true
			this.title = '添加仪器列'
			/* 所有模式选项 */
			this.mode.modeIdsOptions = [];
      listAllMode({
        instrumentType: this.form.type
      }).then((response) => {
        if (response.code != 200) {
          this.$message.error('模式获取失败')
        }
        this.mode.modeIdsOptions = response.data
      })
		},
		/** 修改按钮操作 */
		handleUpdate(row) {
			this.reset()
			const id = row.id || this.ids
			getInstrument(id).then((response) => {
				this.form = response.data
				// 仪器封面回显
				this.bannerFile = {
					uploadHide: true,
					dialogImageUrl: this.form.banner,
					dialogVisible: false,
					disabled: false,
					fileList: [{ name: '', url: this.form.banner }],
				}
				/* 仪器logo */
				this.logoFile = {
					uploadHide: true,
					dialogImageUrl: this.form.logo,
					dialogVisible: false,
					disabled: false,
					fileList: [{ name: '', url: this.form.logo }],
				}
				/* 序列号图片 */
				this.serialFile = {
					uploadHide: true,
					dialogImageUrl: this.form.serial,
					dialogVisible: false,
					disabled: false,
					fileList: [{ name: '', url: this.form.serial }],
				}
				/* 手写绑定介绍视频/图片 */
				if (this.form.manualCodeBinding != null) {
					this.manualFile = {
						uploadHide: true,
						fileList: [
							{
								name: '手写绑定介绍视频/图片',
								url: this.form.manualCodeBinding,
							},
						],
					}
				}
				/* 扫码绑定介绍视频/图片 */
				if (this.form.scanCodeBinding != null) {
					this.scanFile = {
						uploadHide: true,
						fileList: [
							{ name: '扫码绑定介绍视频/图片', url: this.form.scanCodeBinding },
						],
					}
				}
				/* iot升级数据文件 */
				if (this.form.iotUpgradeData != null) {
					this.iotUpgradeFile = {
						uploadHide: true,
						fileList: [
							{ name: 'iot升级数据文件', url: this.form.iotUpgradeData },
						],
					}
				}

				/* 蓝牙连接文件 */
				if (this.form.bluetoothConnecting != null) {
					this.bluetoothConnectFile = {
						uploadHide: true,
						fileList: [
							{ name: '蓝牙连接文件', url: this.form.bluetoothConnecting },
						],
					}
				}
				/* 蓝牙连接失败文件 */
				if (this.form.bluetoothConnectFail != null) {
					this.bluetoothConnectFailFile = {
						uploadHide: true,
						fileList: [
							{ name: '蓝牙连接失败文件', url: this.form.bluetoothConnectFail },
						],
					}
				}
				/* 蓝牙断开连接文件 */
				if (this.form.bluetoothClosed != null) {
					this.bluetoothClosedFile = {
						uploadHide: false,
						fileList: [
							{ name: '蓝牙断开连接文件', url: this.form.bluetoothClosed },
						],
					}
				}
				// 额外打卡时间
				if (this.form.isExtraClock == 1) {
					this.form.extraClockTimeRange = response.data.extraClockTimeRange
				}
				this.open = true
				this.title = '修改仪器列'

				/* 首次护理管理视频 */
				if (response.data.nurseList != null) {
					this.nurseIndex = response.data.nurseList.length
					this.nurseList = response.data.nurseList
				}

				/* 仪器介绍视频 */
				if (response.data.introduceList != null) {
					this.introduceIndex = response.data.introduceList.length
					this.introduceList = response.data.introduceList
				}

				/* 模式选项 */
				this.mode.modeIdsOptions = []
				listAllMode({
          instrumentType: this.form.type,
          instrumentModel: this.form.model
        }).then((response) => {
					if (response.code != 200) {
						this.$message.error('模式获取失败')
					}
					this.mode.modeIdsOptions = response.data

					/* 带new标识选项回显 */
					if (
						this.form.modeIdsValue != null &&
						this.form.modeIdsValue.length > 0
					) {
						let temp = []
						for (let i = 0; i < this.form.modeIdsValue.length; i++) {
							let filterModeArr = this.mode.modeIdsOptions.filter(
								(item) => item !== undefined && this.form.modeIdsValue[i] === item.id
							)
              if(filterModeArr !== undefined && filterModeArr.length > 0) {
                temp.push(filterModeArr[0])
              }
						}
            if(temp !== undefined && temp.length > 0) {
              this.newModeOptionList = temp
            }
					}
				})
			})
		},
		/** 提交按钮 */
		submitForm() {
			this.form.nurseList = this.nurseList
			this.form.introduceList = this.introduceList
			this.$refs['form'].validate((valid) => {
				if (valid) {
					if (this.form.id != null) {
						updateInstrument(this.form).then((response) => {
							this.$modal.msgSuccess('修改成功')
							this.open = false
							this.getList()
						})
					} else {
						addInstrument(this.form).then((response) => {
							this.$modal.msgSuccess('新增成功')
							this.open = false
							this.getList()
						})
					}
				}
			})
		},
		/** 删除按钮操作 */
		handleDelete(row) {
			const ids = row.id
			this.$modal
				.confirm('是否确认隐藏仪器列编号为"' + ids + '"的数据项？')
				.then(function () {
					return delInstrument(ids)
				})
				.then(() => {
					this.getList()
					this.$modal.msgSuccess('操作成功')
				})
				.catch(() => {})
		},
		/* 文件上传失败 */
		uploadError() {
			this.$message.error('文件上传失败')
		},
		/** 仪器封面操作 */
		bannerPicturePreview(file) {
			this.bannerFile.dialogImageUrl = file.url
			this.bannerFile.dialogVisible = true
		},
		bannerUploadRemove(file) {
			this.bannerFile.fileList = []
			this.bannerFile.uploadHide = this.bannerFile.fileList.length >= 1
		},
		bannerUploadChange(file, fileList) {
			this.bannerFile.fileList = fileList
			this.bannerFile.uploadHide = this.bannerFile.fileList.length >= 1
		},
		bannerUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.banner = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/** logo 操作 */
		logoPicturePreview(file) {
			this.logoFile.dialogImageUrl = file.url
			this.logoFile.dialogVisible = true
		},
		logoUploadRemove(file) {
			this.logoFile.fileList = []
			this.logoFile.uploadHide = this.logoFile.fileList.length >= 1
		},
		logoUploadChange(file, fileList) {
			this.logoFile.fileList = fileList
			this.logoFile.uploadHide = this.logoFile.fileList.length >= 1
		},
		logoUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.logo = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/** 序列号图片 操作 */
		serialPicturePreview(file) {
			this.serialFile.dialogImageUrl = file.url
			this.serialFile.dialogVisible = true
		},
		serialUploadRemove(file) {
			this.serialFile.fileList = []
			this.serialFile.uploadHide = this.serialFile.fileList.length >= 1
		},
		serialUploadChange(file, fileList) {
			this.serialFile.fileList = fileList
			this.serialFile.uploadHide = this.serialFile.fileList.length >= 1
		},
		serialUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.serial = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/** 手写绑定介绍视频/图片 操作 */
		manualUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		manualUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.manualCodeBinding = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/** 扫码绑定介绍视频/图片 操作 */
		scanUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		scanUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.scanCodeBinding = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/*  iot升级数据文件 */
		iotUpgradeUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		iotUpgradeUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.iotUpgradeData = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
    /*  iot升级数据文件 */
    we200IotUpgradeUploadExceed(files, fileList) {
      this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
    },
    we200IotUpgradeUploadSuccess(response, file) {
      if (response.code == 200) {
        this.form.we200IotUpgradeData = response.data.url
      } else {
        this.$message.error('图片插入失败')
      }
    },
		/*  蓝牙连接图片 */
		bluetoothConnectUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		bluetoothConnectUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.bluetoothConnecting = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/*  蓝牙断开连接图片 */
		bluetoothFailUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		bluetoothFailUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.bluetoothConnectFail = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/*  蓝牙断开连接图片 */
		bluetoothClosedUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		bluetoothClosedUploadSuccess(response, file) {
			if (response.code == 200) {
				this.form.bluetoothClosed = response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		/* 是否开启额外打卡奖励 */
		isExtraClockChange() {
			if (this.form.isExtraClock == 0) {
				this.form.extraClockCredit = 0
				this.form.extraClockTimeRange = []
			}
		},
		/* 仪器类型切换 */
		typeChange() {
			// 非IOT仪器
			if (this.form.type == 1) {
				this.form.model = null;
				this.form.nursingTime = null;
				this.form.iotVersion = null;
				this.form.iotUpgradeData = null;
				this.form.bluetoothConnecting = null;
				this.form.bluetoothConnectingTitle = null;
				this.form.bluetoothConnectingContent = null;
				this.form.bluetoothConnectFail = null;
				this.form.bluetoothConnectFailTitle = null;
				this.form.bluetoothConnectFailContent = null;
				this.form.bluetoothClosed = null;
				this.form.bluetoothClosedTitle = null;
				this.form.bluetoothClosedContent = null;
				this.form.iotVersionUpgrade = null;
			} else {
        this.form.model = 'WL200';
      }
      /* 模式选项 */
      this.mode.modeIdsOptions = [];
      listAllMode({
        instrumentType: this.form.type,
        instrumentModel: this.form.model
      }).then((response) => {
        if (response.code != 200) {
          this.$message.error('模式获取失败')
        }
        this.mode.modeIdsOptions = response.data
      })
		},
    modelChange() {
      /* 模式选项 */
      this.mode.modeIdsOptions = [];
      listAllMode({
        instrumentType: this.form.type,
        instrumentModel: this.form.model
      }).then((response) => {
        if (response.code != 200) {
          this.$message.error('模式获取失败')
        }
        this.mode.modeIdsOptions = response.data
      })
    },
		/* 是否购买切换 */
		isPurchaseChang() {
			if (this.form.isPurchase == 0) {
				this.form.shoppingAppid = null
				this.form.shoppingPath = null
			}
		},
		/* 设置小程序可见标签 */
		editMiniProgramTags(row) {
			/* 小程序可见标签 */
			this.miniProgramTag.instrumentId = null
			this.miniProgramTag.selectTagList = null
			// 小程序标签树
			getMiniProgramTagTree().then((Response) => {
				this.miniProgramTag.optionTree = Response.data
				this.miniProgramTag.visible = true
				if (row.miniTagIds != null && row.miniTagIds.length > 0) {
					this.miniProgramTag.selectTagList = row.miniTagIds
						.split(',')
						.map(Number)
				}
				this.miniProgramTag.instrumentId = row.id
				listInstrumentTag({
					instrumentId: row.id,
					type: 1,
				}).then((res) => {
					if (res.code == 200 && res.data != null && res.data.length > 0) {
						this.miniProgramTag.selectTagList = res.data.map((obj) => obj.tagId)
					}
				})
			})
		},
		/* 设置企微可见标签 */
		editWecomTags(row) {
			this.wecomTag.instrumentId = null
			this.wecomTag.selectTagList = null
			// 外部标签树
			getWecomTagTree().then((response) => {
				this.wecomTag.optionTree = response.data
				this.wecomTag.visible = true
				if (row.wecomTagIds != null && row.wecomTagIds.length > 0) {
					this.wecomTag.selectTagList = row.wecomTagIds.split(',').map(Number)
				}
				this.wecomTag.instrumentId = row.id
				listInstrumentTag({
					instrumentId: row.id,
					type: 2,
				}).then((res) => {
					if (res.code == 200 && res.data != null && res.data.length > 0) {
						this.wecomTag.selectTagList = res.data.map((obj) => obj.tagId)
					}
				})
			})
		},
		/* 保存小程序标签 */
		submitMiniProgramTagList() {
			if (
				this.miniProgramTag.selectTagList == null ||
				this.miniProgramTag.selectTagList.length == 0
			) {
				this.$message.warning(`请选择小程序标签`)
				return
			}
			addInstrumentTag({
				instrumentId: this.miniProgramTag.instrumentId,
				tagIdList: this.miniProgramTag.selectTagList,
				type: 1,
			}).then((response) => {
				this.$modal.msgSuccess('操作成功')
				this.miniProgramTag.visible = false
				this.getList()
			})
		},
		/* 保存外部标签 */
		submitWecomTagList() {
			if (
				this.wecomTag.selectTagList == null ||
				this.wecomTag.selectTagList.length == 0
			) {
				this.$message.warning(`请选择外部标签`)
				return
			}
			addInstrumentTag({
				instrumentId: this.wecomTag.instrumentId,
				tagIdList: this.wecomTag.selectTagList,
				type: 2,
			}).then((response) => {
				this.$modal.msgSuccess('操作成功')
				this.wecomTag.visible = false
				this.getList()
			})
		},

		/* 初次护理弹窗 */
		addNurse() {
			this.nurseList.push({
				file: '',
				fileType: '',
				message: '',
			})
		},
		handleNurseDelete(item) {
			this.nurseList.splice(item.$index, 1)
		},
		addNurseFile(index) {
			this.nurseIndex = index
			this.$refs.nurseFile.value = ''
			this.$refs.nurseFile.click()
		},
		async nurseFileChange(e) {
			// 图片选中
			let files = e.target.files
			if (files.length) {
				let data = await this.commonFileUpload(files[0])
				this.nurseList[this.nurseIndex].file = data.url
				let type = files[0].type
				let isImage = this.imageFileType.some((item) => type.includes(item))
				if (isImage) {
					this.nurseList[this.nurseIndex].fileType = 'image'
				} else {
					this.nurseList[this.nurseIndex].fileType = 'video'
				}

				this.nurseList = JSON.parse(JSON.stringify(this.nurseList))
			}
		},
		/* 仪器介绍 */
		addIntroduce() {
			this.introduceList.push({
				file: '',
				fileType: '',
				message: '',
			})
		},
		handleIntroduceDelete(item) {
			this.introduceList.splice(item.$index, 1)
		},
		addIntroduceFile(index) {
			this.introduceIndex = index
			this.$refs.introduceFile.value = ''
			this.$refs.introduceFile.click()
		},
		async introduceFileChange(e) {
			let files = e.target.files
			// 图片选中
			if (files.length) {
				let data = await this.commonFileUpload(files[0])
				this.introduceList[this.introduceIndex].file = data.url
				let type = files[0].type
				let isImage = this.imageFileType.some((item) => type.includes(item))
				if (isImage) {
					this.introduceList[this.introduceIndex].fileType = 'image'
				} else {
					this.introduceList[this.introduceIndex].fileType = 'video'
				}

				this.introduceList = JSON.parse(JSON.stringify(this.introduceList))
			}
		},
		/* 文件上传函数 */
		async commonFileUpload(file) {
			this.loading = true
			let formData = new FormData()
			formData.append('file', file)
			let res = await upload(formData)

			this.loading = false
			if (res.code === 200) {
				return res.data
			}
			return false
		},

		getSplitList(data) {
			if (data) {
				return data.split(',')
			}
			return []
		},

		/* 正品控名称配置 */
		addInstrumentNameline() {
			this.instrumentName.nameForm.push({
				id: null,
				instrumentId: this.instrumentName.instrumentId,
				productName: '',
			})
		},
		editInstrumentNameVisible(row) {
			this.instrumentName.instrumentId = row.id
			// 查询现有的正品控名称
			listRelate({
				instrumentId: row.id,
			}).then((response) => {
				if (response.data != null && response.data.length > 0) {
					this.instrumentName.nameForm = response.data
				} else {
					this.instrumentName.nameForm = [
						{
							id: null,
							instrumentId: this.instrumentName.instrumentId,
							productName: '',
						},
					]
				}
				this.instrumentName.visible = true
			})
		},
		delInstrumentName(item) {
			// 获取 id，删除关联的正品控名称
			if (item.row.id != null) {
				// 执行删除
				delRelate(item.row.id).then((response) => {
					this.$modal.msgSuccess('删除成功')
				})
			}
			this.instrumentName.nameForm.splice(item.$index, 1)
			if (this.instrumentName.nameForm.length == 0) {
				this.addInstrumentNameline()
			}
		},
		saveInstrumentName(item) {
			if (item.id != null) {
				updateRelate(item).then((response) => {
					this.$modal.msgSuccess('修改成功')
				})
			} else {
				addRelate(item).then((response) => {
					this.$modal.msgSuccess('新增成功')
				})
			}
		},

		/* 仪器说明书 */
		addInstrumentInstructionLine() {
			this.instrumentInstructions.instructionList.push({
				id: null,
				fileList: [],
				instrumentId: this.instrumentInstructions.instrumentId,
				name: null,
				link: null,
			})
		},
		editInstrumentInstructionVisible(row) {
			this.instrumentInstructions.instrumentId = row.id
			// 查询现有的仪器说明书
			listInstructions({
				instrumentId: row.id,
			}).then((response) => {
				if (response.data != null && response.data.length > 0) {
					this.instrumentInstructions.instructionList = response.data
					for (let i = 0; i < response.data.length; i++) {
						this.instrumentInstructions.instructionList[i].fileList = [
							{
								name: response.data[i].name,
								url: response.data[i].url,
							},
						]
					}
				} else {
					this.instrumentInstructions.instructionList = [
						{
							id: null,
							fileList: [],
							instrumentId: this.instrumentInstructions.instrumentId,
							name: null,
							link: null,
						},
					]
				}
				this.instrumentInstructions.visible = true
			})
		},
		delInstrumentInstruction(item) {
			// 获取 id，删除关联的仪器说明书
			if (item.row.id != null) {
				// 执行删除
				delInstructions(item.row.id).then((response) => {
					this.$modal.msgSuccess('删除成功')
				})
			}
			this.instrumentInstructions.instructionList.splice(item.$index, 1)
			if (this.instrumentInstructions.instructionList.length == 0) {
				this.addInstrumentInstructionLine()
			}
		},
		saveInstrumentInstruction(item) {
			if (item.instrumentId == null) {
				this.$modal.msgError('参数异常')
				return
			}
			if (item.name == null) {
				this.$modal.msgError('请输入说明书名称')
				return
			}
			if (item.link == null) {
				this.$modal.msgError('请上传说明书')
				return
			}
			if (item.id != null) {
				updateInstructions(item).then((response) => {
					this.$modal.msgSuccess('修改成功')
				})
			} else {
				addInstructions(item).then((response) => {
					this.$modal.msgSuccess('新增成功')
				})
			}
		},
		instructionUploadExceed(files, fileList) {
			this.$message.warning(`您已上传了文件，如需更换，请先删除原上传的文件`)
		},
		instructionUploadSuccess(response, file, fileList, index) {
			if (response.code == 200) {
				this.instrumentInstructions.instructionList[index].link =
					response.data.url
			} else {
				this.$message.error('图片插入失败')
			}
		},
		viewInstrumentInstruction(item) {
			window.open(item.nameUrl, '_blank')
		},
    copyInstructionNameUrl(item) {
      navigator.clipboard.writeText(item.nameUrl).then(() => {
        this.$message.success('已成功复制到剪贴板')
      });
    },
		/* 模式 */
		openModeIdDialog() {
			this.mode.modeIdsValueTemp = []
			this.mode.sortMode = []
			if (this.form.modeIdsValue.length > 1) {
				for (let i = 0; i < this.form.modeIdsValue.length; i++) {
					let filterModeArr = this.mode.modeIdsOptions.filter(
						(item) => item.id == this.form.modeIdsValue[i]
					)
					this.mode.modeIdsValueTemp.push(filterModeArr[0])
				}
				this.mode.modeSortVisible = true
			}
		},
		handleCloseMode() {
			this.mode.modeIdsValueTemp = []
			this.mode.sortMode = []
			this.mode.modeSortVisible = false
		},
		handleSaveMode() {
			let newSort = []
			for (let i = 0; i < this.mode.modeIdsValueTemp.length; i++) {
				newSort.push(this.mode.modeIdsValueTemp[i].id)
			}
			this.form.modeIdsValue = newSort
			this.handleCloseMode()
		},
		modeIdsValueChang() {
			let temp = []
			if (this.form.modeIdsValue.length > 0) {
				for (let i = 0; i < this.form.modeIdsValue.length; i++) {
					let filterModeArr = this.mode.modeIdsOptions.filter(
						(item) => item.id == this.form.modeIdsValue[i]
					)
					temp.push(filterModeArr[0])
				}
			}
			this.newModeOptionList = temp
		},
    // 上传前校检格式和大小
    handleBeforeUpload(file) {
      // 校检文件类型
      if (this.fileType) {
        const fileName = file.name.split('.');
        const fileExt = fileName[fileName.length - 1];
        const isTypeOk = this.fileType.indexOf(fileExt) >= 0;
        if (!isTypeOk) {
          this.$modal.msgError(`文件格式不正确`);
          return false;
        }
      }

      // 校检文件大小
      if (this.fileSize) {
        const isLt = file.size / 1024 / 1024 < this.fileSize;
        if (!isLt) {
          this.$modal.msgError(`上传文件大小不能超过 ${this.fileSize} MB!`);
          return false;
        }
      }
      return true;
    },
	},
}
</script>

<style lang="scss" scoped>
::v-deep .hide .el-upload--picture-card {
	display: none;
}

#nurseFile,
#introduceFile {
	position: absolute;
	width: 1px;
	height: 1px;
	left: -100px;
}

video {
	object-fit: fill;
}

.itemTag {
	margin-top: 20px;
	margin-right: 10px;
	cursor: pointer;
}

.absolute-info {
  position: absolute;
  top: 10px;
  left: -140px;
  color: #FAAD14;
}

.iotVersion-absolute-info {
  position: absolute;
  top: 10px;
  left: -84px;
  color: #FAAD14;
}

.iotUpgradeData-absolute-info {
  position: absolute;
  top: 10px;
  left: -140px;
  color: #FAAD14;
}

.we200-absolute-info {
  position: absolute;
  top: 10px;
  left: -183px;
  color: #FAAD14;
}

.we200-iotVersion-absolute-info {
  position: absolute;
  top: 10px;
  left: -128px;
  color: #FAAD14;
}

.we200-iotUpgradeData-absolute-info {
  position: absolute;
  top: 10px;
  left: -184px;
  color: #FAAD14;
}
</style>
