在Vue项目中实现登录和注册功能，可以使用Element UI库来简化界面的开发。以下是一个简单的例子：

1. 首先确保Element UI已经安装在你的Vue项目中。如果没有安装，可以通过以下命令安装：

npm install element-ui --save

2. 在你的Vue项目中引入Element UI：

// main.js
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import App from './App.vue'
 
Vue.use(ElementUI)
 
new Vue({
  el: '#app',
  render: h => h(App)
})

3. 创建登录和注册的组件：

// Login.vue
<template>
  <el-form ref="loginForm" :model="loginForm" label-width="80px">
    <el-form-item label="用户名">
      <el-input v-model="loginForm.username" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="密码">
      <el-input type="password" v-model="loginForm.password" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitLogin">登录</el-button>
    </el-form-item>
  </el-form>
</template>
 
<script>
export default {
  data() {
    return {
      loginForm: {
        username: '',
        password: ''
      }
    }
  },
  methods: {
    submitLogin() {
      // 这里应该是登录请求的逻辑，比如验证用户名和密码
      console.log('登录信息', this.loginForm)
      // 登录成功后的逻辑，比如跳转到首页
      this.$router.push('/')
    }
  }
}
</script>

// Register.vue
<template>
  <el-form ref="registerForm" :model="registerForm" label-width="80px">
    <el-form-item label="用户名">
      <el-input v-model="registerForm.username" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="密码">
      <el-input type="password" v-model="registerForm.password" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="确认密码">
      <el-input type="password" v-model="registerForm.confirmPassword" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitRegister">注册</el-button>
    </el-form-item>
  </el-form>
</template>
 
<script>
export default {
  data() {
    return {
      registerForm: {
        username: '',
        password: '',
        confirmPassword: ''
      }
    }
  },
  methods: {
    submitRegister() {
      // 这里应该是注册请求的逻辑，比如验证表单和密码匹配
      console.log('注册信息', this.registerForm)
      // 注册成功后的逻辑，比如提示注册成功并跳转到登录页面
      this.$router.push('/login')
    }
  }
}
</script>

4. 在路由文件中设置登录和注册的路由：

// router.js
import Vue from 'vue'
import Router from 'vue-router'

在IntelliJ IDEA中全局引入并运行Element UI，你需要执行以下步骤：

1. 安装Node.js和npm（如果尚未安装）。
2. 创建一个新的Vue.js项目或打开现有的项目。
3. 在项目目录中运行npm install element-ui --save以安装Element UI。
4. 在Vue组件中全局引入Element UI。

以下是示例代码：

1. 打开终端或命令行工具，确保你在项目的根目录中。
2. 运行以下命令来安装Element UI：

npm install element-ui --save

3. 在你的主要入口文件（如main.js或app.js）中，全局引入Element UI：

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
 
Vue.use(ElementUI);
 
// 其余的Vue配置...

4. 现在你可以在Vue组件中使用Element UI的组件了。例如，使用一个Element UI的按钮：

<template>
  <div>
    <el-button type="primary">点击我</el-button>
  </div>
</template>
 
<script>
export default {
  // 组件逻辑...
};
</script>

确保IDEA已经配置了npm脚本支持，你可以通过IDEA的Terminal运行npm命令来安装依赖或启动项目。如果你在运行项目时遇到了问题，检查package.json文件中的依赖是否正确安装，以及是否有其他配置错误。

在 Element UI 的 el-cascader 组件中，可以通过监听 change 事件来获取级联选择的所有节点的 label 和 value。你可以在事件处理函数中访问 val 参数，它是一个数组，包含了每一级选中项的信息。

以下是一个简单的例子：

<template>
  <el-cascader
    :options="options"
    @change="handleCascaderChange">
  </el-cascader>
</template>
 
<script>
export default {
  data() {
    return {
      options: [
        {
          value: 'guid1',
          label: 'Node1',
          children: [
            {
              value: 'guid-1-1',
              label: 'Child1',
            },
            // ... 更多子选项
          ],
        },
        // ... 更多顶级选项
      ],
    };
  },
  methods: {
    handleCascaderChange(val) {
      // val 是一个数组，包含每一级选中的节点信息
      console.log(val); // 例如: [{value: 'guid1', label: 'Node1'}, {value: 'guid-1-1', label: 'Child1'}]
      
      // 获取最后一个元素，即最后一级选中的节点信息
      const lastNode = val[val.length - 1];
      console.log('Label:', lastNode.label); // 输出最后一级选中的 label
      console.log('Value:', lastNode.value); // 输出最后一级选中的 value
    },
  },
};
</script>

在这个例子中，每次级联选择发生变化时，handleCascaderChange 方法都会被调用，并且会输出当前选中项的 label 和 value。如果需要获取所有级别的 label 和 value，可以直接访问 val 数组中的每个元素。

在ElementUI的el-table组件中，可以通过在el-table-column的label属性中使用el-tooltip组件来实现标题列的hover显示提示信息。以下是一个简单的示例代码：

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column label="日期">
      <template slot-scope="scope">
        {{ scope.row.date }}
      </template>
    </el-table-column>
    <el-table-column label="状态" width="100">
      <template slot-scope="scope">
        <el-tag :type="scope.row.status | statusFilter">{{ scope.row.status }}</el-tag>
      </template>
    </el-table-column>
    <el-table-column label="名称" width="150">
      <template slot-scope="scope">
        <el-tooltip class="item" effect="dark" placement="top-start">
          <div slot="content">这是一段内容, 这是一段内容, 这是一段内容</div>
          <div>{{ scope.row.name }}</div>
        </el-tooltip>
      </template>
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        status: 'pending'
      }, {
        date: '2016-05-04',
        name: '李小虎',
        status: 'success'
      }, {
        date: '2016-05-01',
        name: '赵小虎',
        status: 'fail'
      }]
    }
  },
  filters: {
    statusFilter(status) {
      const statusMap = {
        success: 'success',
        pending: 'gray',
        fail: 'danger'
      }
      return statusMap[status]
    }
  }
}
</script>

在这个示例中，我们定义了一个包含三列的表格：日期、状态和名称。名称列使用了el-tooltip组件，当用户将鼠标悬停在该单元格的内容上时，会显示提示信息。这是一个简单的实现标题列显示提示信息的方法。

在使用Element UI的表格（el-table）进行滚动加载时，你可以监听表格的滚动事件，并在用户滚动到表格底部时触发加载更多数据的操作。以下是一个简单的例子：

<template>
  <el-table
    :data="tableData"
    height="400"
    @scroll="handleScroll"
    v-loading="loading"
  >
    <!-- 列配置 -->
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [],
      loading: false,
      page: 1,
      pageSize: 10,
      total: 0,
    };
  },
  methods: {
    fetchData() {
      this.loading = true;
      // 模拟异步请求数据
      setTimeout(() => {
        // 这里应该是发起请求获取数据
        const start = (this.page - 1) * this.pageSize;
        const end = start + this.pageSize;
        this.tableData = Array.from({ length: this.pageSize }, (_, i) => ({
          id: start + i,
          name: `Name ${start + i}`,
          // ...其他数据
        }));
        this.total = 100; // 假设总数据量为100
        this.loading = false;
      }, 1000);
    },
    handleScroll(event) {
      const target = event.target;
      // 检查是否滚动到底部
      if (target.scrollHeight - target.scrollTop <= target.clientHeight) {
        if (this.tableData.length < this.total) {
          this.page += 1;
          this.fetchData();
        }
      }
    }
  },
  mounted() {
    this.fetchData();
  }
};
</script>

在这个例子中，我们设置了表格的height属性，使其可以滚动。当表格滚动到底部时，我们通过监听scroll事件来判断并加载更多数据。fetchData方法用于异步获取数据，并模拟了一个请求过程。在实际应用中，你需要替换这部分代码以发起真实的网络请求，并处理返回的数据。

在Vue中使用Element UI的el-table组件时，如果遇到嵌套行（使用el-table-column的嵌套）导致影子行出现问题，可能是由于渲染错误或是样式冲突引起的。

解决方法通常包括以下几个步骤：

1. 确保Element UI的版本是最新的，或者至少是稳定版本。
2. 检查是否有样式冲突，尤其是与自定义CSS规则的冲突。
3. 如果是由于样式导致的问题，可以尝试重写或调整影子行的样式。
4. 确保嵌套行的数据正确，并且每个嵌套行都有唯一的key。
5. 如果问题依然存在，可以尝试简化表格的结构，逐步排除可能的冲突源。

示例代码：

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="date" label="日期" width="180">
    </el-table-column>
    <el-table-column label="配送信息">
      <el-table :data="innerData" style="width: 100%">
        <el-table-column prop="name" label="姓名" width="180">
        </el-table-column>
        <el-table-column prop="address" label="地址">
        </el-table-column>
      </el-table>
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        {
          date: '2016-05-02',
          name: '张三',
          address: '上海市普陀区金沙江路 1518 弄'
        },
        // ... 更多数据
      ],
      // 嵌套表格的数据
      innerData: [
        {
          name: '李四',
          address: '上海市普陀区金沙江路 1517 弄'
        },
        // ... 更多数据
      ]
    };
  }
};
</script>

在这个例子中，我们使用了嵌套的el-table组件来在el-table-column中创建嵌套行。每个嵌套表格都有自己的数据集innerData。确保每个数据项都有唯一的key，比如通过v-for指令中的索引或者其他唯一标识。

如果问题依然存在，可以通过调试工具检查影子行的样式，并进行相应的修正。如果是Element UI的bug，可以考虑在Element UI的GitHub仓库中查找相关问题报告，或者提交新的问题。

在<el-date-picker>中使用disabledDate属性来限制不可选择的日期。你可以设置一个方法，该方法返回一个布尔值，表示某个日期是否不可选择。

以下是一个例子，展示如何设置<el-date-picker>组件，使其只允许选择今天起90天内的日期（包括今天）：

<template>
  <el-date-picker
    v-model="date"
    type="date"
    placeholder="选择日期"
    :disabled-date="disabledDate"
  ></el-date-picker>
</template>
 
<script>
export default {
  data() {
    return {
      date: ''
    };
  },
  methods: {
    disabledDate(time) {
      // 获取90天前的日期
      const days90Ago = new Date();
      days90Ago.setTime(days90Ago.getTime() - 90 * 24 * 3600 * 1000);
 
      // 禁用今天之后的日期，并且禁用90天前的日期
      return time.getTime() > Date.now() || time.getTime() < days90Ago.getTime();
    }
  }
};
</script>

在这个例子中，disabledDate方法返回一个布尔值，如果选择的日期不在90天内（包括今天），则返回true，表示该日期不可选择。

这个问题通常是因为Vue组件的响应式数据更新没有被正确地检测到。以下是一些可能的原因和解决方法：

1. 数据更新方法不正确：确保你是在正确的生命周期钩子或者方法中更新数据。例如，你不能在data 选项内部直接修改this.someData，因为这不是响应式的。你应该使用Vue.set方法或者以新对象替换旧对象。
2. 数据是对象的属性：如果你在数据中有对象，并且在这个对象上设置了新属性，Vue可能无法检测到这个属性的添加。你应该在对象创建时就包含所有的属性，或者使用Vue.set来保证新属性是响应式的。
3. 数据未正确返回：如果你使用了计算属性或者侦听器，确保它们依赖的数据没有问题，并且最终返回了正确的值。
4. 异步数据更新：如果数据是异步获取的（例如通过API），确保在数据实际更新后触发Vue的更新机制。你可能需要在数据获取后使用this.$forceUpdate() 强制组件重新渲染，但这不是推荐的做法，因为它可能会导致性能问题。
5. v-for 用于el-input：如果你在el-table的el-table-column中使用了v-for来渲染el-input，确保你绑定的:key是唯一的，因为这可能会影响Vue的渲染优化。
6. CSS问题：有时候CSS可能会导致元素不可见或者渲染错误，使得更新看起来没有反应。检查是否有覆盖样式导致输入框不可见或者位置不对。
7. Vue开发者工具：使用Vue开发者工具检查数据是否真的被更新了，以及是否有任何Vue警告或错误出现。

以下是一个简单的例子来说明如何使用Vue.set来确保对象属性是响应式的：

// 假设有一个组件的data如下
data() {
  return {
    user: {
      name: 'Alice'
    }
  };
},
 
// 在某个方法中更新user的age属性
methods: {
  updateUserAge(newAge) {
    // 错误的方式，可能不会更新视图
    // this.user.age = newAge;
 
    // 正确的方式，使用Vue.set确保age属性是响应式的
    this.$set(this.user, 'age', newAge);
 
    // 或者替换整个user对象，确保所有属性都是响应式的
    // this.user = { ...this.user, age: newAge };
  }
}

总结，要解决这个问题，你需要确保数据的更新是正确的，并且遵循Vue的响应式原则。使用Vue.set或者替换对象可以确保新添加的属性是响应式的。如果问题依然存在，可以利用Vue开发者工具进行详细调试。

要使用Element UI和XLSX库来实现一个简单的导入Excel功能，你可以使用Element UI的<el-upload>组件来上传文件，然后使用XLSX来解析Excel文件。以下是一个简单的实现示例：

1. 安装Element UI和XLSX库（如果尚未安装）：

npm install element-ui
npm install xlsx

2. 在你的Vue组件中引入Element UI和XLSX：

import Vue from 'vue'
import { Upload } from 'element-ui'
import XLSX from 'xlsx'
 
Vue.use(Upload)

3. 添加上传组件和方法来处理文件：

<template>
  <el-upload
    action="#"
    :on-change="handleFileChange"
    :before-upload="beforeUpload"
  >
    <el-button size="small" type="primary">点击上传Excel</el-button>
  </el-upload>
</template>
 
<script>
export default {
  methods: {
    beforeUpload(file) {
      const isExcel = /\.(xlsx|xls|csv)$/.test(file.name);
      if (!isExcel) {
        this.$message.error('只能上传.xlsx、.xls、.csv 文件!');
        return false;
      }
      return true;
    },
    handleFileChange(file, fileList) {
      const reader = new FileReader();
      reader.onload = (e) => {
        const data = new Uint8Array(e.target.result);
        const workbook = XLSX.read(data, { type: 'array' });
        const firstSheetName = workbook.SheetNames[0];
        const worksheet = workbook.Sheets[firstSheetName];
        const json = XLSX.utils.sheet_to_json(worksheet);
        console.log(json);
        // 处理json数据
      };
      reader.readAsArrayBuffer(file.raw);
    }
  }
}
</script>

在这个示例中，我们使用了el-upload组件来上传文件，并通过before-upload钩子检查文件类型是否为Excel。在文件改变时，我们通过handleFileChange方法读取文件内容，并使用XLSX解析Excel文件为JSON。然后你可以根据需要进一步处理这些数据。

该查询涉及到的是使用Node.js、Vue.js和Element UI来构建一个无需费血液的血液中心管理系统的示例。由于涉及的代码量较大，我将提供一个简化版本的示例，包括如何创建一个简单的Vue组件，该组件使用Element UI来显示一个包含基本表格的页面。

首先，确保你已经安装了Node.js和Vue CLI。

1. 创建一个新的Vue项目（如果你还没有）:

vue create blood-center-management-system

2. 进入项目目录并启动项目:

cd blood-center-management-system
npm run serve

3. 安装Element UI:

npm i element-ui -S

4. 在Vue项目中使用Element UI。在main.js中添加以下内容:

import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import App from './App.vue'
 
Vue.use(ElementUI)
 
new Vue({
  render: h => h(App),
}).$mount('#app')

5. 创建一个简单的Vue组件，例如BloodCenter.vue，使用Element UI的<el-table>组件来显示血液中心的数据:

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="date" label="日期" width="180"></el-table-column>
      <el-table-column prop="name" label="姓名" width="180"></el-table-column>
      <el-table-column prop="address" label="地址"></el-table-column>
    </el-table>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '李小虎',
        address: '上海市普陀区金沙江路 1517 弄'
      }, {
        date: '2016-05-01',
        name: '赵小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      }, {
        date: '2016-05-03',
        name: '孙小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }]
    }
  }
}
</script>

6. 在App.vue中引入BloodCenter.vue组件并使用它:

<template>
  <div id="app">
    <BloodCenter />
  </div>
</template>
 
<script>
import BloodCenter from './components/BloodCenter.vue'
 
export default {
  components: {
    BloodCenter
  }
}
</script>

这个简单的示例展示了如何在Vue项目中集成Element UI，并使用其中的表格组件来展示一些示例数据。在实际的血液中心管理系统中，你需要根据实际的后端API来获取和展示数据。