<template>
  <div class="app-container">
    <el-form
      :model="getListByUserquery"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="100px"
    >
      <el-form-item label="护理站编号" prop="nurseStationCode">
        <el-input
          v-model="getListByUserquery.nurseStationCode"
          placeholder="请输入护理站编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="护理站名称" prop="nurseStationName">
        <el-input
          v-model="getListByUserquery.nurseStationName"
          placeholder="请输入护理站名称"
          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:station:add']"
          >新增</el-button
        >
      </el-col> -->
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['system:station:edit']"
          >修改</el-button
        >
      </el-col>

      <el-col :span="1.5">
        <el-button
          type="info"
          plain
          icon="el-icon-upload2"
          size="mini"
          @click="handledata"
          v-hasPermi="['system:station:importStationInfo']"
          >导入</el-button
        >
      </el-col>

      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>
    <el-table
      v-loading="loading"
      :data="nurseStationlist"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column
        label="护理站编号"
        align="center"
        prop="nurseStationCode"
        width="150"
      />
      <el-table-column
        label="护理站名称"
        align="center"
        prop="nurseStationName"
        :show-overflow-tooltip="true"
      />
      <el-table-column label="所属区域" align="center" prop="area">
        <template slot-scope="scope">
          <span>{{
            scope.row.areaName !== "null-null-null-null"
              ? scope.row.areaName
              : ""
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="护理站地址"
        align="center"
        prop="address"
        :show-overflow-tooltip="true"
      />
      <el-table-column label="护理站经度" align="center" prop="longitude" />
      <el-table-column label="护理站纬度" align="center" prop="latitude" />
      <el-table-column label="联系电话" align="center" prop="phone" />
      <el-table-column label="负责人" align="center" prop="dutyPerson" />
      <el-table-column label="负责人电话" align="center" prop="dutyPhone" />
      <el-table-column label="创建时间" align="center" prop="createTime" />
      <el-table-column label="创建人" align="center" prop="createBy" />
      <el-table-column
        label="操作"
        align="center"
        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:station:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:station:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total2 > 0"
      :total="total2"
      :page.sync="getListByUserquery.pageNum"
      :limit.sync="getListByUserquery.pageSize"
      @pagination="info"
    />
    <!-- 新增修改护理站信息对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="open"
      width="800px"
      append-to-body
      :before-close="cancel"
    >
      <el-form
        :inline="true"
        ref="form"
        :model="form"
        :rules="rules"
        label-width="120px"
      >
        <el-form-item label="所属区域" prop="areaCode">
          <el-select
            v-model="form.provinceName"
            clearable
            placeholder="请选择省"
            style="width: 129px"
          >
            <el-option
              v-for="item in provincelist"
              :key="item.areaCode"
              :label="item.areaName"
              :value="item.areaCode"
              @click.native="province(item)"
            >
            </el-option>
          </el-select>
          <el-select
            v-model="form.cityName"
            clearable
            placeholder="请选择市"
            style="width: 129px; margin-left: 10px"
          >
            <el-option
              v-for="item in citylist"
              :key="item.areaCode"
              :label="item.areaName"
              :value="item.areaCode"
              @click.native="clickcity(item)"
            >
            </el-option>
          </el-select>
          <el-select
            v-model="form.regionName"
            clearable
            placeholder="请选择区"
            style="width: 129px; margin-left: 10px"
          >
            <el-option
              v-for="item in arealist"
              :key="item.areaCode"
              :label="item.areaName"
              :value="item.areaCode"
              @click.native="clickarea(item)"
            >
            </el-option>
          </el-select>
          <el-select
            v-model="form.streetCode"
            clearable
            placeholder="请选择街道"
            style="width: 129px; margin-left: 10px"
          >
            <el-option
              v-for="item in streetlist"
              :key="item.areaCode"
              :label="item.areaName"
              :value="item.areaCode"
              @click.native="clickstreet(item)"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="护理站名称" prop="nurseStationName">
          <el-input
            v-model="form.nurseStationName"
            placeholder="请输入护理站名称"
            maxlength="40"
          />
        </el-form-item>
        <el-form-item label="护理站地址" prop="address">
          <el-input
            v-model="form.address"
            placeholder="请输入护理站地址"
            maxlength="80"
          />
        </el-form-item>
        <el-form-item label="护理站经度" prop="longitude">
          <el-input
            v-model="form.longitude"
            placeholder="请输入护理站经度"
            type="number"
            oninput=" if(value.length>10){value=value.slice(0,20)}"
          />
        </el-form-item>
        <el-form-item label="护理站纬度" prop="latitude">
          <el-input
            v-model="form.latitude"
            placeholder="请输入护理站纬度"
            type="number"
            oninput=" if(value.length>10){value=value.slice(0,20)}"
          />
        </el-form-item>
        <el-form-item label="联系电话" prop="phone">
          <el-input
            v-model="form.phone"
            placeholder="请输入联系电话"
            maxlength="11"
          />
        </el-form-item>
        <el-form-item label="护理机构分类" >
          <template>
            <el-button
              @click="clickinnerVisible()"
              type=""
              style="
                width: 208px;
                text-align: left;
                height: 36px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                color: #c0c4cc;
                margin-top: -10px;
              "
              v-if="form.classifyNameList == '请选择护理站所属机构分类'"
              >{{ form.classifyNameList }}</el-button
            >
            <el-button
              @click="clickinnerVisible()"
              type=""
              style="
                width: 208px;
                text-align: left;
                height: 36px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin-top: -10px;
              "
              v-else
              >{{ form.classifyNameList }}</el-button
            >
          </template>
        </el-form-item>
        <el-form-item label="负责人" prop="dutyPerson">
          <el-input
            v-model="form.dutyPerson"
            placeholder="请输入负责人"
            maxlength="20"
          />
        </el-form-item>
        <el-form-item label="负责人电话" prop="dutyPhone">
          <el-input
            v-model="form.dutyPhone"
            placeholder="请输入负责人联系电话"
            maxlength="11"
          />
        </el-form-item>
        <el-form-item label="排序" prop="sort">
          <el-input
            placeholder="请输入排序"
            v-model.number="form.sort"
            oninput="value=value.replace(/[^\d]/g,'')"
            maxLength="5"
          />
        </el-form-item>
        <el-form-item label="营业概述" prop="openingHoursDescribe">
          <el-input
            style="width: 208px"
            v-model="form.openingHoursDescribe"
            placeholder="请输入护理站营业概述"
            maxlength="150"
          />
        </el-form-item>
        <el-form-item label="上午营业时间" >
          <el-time-select
            style="width: 208px"
            placeholder="上午营业开始时间"
            v-model="form.morningOpenStartTime"
            :picker-options="{
              start: '07:00',
              step: '00:30',
              end: '14:00',
            }"
          >
          </el-time-select>
          <el-time-select
            style="width: 208px; margin-left: 10px"
            placeholder="上午营业结束时间"
            v-model="form.morningOpenEndTime"
            :picker-options="{
              start: '08:00',
              step: '00:30',
              end: '14:30',
            }"
          >
          </el-time-select>
        </el-form-item>
        <el-form-item label="下午营业时间" >
          <el-time-select
            style="width: 208px"
            placeholder="下午营业开始时间"
            v-model="form.afternoonOpenStartTime"
            :picker-options="{
              start: '12:00',
              step: '00:30',
              end: '18:00',
            }"
          >
          </el-time-select>
          <el-time-select
            style="width: 208px; margin-left: 10px"
            placeholder="下午营业结束时间"
            v-model="form.afternoonOpenEndTime"
            :picker-options="{
              start: '13:00',
              step: '00:30',
              end: '20:00',
            }"
          >
          </el-time-select>
        </el-form-item>
        <el-form-item label="护理站总概述" prop="nurseStationDescription">
          <el-input
            style="width: 540px"
            v-model="form.nurseStationDescription"
            placeholder="请输入护理站信息总概述"
            type="textarea"
            maxlength="150"
          />
        </el-form-item>
        <el-form-item label="护理站简介" prop="agencyIntroduce">
          <editor
            @imgs="imgs"
            :min-height="62"
            style="width: 90%; margin: 0 auto"
            v-model="form.agencyIntroduce"
          ></editor>
        </el-form-item>
        <el-form-item
          label="护理站头像"
          prop="stationPictureUrl"
          required
          style="margin-left: 10%"
        >
          <stationAcatar
            @imgUrl="imgUrl"
            :img="form.stationPictureUrl"
            :type="'stationPictureUrl'"
          />
        </el-form-item>
        <el-form-item
          label="护理站简介头像"
          prop="stationIntroducePcitureUrl"
          style="margin-left: 10%"
        >
          <stationAcatar
            @imgUrl="imgUrl2"
            :img="form.stationIntroducePcitureUrl"
            :type="'stationIntroducePcitureUrl'"
          />
        </el-form-item>
        <el-form-item
          label="护理站标签信息"
          required
          label-width="130px"
          style="margin-left: 0px"
        >
          <el-table
            ref="looknurseStationLabel"
            :data="looknurseStationLabel"
            style="margin-top: 50px"
          >
            <el-table-column label="标签名称" width="190" align="center">
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.labelDescription"
                  maxlength="40"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="排序" width="200" align="center">
              <template slot-scope="scope">
                <el-input
                  v-model.number="scope.row.labelSort"
                  oninput="value=value.replace(/[^\d]/g,'')"
                  maxLength="5"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" width="120">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  @click="addnurseStationLabelList"
                  >新增</el-button
                >
                <el-button
                  size="mini"
                  type="text"
                  @click="delnurseStationLabelList(scope.$index, scope.row)"
                  >删除</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </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="Classifyshow"
      width="1100px"
      append-to-body
      :before-close="cancelClassifyshow"
    >
      <el-form :model="classifyquery" label-width="150px" :inline="true">
        <el-form-item label="护理机构分类编码" prop="classifyCode">
          <el-input
            v-model="classifyquery.classifyCode"
            placeholder="请输入护理机构分类编码"
          />
        </el-form-item>
        <el-form-item label="护理机构分类名称" prop="classifyName">
          <el-input
            v-model="classifyquery.classifyName"
            placeholder="请输入护理机构分类名称"
          />
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="classifylistInfo"
            >搜索</el-button
          >
          <el-button
            icon="el-icon-refresh"
            size="mini"
            @click="classifylistcancel"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-table
        v-loading="loading"
        :data="classifylist"
        @cell-dblclick="setCheckedData"
      >
        <el-table-column label="请选择" width="70" align="center">
          <template slot-scope="scope">
            <el-button
              type="primary"
              style="width: 15px; height: 15px"
              circle
              @click="setCheckedData(scope.row)"
              v-if="checkedDataList.find((e) => e == scope.row.id)"
            ></el-button>

            <el-button
              style="width: 15px; height: 15px"
              circle
              v-else
              @click="setCheckedData(scope.row)"
            >
            </el-button>
          </template>
        </el-table-column>
        <el-table-column
          property="classifyCode"
          label="护理项目分类编码"
          align="center"
        >
        </el-table-column>
        <el-table-column
          property="classifyName"
          label="护理项目分类名称"
          align="center"
        >
        </el-table-column>
      </el-table>
      <pagination
        v-show="classifytotal > 0"
        :total="classifytotal"
        :page.sync="classifyquery.pageNum"
        :limit.sync="classifyquery.pageSize"
        @pagination="classifylistInfo"
      />
      <el-button
        type="primary"
        size="mini"
        @click="choiceclassify"
        style="
          margin-top: 30px;
          margin-left: 85%;
          width: 100px;
          height: 50px;
          font-size: 15px;
        "
        >选择完成</el-button
      >
    </el-dialog>
    <!-- //导入 -->
    <el-dialog
      :title="upload.title"
      :visible.sync="upload.open"
      width="400px"
      append-to-body
    >
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip text-center" slot="tip">
          <span>仅允许导入xls、xlsx格式文件。</span>
          <el-link
            type="primary"
            :underline="false"
            style="font-size: 12px; vertical-align: baseline"
            @click="importTemplate"
            >下载模板</el-link
          >
        </div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
// import stationjs from "./stationjs";
// export default stationjs;

import {
  listStation,
  getStation,
  delStation,
  listStationClassify,
  addStation,
  updateStation,
  getFirstLevelInfo,
  getSecondaryLevelInfo,
  updatePicture,
} from "@/api/system/station";
import stationAcatar from "../stationAvatar/index.vue";
import { getListByUser } from "@/api/system/userlist.js";
import { getToken } from "@/utils/auth";
import editor from "@/components/Editor";
export default {
  components: { stationAcatar, editor },
  name: "Station",
  data() {
      // var checkMobile = (rule, value, cb) => {
      //     // 验证手机号的正则表达式
      //     const regMobile =
      //         /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57]|19[0-9])[0-9]{8}$/;
      //     if (regMobile.test(value)) {
      //         return cb();
      //     }
      //     cb(new Error("请输入正确的联系电话"));
      // };
      // 验证手机号的规则
      // var checkMobile2 = (rule, value, cb) => {
      //     // 验证手机号的正则表达式
      //     const regMobile =
      //         /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57]|19[0-9])[0-9]{8}$/;
      //     if (!value) {
      //         //所以当没有值的时候，我们直接callback，让他不校验直接执行下一步
      //         return cb();
      //     } else {
      //         if (regMobile.test(value)) {
      //             return cb();
      //         } else {
      //             cb(new Error("请输入正确的联系电话"));
      //         }
      //     }
      // };
      return {
          imgsurl: { pictureUrlList: [] },
          imageUrl: "",
          imageUrl2: "",
          imgtwo: "",
          imgone: "",
          // 用户导入参数
          upload: {
              // 是否显示弹出层（用户导入）
              open: false,
              // 弹出层标题（用户导入）
              title: "",
              // 是否禁用上传
              isUploading: false,
              // 设置上传的请求头部
              headers: { Authorization: "Bearer " + getToken() },
              // 上传的地址
              url: process.env.VUE_APP_BASE_API +
                  "/system/station/insertNurseStationImportList",
          },
          //护理类型
          nurseTypeCode: "nurse_type_code",
          nurseStationTypelist: [],
          nurseStationType2: null,
          // 遮罩层
          loading: true,
          // 选中数组
          ids: [],
          // 非单个禁用
          single: true,
          // 非多个禁用
          multiple: true,
          // 显示搜索条件
          showSearch: true,
          // 总条数
          total2: 0,
          classifytotal: 0,
          //所属标签
          looknurseStationLabel: [{
              labelDescription: "",
              sort: null,
              idd: 1,
          },],
          // 护理站信息表格数据
          stationList: [{
              sysAreaVOList: [{
                  provinceName: null,
                  cityName: null,
                  streetName: null,
              },],
          },],
          nurseStationlist: [],
          // 弹出层标题
          title: "",
          // 是否显示弹出层
          open: false,
          Classifyshow: false,
          afternoonOpenStartTimeStr: "",
          afternoonOpenEndTimeStr: "",
          //权限查询
          getListByUserquery: {
              pageNum: 1,
              pageSize: 10,
          },
          // 表单参数
          form: {
              nurseStationClassifyIds: [],
          },
          idd: 1,
          provincelist: [],
          arealist: [],
          citylist: [],
          streetlist: [],
          classifylist: [],
          classifyquery: {
              pageNum: 1,
              pageSize: 10,
              classifyCode: "",
              classifyName: "",
          },
          resid: null,
          // 表单校验
          rules: {
              // morningOpenStartTime: [
              //     { required: true, message: "请选择上午营业时间", trigger: "blur" },
              // ],
              // afternoonOpenStartTimeStr: [
              //     { required: true, message: "请选择下午营业时间", trigger: "blur" },
              // ],
              agencyIntroduce: [
                  { required: true, message: "请输入护理站简介", trigger: "blur" },
              ],
              stationIntroducePcitureUrl: [
                  { required: true, message: "请上传护理站简介头像", trigger: "blur" },
              ],
              stationPictureUrl: [
                  { required: true, message: "请上传护理站头像", trigger: "blur" },
              ],
              nurseStationDescription: [
                  { required: true, message: "护理站总概述不能为空", trigger: "blur" },
              ],
              phone: [{
                  required: true,
                  // validator: checkMobile,
                  trigger: "blur",
                  message: "请输入手机号",
              },],

              dutyPhone: [{
                  // validator: checkMobile2,
                  trigger: "blur",
                  message: "请输入联系电话",
              },],
              sort: [{ required: true, message: "排序不能为空", trigger: "blur" }],
              address: [{ required: true, message: "地址不能为空", trigger: "blur" }],
              longitude: [
                  { required: true, message: "经度不能为空", trigger: "blur" },
              ],
              latitude: [
                  { required: true, message: "纬度不能为空", trigger: "blur" },
              ],
              areaCode: [
                  { required: true, message: "所属区域不能为空", trigger: "blur" },
              ],
              nurseStationName: [
                  { required: true, message: "护理站名称不能为空", trigger: "blur" },
              ],
              nurseStationType: [
                  { required: true, message: "请选择护理站类型", trigger: "blur" },
              ],
          },

          checkedDataList: []// 选择的护理机构分类
      };
  },
  created() {
      this.getaddress();
      this.info();
      this.classifylistInfo();
  },
  methods: {
      imgs(item) {
          this.imgsurl.pictureUrlList.push(item);
      },
      imgUrl(imgUrl) {
          this.form.stationPictureUrl = imgUrl;
      },
      imgUrl2(imgUrl) {
          this.form.stationIntroducePcitureUrl = imgUrl;
      },
      delnurseStationLabelList(index, item) {
          // this.looknurseStationLabel.splice(index,1)
          if (this.looknurseStationLabel.length === 1) {
              this.looknurseStationLabel = [{
                  labelDescription: "",
                  sort: null,
                  idd: 1,
              },];
          } else {
              this.looknurseStationLabel.splice(index, 1);
          }
      },
      addnurseStationLabelList() {
          if (this.looknurseStationLabel.length == 5) {
              this.$message.error("最多只能5条");
          } else {
              this.idd++;
              var obj = {
                  labelDescription: "",
                  sort: null,
                  idd: this.idd,
              };
              this.looknurseStationLabel.push(obj);
          }
      },
      //点击街道
      clickstreet(item) {
          this.form.areaCode = item.areaCode;
      },
      //点击区县城
      clickarea(item) {
          this.form.areaCode = "";
          this.form.streetCode = "";
          getSecondaryLevelInfo(item.id).then((res) => {
              this.streetlist = res.data;
          });
      },
      //点击市
      clickcity(item) {
          this.form.regionName = "";
          this.form.areaCode = "";
          this.form.streetCode = "";
          getSecondaryLevelInfo(item.id).then((res) => {
              this.arealist = res.data;
          });
      },
      //点击省
      province(item) {
          this.form.cityName = "";
          this.form.regionName = "";
          this.form.areaCode = "";
          this.form.streetCode = "";
          getSecondaryLevelInfo(item.id).then((res) => {
              this.citylist = res.data;
          });
      },
      /** 获取省列表 */
      getaddress() {
          getFirstLevelInfo().then((res) => {
              this.provincelist = res.data;
          });
      },
      getList() {
          this.info();
      },
      // 取消按钮
      cancel() {
          var obj = { pictureUrlList: [] };
          if (this.imgone != this.form.stationIntroducePcitureUrl) {
              obj.pictureUrlList.push(this.form.stationIntroducePcitureUrl);
          }
          if (this.imgtwo != this.form.stationPictureUrl) {
              obj.pictureUrlList.push(this.form.stationPictureUrl);
          }
          if (obj.pictureUrlList.length > 0) {
              updatePicture(obj).then((res) => { });
          }
          if (this.imgsurl.pictureUrlList.length > 0) {
              updatePicture(this.imgsurl).then((res) => { });
          }
          this.imgsurl = { pictureUrlList: [] };
          this.open = false;
          this.reset();
          this.arealist = []
          this.citylist = []
          this.streetlist = []
      },
      // 表单重置
      reset() {
          this.nurseStationType2 = [];
          this.form = {
              id: null,
              areaCode: null,
              nurseStationCode: null,
              nurseStationName: null,
              nurseStationType: null,
              agencyIntroduce: null,
              nurseStationDescription: null,
              longitude: null,
              latitude: null,
              phone: null,
              address: null,
              dutyPerson: null,
              dutyPhone: null,
              stationPictureUrl: null,
              stationIntroducePcitureUrl: null,
              sort: null,
              nurseStationLabelList: [],
              streetCode: null,
              openingHoursDescribe: null,
              afternoonOpenStartTimeStr: "00:00:00", //下午开始
              afternoonOpenEndTimeStr: "00:00:00", //下午结束
              morningOpenEndTimeStr: "00:00:00", //上午结束
              morningOpenStartTimeStr: "00:00:00", //上午开始
              nurseStationClassifyIds: [],
              classifyNameList: '请选择护理站所属机构分类',
          };
          this.resetForm("form");
      },
      //护理机构分类
      clickinnerVisible() {
          this.classifylistInfo();
          // 回显数据
          this.checkedDataList = JSON.parse(JSON.stringify(this.form.nurseStationClassifyIds));
          this.Classifyshow = true;
      },
      classifylistcancel() {
          this.classifyquery = {
              pageNum: 1,
              pageSize: 10,
              classifyCode: "",
              classifyName: "",
          };
          this.classifylistInfo();
      },
      // 设置已选数据
      setCheckedData(e) {
          // 若已存在id 则为删除
          if (this.checkedDataList.find(el => el == e.id)) {
              this.checkedDataList = this.checkedDataList.filter(ele => ele != e.id)
          }
          else {
              // 不存在 添加进id
              this.checkedDataList.push(e.id);
          }
      },
      // 完成选择
      choiceclassify() {
          this.form.nurseStationClassifyIds = JSON.parse(JSON.stringify(this.checkedDataList));
          // 根据id获取到所有name
          if (this.form.nurseStationClassifyIds.length == 0) {
              this.form.classifyNameList = '请选择护理站所属机构分类'
          } else {
              this.form.classifyNameList = "";
              this.form.nurseStationClassifyIds.forEach(f => {
                  let classify = this.classifylist.find(d => d.id == f)
                  if (!classify)
                        return;
                  this.form.classifyNameList += classify.classifyName + ","
              })
              this.form.classifyNameList = this.form.classifyNameList.substring(0, this.form.classifyNameList.length - 1)
          }
          this.cancelClassifyshow();
      },
      /** 查询护理机构分类信息列表 */
      classifylistInfo() {
          listStationClassify(this.classifyquery).then((response) => {
              this.classifylist = response.rows;
              this.classifytotal = response.total;
              this.loading = false;
          });
      },
      cancelClassifyshow() {
          // this.classifylistInfo();
          this.Classifyshow = false;
      },
      //护理站列表
      info() {
          this.loading = true
          getListByUser(this.getListByUserquery).then((res) => {
              this.nurseStationlist = res.rows;
              this.total2 = res.total;
              this.loading = false
          });
      },
      handleQuery() {
          this.loading = true;
          this.getListByUserquery.pageNum = 1;
          this.info();
      },
      /** 重置按钮操作 */
      resetQuery() {
          this.getListByUserquery = {
              pageNum: 1,
              pageSize: 10,
              areaCode: null,
              userId: null,
              nurseStationCode: null,
              nurseStationName: null,
              nurseStationType: null,
              agencyIntroduce: null,
              nurseStationDescription: null,
              longitude: null,
              latitude: null,
              phone: null,
              address: null,
              dutyPerson: null,
              dutyPhone: null,
              stationPictureUrl: null,
              sort: 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.looknurseStationLabel = [{
              labelDescription: "",
              sort: null,
              idd: 1,
          },];
          this.title = "添加护理站信息";
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
          this.reset();
          this.loading = true;
          const id = row.id || this.ids;
          getStation(id).then((response) => {
              if (response.data.nurseClassifyInfoList) {
                  response.data.nurseStationClassifyIds = []
                  response.data.nurseClassifyInfoList.forEach(e => {
                      response.data.nurseStationClassifyIds.push(e.id)
                  })
              }
              this.form = response.data;
              this.form.streetCode = this.form.streetName;
              this.imgone = this.form.stationIntroducePcitureUrl;
              this.imgtwo = this.form.stationPictureUrl;
              this.looknurseStationLabel = response.data.nurseStationLabel;
              this.open = true;
              this.loading = false;
          });
      },
      /** 提交按钮 */
      submitForm() {
          if (this.form.afternoonOpenStartTime) {
              this.form.afternoonOpenStartTimeStr= this.form.afternoonOpenStartTime
          }else{
              this.form.afternoonOpenStartTimeStr= "00:00:00"
          }
          if (!this.form.afternoonOpenEndTime) {
              this.form.afternoonOpenEndTimeStr= "00:00:00"
          }else{
              this.form.afternoonOpenEndTimeStr= this.form.afternoonOpenEndTime
          }
          if (!this.form.morningOpenStartTime) {
              this.form.morningOpenStartTimeStr= "00:00:00"
          }else{
              this.form.morningOpenStartTimeStr= this.form. morningOpenStartTime
          }
          if (!this.form.morningOpenEndTime) {
              this.form.morningOpenEndTimeStr= "00:00:00"
          }else{
              this.form.morningOpenEndTimeStr= this.form.morningOpenEndTime
          }
          this.form.nurseStationLabelList = this.looknurseStationLabel;
          this.form.nurseStationType = this.nurseStationType2;
          this.$refs["form"].validate((valid) => {
              if (valid) {
                  this.form.areaCode = Number(this.form.areaCode);
                  this.form.nurseStationType = this.nurseStationType2.join(",");
                  if (this.form.id != null) {
                      updateStation(this.form).then((response) => {
                          var obj = { pictureUrlList: [] };
                          if (this.imgone != this.form.stationIntroducePcitureUrl) {
                              obj.pictureUrlList.push(this.imgone);
                          }
                          if (this.imgtwo != this.form.stationPictureUrl) {
                              obj.pictureUrlList.push(this.imgtwo);
                          }
                          this.imgsurl = { pictureUrlList: [] };
                          if (obj.pictureUrlList.length > 0) {
                              updatePicture(obj).then((res) => { });
                          }
                          this.$modal.msgSuccess("修改成功");
                          this.open = false;
                          this.getList();
                      });
                  } else {
                      addStation(this.form).then((response) => {
                          if (response.code) {
                              this.$modal.msgSuccess("新增成功");
                              this.open = false;
                              this.getList();
                          } else {
                              this.form.nurseStationType = obj;
                          }
                      });
                  }
              }
          });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
          const ids = row.id || this.ids;
          this.$modal
              .confirm("是否确认删除此护理站信息？")
              .then(function () {
                  return delStation(ids);
              })
              .then(() => {
                  var obj = { pictureUrlList: [] };
                  obj.pictureUrlList.push(row.stationIntroducePcitureUrl);
                  obj.pictureUrlList.push(row.stationPictureUrl);
                  if (obj.pictureUrlList.length > 0) {
                      updatePicture(obj).then((res) => { });
                  }
                  this.getList();
                  this.$modal.msgSuccess("删除成功");
              })
              .catch(() => { });
      },
      /** 导出按钮操作 */
      handleExport() {
          this.download(
              "system/station/export", {
              ...this.getListByUserquery,
          },
              `station_${new Date().getTime()}.xlsx`
          );
      },
      /** 导入按钮操作 */
      handledata() {
          this.upload.title = "护理站信息导入";
          this.upload.open = true;
      },
      /** 下载模板操作 */
      importTemplate() {
          this.download(
              "/system/station/downloadTemplate?fileType=nurseStation", {},
              `护理站信息导入模板.xlsx`
          );
      },
      // 提交上传文件
      submitFileForm() {
          this.$refs.upload.submit();
      },
      // 文件上传成功处理
      handleFileSuccess(response, file, fileList) {
          this.upload.open = false;
          this.upload.isUploading = false;
          this.$refs.upload.clearFiles();
          this.$alert(
              "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
              response.msg +
              "</div>",
              "导入结果", { dangerouslyUseHTMLString: true }
          );
          this.getList();
      },
      // 文件上传中处理
      handleFileUploadProgress(event, file, fileList) {
          this.upload.isUploading = true;
      },
  },
};
</script>
