<template>
  <div id="backgroundColor">
    <div id="whiteBackground">
      <div id="text">
        <h1><span>常见问题</span></h1>

        <el-collapse v-model="activeNames" @change="handleChange">
          <el-collapse-item class="title_style" title=">>>>网站简介" name="-1">
            <div>
              <span>
                <h2>欢迎使用我们的智慧家政预约平台！</h2>
              </span>
              <p>
                <strong><span>若您想做家政</span></strong><span>，只需填写个人信息和家政经历，您的信息就能轻松发布到平台上，获得更多工作机会。</span>
              </p>
              <p>
                <strong><span>若您想找家政</span></strong><span>，经过我们团队严格审核的优质家政人员信息也将在平台上展示，让雇主轻松找到合适家政人员，同时也为家政人员提供更多就业机会。</span>
              </p>
              <p>
                <span>我们的网站不仅易于使用，同时也十分安全可靠，</span><u><span>严格保护用户的个人隐私信息。</span></u><span>我们全程关注着平台运作，希望让雇主和家政人员之间的交流更加顺畅。</span>
              </p>
              <p>
                <span>无论是寻找家政服务，还是提供家政服务，我们的网站都能够为您提供更好的选择和帮助。现在就来注册我们的网站，开启您的家政之旅！</span>
              </p>
            </div>
          </el-collapse-item>

          <el-collapse-item title=">>>>雇主相关问题" name="-2">
            <h2><span>雇主相关</span></h2>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h3><span>找家政</span></h3>

            <div>
              <h4><span>步骤一 完善信息</span></h4>
              <ol start="">
                <li><span>注册或切换为雇主身份</span></li>
                <li>
                  <span>进入导航栏右上角</span><strong><span>个人中心</span></strong><span>→个人信息内填写您的</span><strong><span>基础信息</span></strong><span>（注意正确填写</span><strong><span>地址</span></strong><span>和</span><strong><span>手机号</span></strong><span>，以便于家政人员上门服务）</span>
                </li>
              </ol>
              <h4><span>步骤二 预约家政人员</span></h4>
              <ol>
                <li>
                  <span>您可以直接在导航栏左上角点击</span><strong><span> 找家政</span></strong><span> 查找符合期望条件的家政人员</span>
                </li>
                <li>
                  <span>找到你中意的家政人员后，点击</span><strong><span>预约</span></strong><span>。</span>
                </li>
                <li>
                  <span>选择服务时间，成功</span><strong><span>支付</span></strong><span>订单</span>
                </li>
              </ol>
              <h4><span>步骤二 完成订单及评价</span></h4>
              <ol start="">
                <li>
                  <span>成功支付后，可以在我的个人中心→我的订单查看订单信息，即可等待家政人员上门</span>
                </li>
                <li>
                  <strong><span>服务结束后</span></strong><span>，在个人中心→我的订单点击</span><strong><span>已完成</span></strong>
                </li>
                <li>
                  <span>在个人中心→我的订单对家政人员进行</span><strong><span>评价</span></strong>
                </li>
              </ol>
            </div>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h3><span>如何切换家政人员身份</span></h3>
            <div>
              <p>
                <span>点击网站导航栏右侧头像→切换身份，登出账号，以雇主身份登录/注册
                  ，完善您个人信息及状态后，审核后即可接单。</span>
              </p>
            </div>
          </el-collapse-item>
          <el-collapse-item title=">>>>家政人员相关问题" name="-5">
            <h2><span>家政人员相关</span></h2>
            <br />
            <h3><span>做家政</span></h3>
            <div>
              <h4><span>步骤一 完善信息</span></h4>
              <ol start="">
                <li>
                  <span>注册或切换为</span><strong><span>家政人员身份</span></strong>
                </li>
                <li>
                  <span>进入导航栏右上角</span><strong><span>个人中心</span></strong><span>→个人信息内填写您的</span><strong><span>基础信息</span></strong><span>和</span><strong><span>家政经历</span></strong><span>并保存</span>
                </li>
              </ol>
              <h4><span>步骤二 发布状态</span></h4>
              <ol start="">
                <li>
                  <span>点击个人中心→</span><strong><span>发布状态</span></strong><span>，正确填写后点击发布，等待管理员审核。</span>
                </li>
                <li>
                  <span>审核成功后，您的状态即可在搜索页内显示，
                    可以被雇主看到和搜索。</span>
                </li>
              </ol>
              <h4><span>步骤三 接受订单</span></h4>
              <ol start="">
                <li>
                  <span>有雇主下单后，您可以在个人中心→我的订单</span><strong><span>查看订单信息</span></strong>
                </li>
                <li>
                  <span>根据订单信息</span><strong><span>上门服务</span></strong>
                </li>
                <li>
                  <span>服务结束后，在个人中心→我的评价查看雇主给您的评价</span>
                </li>
              </ol>
            </div>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h3><span>状态相关</span></h3>
            <div>
              <h4><span>状态有什么用</span></h4>
              <p>
                <strong><span>位置：</span></strong><span>个人中心→我的状态 </span>
              </p>
              <p>
                <strong><span>简介：</span></strong><span>为给您提供更好的求职服务，我们特别开发了“我的状态”功能，让您可以自由动态编辑个人家政服务能力、期望归属分类以及心仪薪酬待遇等等信息；
                  相当于您的家政简历。
                </span>
              </p>
              <p>
                <strong><span>编写流程：</span></strong><span>完善填写并及时发布后，我们的审核员会快速审核通过，确保您的信息能被雇主准确快速地搜索到。若审核失败，您可以根据上方管理员发送的信息重新修改发布。</span>
              </p>
              <p>
                <span>此外，您不想接单时，点击右下角滑动按钮可以将状态设为私密。</span>
              </p>
            </div>

            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h4><span>状态审核时间需要多久</span></h4>
            <div>
              <p>
                <span>状态审核时间为1~3个工作日，相关人员会尽快为您审核，
                  请您耐心等待。</span>
              </p>
            </div>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h4><span>雇主能看到您什么信息</span></h4>
            <div>
              <p>
                <span>在状态审核成功后，雇主能看到您在个人中心填写的</span><strong><span>状态</span></strong><span>，个人信息中的</span><strong><span>家政经历</span></strong><span>。</span>
              </p>
            </div>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <h3><span>如何切换雇主身份</span></h3>
            <div>
              <p>
                <span>点击网站导航栏右侧头像→切换身份，登出账号，以雇主身份登录/注册
                </span>
              </p>
            </div>
          </el-collapse-item>
        </el-collapse>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "UserHelp",
  data() {
    return {
      activeNames: ["-1"],
    };
  },

  created() { },
  methods: {
    handleChange(val) {
      console.log(val);
    },
  },
};
</script>

<style scoped>
#backgroundColor {
  background-color: rgb(237, 244, 237);
  width: 100%;
  padding-top: 4rem;
  padding-bottom: 3rem;
}

/* //白色背景 */
#whiteBackground {
  background-color: white;
  width: 80rem;
  margin: 0 auto;
  border-radius: 1rem;
  padding-top: 0.2rem;
  margin-top: 3rem;
}

#text {
  background-color: white;
  width: 70rem;
  padding-left: 10rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-weight: bold;
  line-height: 1.4;
  cursor: text;
  text-align: left;
}

h1 {
  font-size: 2.25em;
  line-height: 1.2;
  border-bottom: 1px solid #eee;
}

h2 {
  font-size: 1.75em;
  line-height: 1.225;
  border-bottom: 1px solid #eee;
}

h3 {
  font-size: 1.5em;
  line-height: 1.43;
}

h4 {
  font-size: 1.25em;
}

h5 {
  font-size: 1em;
}

h6 {
  font-size: 1em;
  color: #777;
}

p,
ul,
ol {
  margin: 0.8em 0;
  text-align: left;
}
</style>