sql工单页面前端代码重构

[LZS911]

描述（Describe）

由于需求迭代原因，导致工单页面部分组件逻辑非常混乱，维护困难，所以产生了代码重构的需求。

页面变更

列表

无变动

创建工单

缺陷修复

1. 创建工单时，切换选择的数据源时，在已选择了数据库的情况下，不会清空选择数据库

现状：

预期：

2. 创建工单时，切换选择的数据源时，在网络较差的情况下，对应的数据库数据依旧会显示上一个数据源的数据，而不是 Loading 效果

现状：

预期：

3. 在编辑工单信息时，选择不同类型的数据源不会自动切换到不同 sql 模式下

现状：

预期：

优化

1. 当审核工单后未提交便离开页面的情况下，给出提示。对应 issue：新增sql审核工单后返回列表，创建的工单直接无了，演示环境也有这个BUG #2162

2. 数据源对应的规则模板的跳转方式调整为新开页面。 对应 issue：建议SQL审核页面的点击跳转规则模版打开新的页面 #2121

3. 创建工单时的数据源名称显示优化。对应 issue：创建工单时的数据源名称显示优化 #2129

页面调整

1. 选择文件上线模式表单样式调整。 理由：在多数据源不同SQL模式下，文件模式选择上线字段对应的应该是某一个数据源下，现有的样式更像是单独的一个模式。

现状：

调整后：

其他建议优化：感觉现在这个功能隐藏得有点太深了，是否考虑在界面加些提示告知用户这个功能。例如哪些数据源支持，以及sql上传模式得选择 sql文件上传方式或者 zip 文件上传方式。

2. 建议优化：多数据源不同SQL模式下sql上传方式的展示方式
   目前采用的是通过 tab 来切换不同数据源对应的 sql 上传方式，当点击审核后会一起对所有数据源一起审核。这里存在一个问题是由于对每个数据源的审核都会发送一次接口，所以可能会出现部分成功、部分数据源失败的情况。这个问题在 v2 to v3 时同步过，但当时并没有提供解决方案
   建议将 tab 展示方式调整为页面直接展示出每一个数据源对应的 sql 上传方式，每一块对应一个 审核 按钮。当所有数据源对应的信息都审核完成后，才能跳转至审核结果页面。（待细节优化以及编辑工单信息时是否需要对应的调整）

工单详情

优化

1. 驳回工单信息展示优化

现状：

调整后：

2. 工单详情信息出现以及隐藏时添加动画效果

对应界面：

3. 驳回工单后修改 sql 信息限制sql上传方式为创建时的方式有隐藏改为禁用

现状：

调整后：

4. 驳回工单后修改sql信息后进行了审核且审核成功但未提交离开页面时给出提示

[hasa1K]

dms-ui:73ff4e6bc29b2bc965c919ece2dab9d1bd7466f5
dms:7ebf3da28e3f0558d120fd1fd04c24a071f174e3
sqle:4a5e6c84549f209380ba4cfaba41c364158b19b2

验证：

1. 创建工单时，切换选择的数据源时，在已选择了数据库的情况下，清空选择的数据库
   
2. 创建工单时，切换选择的数据源时，在网络较差的情况下，出现Loading 效果
   
3. 在编辑工单信息时，选择不同类型的数据源会自动关闭选择相同sql功能
   
4. 当审核工单后未提交便离开页面的情况下，给出提示
   
5. 数据源对应的规则模板的跳转方式调整为新开页面
   
6. 创建工单时的数据源名称显示优化
   
7. 选择文件上线模式表单样式调整
   
8. 驳回工单信息展示优化
   
9. 工单详情信息出现以及隐藏时添加动画效果
   
10. 驳回工单后修改 sql 信息限制sql上传方式为创建时的方式有隐藏改为禁用
    
11. 驳回工单后修改sql信息后进行了审核且审核成功但未提交离开页面时给出提示