qiuzhiXinxi.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235
  1. <template>
  2. <view class="jz-content-box">
  3. <view class="form-label-radio form-top-margin flex-start-row">
  4. <view class="phone-form-label"> <text class="form-label-require">*</text>类型</view>
  5. <dataChecked :list="typeList" mode="multiple" :defaultCount="9" @change="selectChangeType" @add="addType" />
  6. </view>
  7. <view class="form-label-select">
  8. <view class="phone-form-label"><text class="form-label-require">*</text>经验</view>
  9. <picker :range="jingyanList" mode='selector' :value="jingyanIndex" range-key="name"
  10. @change="jingyanChange" @cancel="jingyanCancel">
  11. <view class="form-radio-select">
  12. <view>{{ jingyan }}</view>
  13. <icon></icon>
  14. </view>
  15. </picker>
  16. </view>
  17. <view class="form-label-radio flex-start-row">
  18. <view class="phone-form-label"><text class="form-label-require">*</text>技能</view>
  19. <dataChecked :list="skillList" mode="multiple" :defaultCount="9" @change="selectChangeSkill"
  20. @add="addSkill" />
  21. </view>
  22. <view class="form-label-radio form-top-margin flex-start-row">
  23. <view class="phone-form-label"><text class="form-label-require">*</text>状态</view>
  24. <dataChecked :list="zhuangtaiList" mode="single" :showAdd="false" @change="selectChangeZhuangtai" />
  25. </view>
  26. <view class="form-label-select">
  27. <view class="phone-form-label"><text class="form-label-require"></text>薪资级别</view>
  28. <picker :range="xinziJibieList" mode='selector' @change="xinziJibieChange" @cancel="xinziJibieCancel">
  29. <view class="form-radio-select">
  30. <view>{{jibiexinzi}}</view><icon></icon>
  31. </view>
  32. </picker>
  33. </view>
  34. <view class="form-label-input">
  35. <view class="phone-form-label"><text class="form-label-require"></text>期望薪资</view>
  36. <input v-model="qiwangxinzi" placeholder="请输入期望薪资" />
  37. </view>
  38. <view class="form-label-input">
  39. <view class="phone-form-label"><text class="form-label-require"></text>工作经历</view>
  40. <input v-model="jingli" placeholder="请填写工作经历" />
  41. </view>
  42. <view class="page-btn-box">
  43. <button type="default" @click="goNext" class="phone-green-btn">下一步</button>
  44. </view>
  45. </view>
  46. </template>
  47. <script>
  48. import dataChecked from './common/dataChecked.vue';
  49. import {
  50. getJiazhengLeixing,
  51. getJiazhengJineng,
  52. getJiazhengZhuangtai,
  53. } from "@/api/jiazheng.js";
  54. export default {
  55. components: {
  56. dataChecked
  57. },
  58. // onLoad 是 uni-app 的页面生命周期钩子,不需要导入
  59. created() {
  60. this.getLeixing()
  61. this.getJineng()
  62. this.getZhuangtai()
  63. },
  64. props: {
  65. status: {
  66. type: String,
  67. }
  68. },
  69. data() {
  70. return {
  71. formData:{},
  72. // 从后端获取的技能列表
  73. skillList: [],
  74. typeList: [],
  75. leixing:"",
  76. jineng:"",
  77. zhuangtaiList: [],
  78. zhuangtai:'',
  79. jingyan:"",
  80. jingyanIndex:0,
  81. qiwangxinzi: '面议',
  82. jingli: '',
  83. xinziJibieList: ["一级", "二级","三级","四级","五级",],
  84. jibiexinzi:"",
  85. jingyanList: Array.from({length: 51}, (_, i) => i + '年'),
  86. };
  87. },
  88. methods: {
  89. // 点击完成按钮的时候触发,
  90. xinziJibieChange(e) {
  91. //通过e.detail.value获取值,获取的是自定义数据的下标
  92. const index = e.detail.value
  93. this.jibiexinzi = this.xinziJibieList[index]
  94. console.log('jibiexinzi',this.jibiexinzi);
  95. },
  96. xinziJibieCancel(e) {
  97. console.log("您已取消选择");
  98. },
  99. jingyanChange(e){
  100. const index = e.detail.value
  101. this.jingyan = this.jingyanList[index]
  102. },
  103. jingyanCancel(){
  104. this.jingyanIndex = 0
  105. },
  106. getLeixing() {
  107. getJiazhengLeixing({}).then(res => {
  108. this.skillList = this.dataConversionObject(res.data)
  109. console.log('this.skillList', this.skillList);
  110. }).catch(error => {
  111. console.error('获取技能类型失败:', error);
  112. });
  113. },
  114. getJineng() {
  115. getJiazhengJineng({}).then(res => {
  116. this.typeList = this.dataConversionObject(res.data)
  117. console.log('this.typeList', this.typeList);
  118. }).catch(error => {
  119. console.error('获取技能类型失败:', error);
  120. });
  121. },
  122. getZhuangtai() {
  123. getJiazhengZhuangtai({}).then(res => {
  124. console.log('res', res);
  125. this.zhuangtaiList = res.data
  126. // this.typeList = this.dataConversionObject(res.data)
  127. // console.log('this.typeList', this.typeList);
  128. }).catch(error => {
  129. console.error('获取技能类型失败:', error);
  130. });
  131. },
  132. dataConversionObject(data) {
  133. let newList
  134. newList = data.map((name, index) => ({
  135. id: index,
  136. name: name
  137. }));
  138. return newList
  139. },
  140. dataConversionArray(data) {
  141. let newList
  142. newList = data.map((item, index) => {
  143. return item.name
  144. });
  145. return newList
  146. },
  147. selectChangeType(data) {
  148. // console.log('typeData', data);
  149. this.leixing =this.dataConversionArray(data).join(',')
  150. console.log('this.leixing',this.leixing);
  151. },
  152. addType(newType) {
  153. this.typeList.push({
  154. ...newType,
  155. });
  156. },
  157. selectChangeSkill(data) {
  158. this.jineng =this.dataConversionArray(data).join(',')
  159. console.log('this.jineng',this.jineng);
  160. },
  161. addSkill(newSkill) {
  162. this.skillList.push({
  163. ...newSkill,
  164. });
  165. },
  166. selectChangeZhuangtai(data) {
  167. console.log('zhuangtaiData', data);
  168. this.zhuangtai =data[0].id
  169. console.log('zhuangtai', this.zhuangtai);
  170. // const index = e.detail.value
  171. // this.jingyan = this.jingyanList[index]
  172. },
  173. showAlert(){
  174. uni.showToast({
  175. title: "请勾选本人同意!",
  176. icon: 'none',
  177. duration: 2000
  178. })
  179. return false
  180. },
  181. goNext() {
  182. this.formData = {
  183. leixing:this.leixing,
  184. jingyan:this.jingyan,
  185. jineng:this.jineng,
  186. zhuangtai:this.zhuangtai,
  187. jibiexinzi:this.jibiexinzi,
  188. qiwangxinzi:this.qiwangxinzi,
  189. jingli:this.jingli,
  190. }
  191. if(!this.formData.leixing){
  192. uni.showToast({
  193. title: "请选择类型!",
  194. icon: 'none',
  195. duration: 2000
  196. })
  197. return false
  198. }
  199. if(!this.formData.jingyan){
  200. uni.showToast({
  201. title: "请选择经验年限!",
  202. icon: 'none',
  203. duration: 2000
  204. })
  205. return false
  206. }
  207. if(!this.formData.jineng){
  208. uni.showToast({
  209. title: "请选择相应技能!",
  210. icon: 'none',
  211. duration: 2000
  212. })
  213. return false
  214. }
  215. if(!this.formData.zhuangtai){
  216. uni.showToast({
  217. title: "请选择相应状态!",
  218. icon: 'none',
  219. duration: 2000
  220. })
  221. return false
  222. }
  223. this.$emit('goNext',this.formData,1);
  224. },
  225. }
  226. };
  227. </script>