<template>
  <div class="p-2" style="padding: 10px;">
      <a-steps :current="1" style="margin: 40px 20px 20px 20px;width: 90%;margin-left: 5%;">
        <!-- <template #progressDot="{ index, status, prefixCls }">
          <a-popover>
            <template #content>
              <span>step {{ index }} status: {{ status }}</span>
            </template>
            <span :class="`${prefixCls}-icon-dot`" />
          </a-popover>
        </template> -->
        <a-step title="第一步" description="同步服务指令用于各护理机构间服务指令的相互镜像同步"/>
        <a-step title="第二步" description="请选择同步服务指令的源护理机构" />
        <a-step title="第三步" description="请选择同步服务指令的目标护理机构" />
        <a-step title="第四步" sub-title="同步服务指令" description="页面分左右两部分：左侧为源护理机构，右侧为目标护理机构；" />
      </a-steps>
  </div>
</template>

<script lang="ts" name="serviceDirective-configServiceDirective" setup>
import { ref, reactive, onMounted } from 'vue';
 

function init(record){
console.log("🚀 ~ init ~ record:", record)
}

  defineExpose({
    init,
  });
</script>

<style lang="less" scoped>
.jeecg-basic-table-form-container {
  padding: 0;

  .table-page-search-submitButtons {
    display: block;
    margin-bottom: 24px;
    white-space: nowrap;
  }

  .query-group-cust {
    min-width: 100px !important;
  }

  .query-group-split-cust {
    width: 30px;
    display: inline-block;
    text-align: center
  }

  .ant-form-item:not(.ant-form-item-with-help) {
    margin-bottom: 16px;
    height: 32px;
  }

  :deep(.ant-picker),
  :deep(.ant-input-number) {
    width: 100%;
  }
}

audio::-webkit-media-controls-timeline {
  display: none;
}

audio::-webkit-media-controls-current-time-display,
audio::-webkit-media-controls-time-remaining-display {
  display: none;
}

.btnPrivate {
  height: 34px;
  margin-left: 4px;
}
</style>
